@sc-360-v2/storefront-cms-library 0.5.59 → 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 (201) hide show
  1. package/dist/add-existing-form.scss +13 -5
  2. package/dist/add-order.scss +129 -245
  3. package/dist/add-products-tab-details.scss +1048 -2097
  4. package/dist/add-products-tab.scss +666 -1204
  5. package/dist/allocation-header-quota-details.scss +198 -411
  6. package/dist/allocationDetails.scss +1645 -2126
  7. package/dist/allocations-quota-details.scss +168 -327
  8. package/dist/allocations.scss +476 -797
  9. package/dist/amount-estimator.scss +405 -743
  10. package/dist/animation-control.scss +23 -23
  11. package/dist/badge.scss +43 -18
  12. package/dist/brand-basic-elements.scss +76 -124
  13. package/dist/brand.scss +28 -55
  14. package/dist/breadcrumbs.scss +356 -718
  15. package/dist/builder.js +1 -1
  16. package/dist/bulk-variant-picker.scss +1133 -2034
  17. package/dist/bundle copy.scss +235 -0
  18. package/dist/bundle.scss +843 -1479
  19. package/dist/bundleDetails.scss +3774 -5063
  20. package/dist/button copy.scss +28 -0
  21. package/dist/button.scss +78 -103
  22. package/dist/buy-for-tab-container.scss +77 -106
  23. package/dist/buy-for-tabs-container-item.scss +80 -80
  24. package/dist/buyForHeaders.scss +1725 -2988
  25. package/dist/cart-details.scss +491 -1012
  26. package/dist/cart-products-sidebar.scss +211 -211
  27. package/dist/cart-summary.scss +559 -1152
  28. package/dist/cart-wrapper.scss +85 -127
  29. package/dist/cart.scss +115 -223
  30. package/dist/cartAttributes.scss +367 -647
  31. package/dist/cartGrouping.scss +89 -89
  32. package/dist/category-groups-element.scss +127 -108
  33. package/dist/category-groups-product-grid.scss +40 -79
  34. package/dist/category-groups-product-image.scss +457 -1390
  35. package/dist/category-groups-product-options.scss +224 -693
  36. package/dist/category-groups-product-price.scss +1326 -4859
  37. package/dist/category-groups-quota-details.scss +217 -466
  38. package/dist/category.scss +26 -50
  39. package/dist/categoryDetails.scss +61 -61
  40. package/dist/categoryWidget.scss +34 -34
  41. package/dist/checkbox-radio.scss +124 -124
  42. package/dist/checkout.scss +1858 -4170
  43. package/dist/common-element.scss +35 -35
  44. package/dist/confirm-modal.scss +22 -2
  45. package/dist/confirmationModal.scss +139 -139
  46. package/dist/container.scss +32 -54
  47. package/dist/countdown.scss +256 -443
  48. package/dist/coupon.scss +355 -714
  49. package/dist/custom-fonts.scss +100 -100
  50. package/dist/default-dropdown.scss +12 -1
  51. package/dist/embroider-preview-element.scss +94 -94
  52. package/dist/embroider-template-1-v2.scss +123 -172
  53. package/dist/embroider-template-1.scss +68 -104
  54. package/dist/embroidery.scss +30 -31
  55. package/dist/employee-bulk-order.scss +418 -142
  56. package/dist/emtpy-templates.scss +165 -165
  57. package/dist/faq.scss +235 -419
  58. package/dist/filter-results.scss +125 -265
  59. package/dist/filters.scss +831 -1682
  60. package/dist/flex-text-editor.scss +271 -271
  61. package/dist/functions.scss +36 -0
  62. package/dist/gallery-slider-temp.scss +435 -758
  63. package/dist/global-styles.scss +23 -7
  64. package/dist/grid.scss +25 -33
  65. package/dist/hotspot.scss +69 -119
  66. package/dist/icon-list.scss +30 -59
  67. package/dist/image-for-product.scss +21 -21
  68. package/dist/image-temp.scss +21 -20
  69. package/dist/item-stock.scss +9 -16
  70. package/dist/kitDetails.scss +2719 -4299
  71. package/dist/kits.scss +24 -19
  72. package/dist/language-selector.scss +233 -375
  73. package/dist/last-x-orders.scss +101 -187
  74. package/dist/layouter-item.scss +75 -103
  75. package/dist/layouter-pro-item.scss +89 -95
  76. package/dist/layouter-pro.scss +87 -92
  77. package/dist/layouter.scss +67 -117
  78. package/dist/light-box-v2.scss +89 -104
  79. package/dist/lightbox.scss +78 -78
  80. package/dist/line.scss +29 -70
  81. package/dist/loader.scss +37 -37
  82. package/dist/login.scss +291 -572
  83. package/dist/map.scss +220 -369
  84. package/dist/marchandiserSets.scss +95 -104
  85. package/dist/mega-menu-container.scss +96 -109
  86. package/dist/mega-menu.scss +624 -734
  87. package/dist/menu-item.scss +19 -19
  88. package/dist/menu-v2.scss +507 -619
  89. package/dist/multi-select-dropdown.scss +27 -3
  90. package/dist/my-templates.scss +38 -9
  91. package/dist/myTemplates.scss +3 -0
  92. package/dist/option-bar.scss +215 -375
  93. package/dist/order-processing.scss +61 -61
  94. package/dist/order-status.scss +643 -1117
  95. package/dist/overflow-module.scss +62 -63
  96. package/dist/past-orders.scss +118 -149
  97. package/dist/payment-methods.scss +46 -30
  98. package/dist/pickup-locations.scss +564 -1121
  99. package/dist/position-module.scss +98 -95
  100. package/dist/prefix-list.scss +97 -86
  101. package/dist/product-actions.scss +1230 -1783
  102. package/dist/product-basic-elements.scss +108 -169
  103. package/dist/product-highlights.scss +116 -157
  104. package/dist/product-image-bundles.scss +345 -671
  105. package/dist/product-image.scss +341 -724
  106. package/dist/product-inventory.scss +673 -1357
  107. package/dist/product-labels.scss +94 -113
  108. package/dist/product-options.scss +288 -486
  109. package/dist/product-price.scss +1284 -2556
  110. package/dist/product-promotions.scss +1388 -2830
  111. package/dist/product-sizechart.scss +516 -905
  112. package/dist/product.scss +28 -61
  113. package/dist/productDetails.scss +19 -38
  114. package/dist/profile.scss +231 -447
  115. package/dist/quantity-selector.scss +313 -550
  116. package/dist/quick-inventory-check.scss +101 -187
  117. package/dist/quick-links.scss +56 -133
  118. package/dist/quick-order-pad.scss +216 -269
  119. package/dist/quota-details.scss +163 -297
  120. package/dist/quotes.scss +82 -121
  121. package/dist/repeater copy.scss +24 -0
  122. package/dist/repeater-embla-controls.scss +34 -14
  123. package/dist/repeater-grid-toggle.scss +156 -166
  124. package/dist/repeater-item.scss +41 -64
  125. package/dist/repeater.scss +579 -688
  126. package/dist/request-for-quotes.scss +66 -16
  127. package/dist/responsive-behaviour.scss +31 -29
  128. package/dist/rfqs.scss +118 -181
  129. package/dist/scroll.scss +89 -167
  130. package/dist/search.scss +179 -326
  131. package/dist/section.scss +27 -51
  132. package/dist/shareCartSideBar.scss +254 -254
  133. package/dist/shipping-estimator.scss +41 -41
  134. package/dist/shipping-payments.scss +198 -58
  135. package/dist/simple-list.scss +65 -135
  136. package/dist/social.scss +78 -143
  137. package/dist/sort.scss +89 -89
  138. package/dist/stack.scss +23 -34
  139. package/dist/static-global.scss +44 -26
  140. package/dist/static-text.scss +52 -52
  141. package/dist/stockStatus.scss +11 -19
  142. package/dist/store-locations.scss +587 -1113
  143. package/dist/sub-category.scss +74 -74
  144. package/dist/submit-quote.scss +275 -275
  145. package/dist/tab-container-item.scss +80 -80
  146. package/dist/tab-container.scss +81 -108
  147. package/dist/tab-v2.scss +277 -604
  148. package/dist/table-common.scss +215 -406
  149. package/dist/table.scss +267 -509
  150. package/dist/text-temp-v2.scss +12 -23
  151. package/dist/text-temp.scss +110 -109
  152. package/dist/theme-classes.scss +17 -13
  153. package/dist/toggle-button.scss +32 -32
  154. package/dist/transform-properties-module.scss +20 -20
  155. package/dist/types/builder/tools/element-edit/addProductsTab.d.ts +108 -0
  156. package/dist/types/builder/tools/element-edit/breadcrumbs.d.ts +6 -0
  157. package/dist/types/builder/tools/element-edit/bundle.d.ts +22 -0
  158. package/dist/types/builder/tools/element-edit/bundleDetails.d.ts +64 -0
  159. package/dist/types/builder/tools/element-edit/buttonInstance.d.ts +10 -0
  160. package/dist/types/builder/tools/element-edit/buyForWithTab.d.ts +84 -0
  161. package/dist/types/builder/tools/element-edit/cart.d.ts +6 -0
  162. package/dist/types/builder/tools/element-edit/cartAttributes.d.ts +60 -0
  163. package/dist/types/builder/tools/element-edit/cartDetails.d.ts +16 -0
  164. package/dist/types/builder/tools/element-edit/cartSummary.d.ts +202 -0
  165. package/dist/types/builder/tools/element-edit/categoryGroups.d.ts +158 -0
  166. package/dist/types/builder/tools/element-edit/checkout.d.ts +172 -0
  167. package/dist/types/builder/tools/element-edit/common.d.ts +2 -0
  168. package/dist/types/builder/tools/element-edit/countdown.d.ts +44 -0
  169. package/dist/types/builder/tools/element-edit/coupon.d.ts +28 -0
  170. package/dist/types/builder/tools/element-edit/embroidery.d.ts +37 -0
  171. package/dist/types/builder/tools/element-edit/filterResults.d.ts +4 -0
  172. package/dist/types/builder/tools/element-edit/icon-list.d.ts +11 -0
  173. package/dist/types/builder/tools/element-edit/itemStock.d.ts +2 -0
  174. package/dist/types/builder/tools/element-edit/kitDetails.d.ts +66 -0
  175. package/dist/types/builder/tools/element-edit/kits.d.ts +4 -0
  176. package/dist/types/builder/tools/element-edit/map.d.ts +5 -1
  177. package/dist/types/builder/tools/element-edit/marchandiserSets.d.ts +2 -0
  178. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +17 -0
  179. package/dist/types/builder/tools/element-edit/paymentMethods.d.ts +6 -0
  180. package/dist/types/builder/tools/element-edit/productCustomizations.d.ts +14 -0
  181. package/dist/types/builder/tools/element-edit/quickLinks.d.ts +26 -0
  182. package/dist/types/builder/tools/element-edit/scroll.d.ts +2 -11
  183. package/dist/types/builder/tools/element-edit/search.d.ts +1 -0
  184. package/dist/types/builder/tools/element-edit/searchResultsHeading.d.ts +6 -0
  185. package/dist/types/builder/tools/element-edit/shipping-payments.d.ts +72 -0
  186. package/dist/types/builder/tools/element-edit/shippingEstimator.d.ts +4 -0
  187. package/dist/types/builder/tools/element-edit/social.d.ts +2 -0
  188. package/dist/types/builder/tools/element-edit/spotlight.d.ts +2 -0
  189. package/dist/types/builder/tools/element-edit/table.d.ts +10 -0
  190. package/dist/types/builder/tools/element-edit/tabs.d.ts +6 -0
  191. package/dist/types/builder/tools/element-edit/typographyInstance.d.ts +110 -0
  192. package/dist/types/builder/tools/element-edit/userElements.d.ts +50 -11
  193. package/dist/types/builder/tools/element-edit/variantPicker.d.ts +4 -0
  194. package/dist/types/builder/tools/element-edit/video.d.ts +22 -0
  195. package/dist/uom-selector.scss +489 -943
  196. package/dist/user-elements.scss +537 -826
  197. package/dist/variant-picker.scss +1282 -2559
  198. package/dist/video.scss +147 -325
  199. package/dist/volume-pricing.scss +539 -1035
  200. package/dist/wishlist-overlay.scss +48 -48
  201. package/package.json +131 -131
package/dist/bundle.scss CHANGED
@@ -9,79 +9,100 @@ $resizeActive: '[data-cms-element-resizer="true"]';
9
9
 
10
10
  @mixin NAVIGATION_STYLES($type: 1) {
11
11
  $TYPE: "cy";
12
- @if ($type == 2) {
12
+
13
+ @if ($type ==2) {
13
14
  $TYPE: "pt";
14
15
  }
15
- $size: var(
16
- --_sf-icn-size,
17
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-in-se, 16px)}
18
- );
19
- $clr: var(
20
- --_sf-icn-clr,
21
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-in-c1, #000)}
22
- );
23
- $perc: 1.75;
24
- display: var(--_d-flex);
25
- align-items: center;
26
- justify-content: center;
27
- width: calc(#{$size} * #{$perc});
28
- height: calc(#{$size} * #{$perc});
29
- background: var(
30
- --_sf-icn-bg,
31
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-bd-cr)}
32
- );
33
- border-radius: var(
34
- --_sf-icn-brs,
35
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-rs)}
36
- );
37
- // Border is only drawn when the "Show Border" toggle is on. The renderer emits
38
- // data-show-border="false" when the toggle is off; an absent/"true" value keeps
39
- // the border (so existing arrows that don't set the attribute are unaffected).
40
- &:not([data-show-border="false"]) {
41
- border-color: var(
42
- --_sf-icn-br,
43
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-cr)}
44
- );
45
- border-width: var(
46
- --_sf-icn-bw,
47
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-wh)}
48
- );
49
- border-style: var(
50
- --_sf-icn-bs,
51
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-se)}
52
- );
53
- }
54
- // Hide the arrow glyph when the "Show Icon" toggle is off.
55
- &[data-show-icon="false"] > span {
56
- display: none;
57
- }
58
- &:disabled {
59
- opacity: 0.65;
60
- cursor: no-drop;
61
- }
62
16
 
63
- &:hover {
64
- --_sf-icn-size: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-in-se)};
65
- --_sf-icn-clr: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-in-c1)};
66
- --_sf-icn-bg: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-bd-cr)};
67
- --_sf-icn-br: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-cr)};
68
- --_sf-icn-bw: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-wh)};
69
- --_sf-icn-bs: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-se)};
70
- --_sf-icn-brs: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-rs)};
71
- }
72
- & > span {
73
- display: var(--_d-flex);
17
+ $size: var(--_sf-icn-size,
18
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-in-se, 16px)
19
+ });
20
+ $clr: var(--_sf-icn-clr,
21
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-in-c1, #000)
22
+ });
23
+ $perc: 1.75;
24
+ display: var(--_d-flex);
25
+ align-items: center;
26
+ justify-content: center;
27
+ width: calc(#{$size} * #{$perc});
28
+ height: calc(#{$size} * #{$perc});
29
+ background: var(--_sf-icn-bg,
30
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-bd-cr)
31
+ });
32
+ border-radius: var(--_sf-icn-brs,
33
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-rs)
34
+ });
35
+
36
+ // Border is only drawn when the "Show Border" toggle is on. The renderer emits
37
+ // data-show-border="false" when the toggle is off; an absent/"true" value keeps
38
+ // the border (so existing arrows that don't set the attribute are unaffected).
39
+ &:not([data-show-border="false"]) {
40
+ border-color: var(--_sf-icn-br,
41
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-cr)
42
+ });
43
+ border-width: var(--_sf-icn-bw,
44
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-wh)
45
+ });
46
+ border-style: var(--_sf-icn-bs,
47
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-dt-se-br-se)
48
+ });
49
+ }
74
50
 
75
- svg {
76
- width: #{$size};
77
- height: #{$size};
51
+ // Hide the arrow glyph when the "Show Icon" toggle is off.
52
+ &[data-show-icon="false"]>span {
53
+ display: none;
54
+ }
78
55
 
79
- path {
80
- stroke: #{$clr};
81
- }
56
+ &:disabled {
57
+ opacity: 0.65;
58
+ cursor: no-drop;
59
+ }
60
+
61
+ &:hover {
62
+ --_sf-icn-size: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-in-se)
63
+ }
64
+
65
+ ;
66
+ --_sf-icn-clr: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-in-c1)
67
+ }
68
+
69
+ ;
70
+ --_sf-icn-bg: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-bd-cr)
71
+ }
72
+
73
+ ;
74
+ --_sf-icn-br: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-cr)
75
+ }
76
+
77
+ ;
78
+ --_sf-icn-bw: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-wh)
79
+ }
80
+
81
+ ;
82
+ --_sf-icn-bs: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-se)
83
+ }
84
+
85
+ ;
86
+ --_sf-icn-brs: #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-#{$TYPE}-sr-hr-se-br-rs)
87
+ }
88
+
89
+ ;
90
+ }
91
+
92
+ &>span {
93
+ display: var(--_d-flex);
94
+
95
+ svg {
96
+ width: #{$size};
97
+ height: #{$size};
98
+
99
+ path {
100
+ stroke: #{$clr};
82
101
  }
83
102
  }
84
103
  }
104
+ }
105
+
85
106
  [data-div-type="element"] {
86
107
  &[data-element-type="bundle"] {
87
108
  // height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht))) !important;
@@ -103,12 +124,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
103
124
  // )
104
125
  // )
105
126
  // );
106
- width: var(
107
- --_sf-el-wh-st-mx,
108
- calc(
109
- 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
110
- )
111
- );
127
+ width: var(--_sf-el-wh-st-mx,
128
+ calc(1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))));
112
129
  // min-height: var();
113
130
  // height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht)));
114
131
 
@@ -146,10 +163,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
146
163
  // min-height: 100px !important;
147
164
  // }
148
165
 
149
- & > .wrapper {
166
+ &>.wrapper {
150
167
  width: 100%;
151
168
  // height: 100%;
152
169
  }
170
+
153
171
  .embla {
154
172
  width: 100%;
155
173
  // height: 100%;
@@ -173,61 +191,26 @@ $resizeActive: '[data-cms-element-resizer="true"]';
173
191
  display: grid;
174
192
  grid-template-rows: 100%;
175
193
 
176
- grid-template-columns: repeat(
177
- var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))),
178
- calc(
179
- (
180
- 100% -
181
- (
182
- var(
183
- --_ctm-mob-lt-is-pr-se,
184
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))
185
- ) -
186
- 1
187
- ) *
188
- var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)))
189
- ) /
190
- var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se)))
191
- )
192
- );
194
+ grid-template-columns: repeat(var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))),
195
+ calc((100% - (var(--_ctm-mob-lt-is-pr-se,
196
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))) - 1) * var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)))) / var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se)))));
193
197
 
194
198
  grid-auto-flow: column;
195
199
  gap: var(--_ctm-mob-lt-im-gp, var(--_ctm-tab-lt-im-gp, var(--_ctm-lt-im-gp)));
196
200
 
197
201
  &[data-control-type="Bottom"][data-slider-control="Arrows"] {
198
- height: calc(
199
- 100% - calc(
200
- var(
201
- --_ctm-mob-dn-pn-as-aw-se,
202
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
203
- ) +
204
- 10px
205
- )
206
- );
202
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-as-aw-se,
203
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) + 10px));
207
204
  }
208
205
 
209
206
  &[data-control-type="Bottom"][data-slider-control="Pagination Line"] {
210
- height: calc(
211
- 100% - calc(
212
- var(
213
- --_ctm-mob-dn-pn-le-le-ht,
214
- var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
215
- ) +
216
- 20px
217
- )
218
- );
207
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-le-le-ht,
208
+ var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))) + 20px));
219
209
  }
220
210
 
221
211
  &[data-control-type="Bottom"][data-slider-control="Dots"] {
222
- height: calc(
223
- 100% - calc(
224
- var(
225
- --_ctm-mob-dn-pn-ds-dt-se,
226
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
227
- ) +
228
- 20px
229
- )
230
- );
212
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-ds-dt-se,
213
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))) + 20px));
231
214
  }
232
215
 
233
216
  .embla__slide {
@@ -236,22 +219,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
236
219
  }
237
220
  }
238
221
  }
222
+
239
223
  &:not([data-display-style="Column"]) {
240
224
  .embla__container {
241
- grid-auto-columns: calc(
242
- (
243
- 100% -
244
- (
245
- var(
246
- --_ctm-mob-lt-is-pr-se,
247
- var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))
248
- ) -
249
- 1
250
- ) *
251
- var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)))
252
- ) /
253
- var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se)))
254
- );
225
+ grid-auto-columns: calc((100% - (var(--_ctm-mob-lt-is-pr-se,
226
+ var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))) - 1) * var(--_ctm-mob-lt-im-sg, var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg)))) / var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))));
255
227
  }
256
228
  }
257
229
 
@@ -261,6 +233,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
261
233
  .embla__viewport {
262
234
  .embla__container {
263
235
  display: flex;
236
+
264
237
  .embla__slide {
265
238
  width: unset;
266
239
  height: 100%;
@@ -278,20 +251,25 @@ $resizeActive: '[data-cms-element-resizer="true"]';
278
251
  width: 100%;
279
252
  justify-content: space-between;
280
253
  transform: translate(-50%, -50%);
254
+
281
255
  // padding-left: 20px;
282
256
  &[data-control-type="Side"] {
257
+
283
258
  .left-button,
284
259
  .right-button {
285
260
  background-color: transparent;
286
261
  }
287
262
  }
263
+
288
264
  &[data-background-shape="Round"] {
265
+
289
266
  .left-button,
290
267
  .right-button {
291
268
  background-color: #f2f5f5;
292
269
  box-sizing: 0 4px 8px rgba(0, 0, 0, 0.1);
293
270
  }
294
271
  }
272
+
295
273
  &[data-control-type="Bottom-Overflow"] {
296
274
  transform: translateX(-50%);
297
275
  width: 100%;
@@ -300,6 +278,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
300
278
  top: unset;
301
279
  bottom: 6px;
302
280
  }
281
+
303
282
  &[data-control-type="Bottom"] {
304
283
  transform: unset;
305
284
  position: static;
@@ -308,18 +287,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
308
287
  gap: 12px;
309
288
  margin-top: 10px;
310
289
  }
290
+
311
291
  .left-button {
312
292
  padding: 10px;
313
293
  border-radius: 50%;
314
294
  border: none;
315
- width: var(
316
- --_ctm-mob-dn-pn-as-aw-se,
317
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
318
- );
319
- height: var(
320
- --_ctm-mob-dn-pn-as-aw-se,
321
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
322
- );
295
+ width: var(--_ctm-mob-dn-pn-as-aw-se,
296
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
297
+ height: var(--_ctm-mob-dn-pn-as-aw-se,
298
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
323
299
 
324
300
  display: flex;
325
301
  align-items: center;
@@ -327,6 +303,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
327
303
  cursor: pointer;
328
304
  outline: none;
329
305
  margin-left: 12px;
306
+
330
307
  &:disabled {
331
308
  & svg {
332
309
  path {
@@ -335,17 +312,14 @@ $resizeActive: '[data-cms-element-resizer="true"]';
335
312
  }
336
313
  }
337
314
  }
315
+
338
316
  .right-button {
339
317
  border-radius: 50%;
340
318
  border: none;
341
- width: var(
342
- --_ctm-mob-dn-pn-as-aw-se,
343
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
344
- );
345
- height: var(
346
- --_ctm-mob-dn-pn-as-aw-se,
347
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
348
- );
319
+ width: var(--_ctm-mob-dn-pn-as-aw-se,
320
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
321
+ height: var(--_ctm-mob-dn-pn-as-aw-se,
322
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
349
323
 
350
324
  display: flex;
351
325
  align-items: center;
@@ -363,30 +337,19 @@ $resizeActive: '[data-cms-element-resizer="true"]';
363
337
  }
364
338
  }
365
339
  }
340
+
366
341
  .icon {
367
342
  display: flex;
368
343
 
369
344
  svg {
370
- width: calc(
371
- var(
372
- --_ctm-mob-dn-pn-as-aw-se,
373
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
374
- ) *
375
- 0.5
376
- );
377
- height: calc(
378
- var(
379
- --_ctm-mob-dn-pn-as-aw-se,
380
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
381
- ) *
382
- 0.5
383
- );
345
+ width: calc(var(--_ctm-mob-dn-pn-as-aw-se,
346
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
347
+ height: calc(var(--_ctm-mob-dn-pn-as-aw-se,
348
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
384
349
 
385
350
  path {
386
- stroke: var(
387
- --_ctm-mob-dn-pn-as-aw-cr,
388
- var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr))
389
- );
351
+ stroke: var(--_ctm-mob-dn-pn-as-aw-cr,
352
+ var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr)));
390
353
  }
391
354
  }
392
355
  }
@@ -402,6 +365,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
402
365
  width: calc(100% - 120px);
403
366
  margin-inline: auto;
404
367
  }
368
+
405
369
  .left-button {
406
370
  position: absolute;
407
371
  left: 0;
@@ -411,6 +375,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
411
375
 
412
376
  @include NAVIGATION_STYLES(1);
413
377
  }
378
+
414
379
  .right-button {
415
380
  position: absolute;
416
381
  z-index: 2;
@@ -429,9 +394,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
429
394
  &[data-thumbnail-placement="top"] {
430
395
  flex-direction: column-reverse;
431
396
  }
397
+
432
398
  &[data-thumbnail-placement="bottom"] {
433
399
  flex-direction: column;
434
400
  }
401
+
435
402
  &[data-thumbnail-placement="left"] {
436
403
  flex-direction: row-reverse;
437
404
 
@@ -445,8 +412,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
445
412
  }
446
413
  }
447
414
  }
415
+
448
416
  &[data-thumbnail-placement="right"] {
449
417
  flex-direction: row;
418
+
450
419
  .embla__thumbs {
451
420
  width: var(--_ctm-mob-lt-tl-se, var(--_ctm-tab-lt-tl-se, var(--_ctm-lt-tl-se)));
452
421
 
@@ -459,40 +428,26 @@ $resizeActive: '[data-cms-element-resizer="true"]';
459
428
  }
460
429
  }
461
430
  }
431
+
462
432
  .bundle__element__container {
463
433
  // height: 100%;
464
- background-color: var(
465
- --_ctm-mob-dn-wt-se-bd-cr,
466
- var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
467
- );
468
-
469
- border-color: var(
470
- --_ctm-mob-dn-wt-se-br-cr,
471
- var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
472
- );
473
-
474
- border-style: var(
475
- --_ctm-mob-dn-wt-se-br-se,
476
- var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
477
- );
478
-
479
- border-width: var(
480
- --_ctm-mob-dn-wt-se-br-wh,
481
- var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
482
- );
483
-
484
- border-radius: var(
485
- --_ctm-mob-dn-wt-se-br-rs,
486
- var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
487
- );
488
-
489
- box-shadow: var(
490
- --_show-shadow,
491
- var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
492
- var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
493
- var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
494
- var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
495
- );
434
+ background-color: var(--_ctm-mob-dn-wt-se-bd-cr,
435
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr)));
436
+
437
+ border-color: var(--_ctm-mob-dn-wt-se-br-cr,
438
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr)));
439
+
440
+ border-style: var(--_ctm-mob-dn-wt-se-br-se,
441
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se)));
442
+
443
+ border-width: var(--_ctm-mob-dn-wt-se-br-wh,
444
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh)));
445
+
446
+ border-radius: var(--_ctm-mob-dn-wt-se-br-rs,
447
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs)));
448
+
449
+ box-shadow: var(--_show-shadow,
450
+ 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))));
496
451
 
497
452
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
498
453
  display: flex;
@@ -501,214 +456,134 @@ $resizeActive: '[data-cms-element-resizer="true"]';
501
456
 
502
457
  .bundle__tabs {
503
458
  width: 100%;
504
- background-color: var(
505
- --_ctm-mob-dn-be-ts-wt-se-bd-cr,
506
- var(--_ctm-tab-dn-be-ts-wt-se-bd-cr, var(--_ctm-dn-be-ts-wt-se-bd-cr))
507
- );
459
+ background-color: var(--_ctm-mob-dn-be-ts-wt-se-bd-cr,
460
+ var(--_ctm-tab-dn-be-ts-wt-se-bd-cr, var(--_ctm-dn-be-ts-wt-se-bd-cr)));
508
461
  // padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
509
462
  display: flex;
510
463
  flex-direction: column;
511
- --_sf-gp: var(
512
- --_ctm-mob-lt-im-sg,
513
- var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
514
- );
464
+ --_sf-gp: var(--_ctm-mob-lt-im-sg,
465
+ var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px)));
515
466
  --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
516
467
  row-gap: var(--_sf-gp);
517
468
  width: 100%;
469
+
518
470
  // height: 100%;
519
471
  // Border only drawn when the widget's "Show Border" toggle is on. The
520
472
  // renderer emits data-show-border="true"/"" on the .bundle__tabs container.
521
473
  &[data-show-border="true"] {
522
- border-color: var(
523
- --_ctm-mob-dn-be-ts-wt-se-br-cr,
524
- var(--_ctm-tab-dn-be-ts-wt-se-br-cr, var(--_ctm-dn-be-ts-wt-se-br-cr))
525
- );
526
- border-style: var(
527
- --_ctm-mob-dn-be-ts-wt-se-br-se,
528
- var(--_ctm-tab-dn-be-ts-wt-se-br-se, var(--_ctm-dn-be-ts-wt-se-br-se))
529
- );
530
- border-width: var(
531
- --_ctm-mob-dn-be-ts-wt-se-br-wh,
532
- var(--_ctm-tab-dn-be-ts-wt-se-br-wh, var(--_ctm-dn-be-ts-wt-se-br-wh))
533
- );
474
+ border-color: var(--_ctm-mob-dn-be-ts-wt-se-br-cr,
475
+ var(--_ctm-tab-dn-be-ts-wt-se-br-cr, var(--_ctm-dn-be-ts-wt-se-br-cr)));
476
+ border-style: var(--_ctm-mob-dn-be-ts-wt-se-br-se,
477
+ var(--_ctm-tab-dn-be-ts-wt-se-br-se, var(--_ctm-dn-be-ts-wt-se-br-se)));
478
+ border-width: var(--_ctm-mob-dn-be-ts-wt-se-br-wh,
479
+ var(--_ctm-tab-dn-be-ts-wt-se-br-wh, var(--_ctm-dn-be-ts-wt-se-br-wh)));
534
480
  }
535
- border-radius: var(
536
- --_ctm-mob-dn-be-ts-wt-se-br-rs,
537
- var(--_ctm-tab-dn-be-ts-wt-se-br-rs, var(--_ctm-dn-be-ts-wt-se-br-rs))
538
- );
539
- box-shadow: var(
540
- --_show-shadow,
541
- var(
542
- --_ctm-mob-dn-be-ts-wt-se-sw-ae,
543
- var(--_ctm-tab-dn-be-ts-wt-se-sw-ae, var(--_ctm-dn-be-ts-wt-se-sw-ae))
544
- )
545
- var(
546
- --_ctm-mob-dn-be-ts-wt-se-sw-br,
547
- var(--_ctm-tab-dn-be-ts-wt-se-sw-br, var(--_ctm-dn-be-ts-wt-se-sw-br))
548
- )
549
- var(
550
- --_ctm-mob-dn-be-ts-wt-se-sw-sd,
551
- var(--_ctm-tab-dn-be-ts-wt-se-sw-sd, var(--_ctm-dn-be-ts-wt-se-sw-sd))
552
- )
553
- var(
554
- --_ctm-mob-dn-be-ts-wt-se-sw-cr,
555
- var(--_ctm-tab-dn-be-ts-wt-se-sw-cr, var(--_ctm-dn-be-ts-wt-se-sw-cr))
556
- )
557
- );
481
+
482
+ border-radius: var(--_ctm-mob-dn-be-ts-wt-se-br-rs,
483
+ var(--_ctm-tab-dn-be-ts-wt-se-br-rs, var(--_ctm-dn-be-ts-wt-se-br-rs)));
484
+ box-shadow: var(--_show-shadow,
485
+ var(--_ctm-mob-dn-be-ts-wt-se-sw-ae,
486
+ var(--_ctm-tab-dn-be-ts-wt-se-sw-ae, var(--_ctm-dn-be-ts-wt-se-sw-ae))) var(--_ctm-mob-dn-be-ts-wt-se-sw-br,
487
+ var(--_ctm-tab-dn-be-ts-wt-se-sw-br, var(--_ctm-dn-be-ts-wt-se-sw-br))) var(--_ctm-mob-dn-be-ts-wt-se-sw-sd,
488
+ var(--_ctm-tab-dn-be-ts-wt-se-sw-sd, var(--_ctm-dn-be-ts-wt-se-sw-sd))) var(--_ctm-mob-dn-be-ts-wt-se-sw-cr,
489
+ var(--_ctm-tab-dn-be-ts-wt-se-sw-cr, var(--_ctm-dn-be-ts-wt-se-sw-cr))));
490
+
558
491
  .profile__button {
559
492
  &[data-show-shadow="false"] {
560
493
  --_show-shadow: none;
561
494
  }
495
+
562
496
  &[data-icon-position="left"] {
563
497
  --_sf-fd-bn: row;
564
498
  }
499
+
565
500
  &[data-icon-position="right"] {
566
501
  --_sf-fd-bn: row-reverse;
567
502
  }
503
+
568
504
  &[data-icon-position="center"] {
569
505
  --_sf-fd-bn: row;
570
506
  }
571
507
 
572
508
  &:hover {
573
- --_sf-hr-bd-cr: var(
574
- --_ctm-mob-dn-be-ts-be-tb-hr-se-bd-cr,
575
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-bd-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-bd-cr))
576
- );
577
- --_sf-hr-br-cr: var(
578
- --_ctm-mob-dn-be-ts-be-tb-hr-se-br-cr,
579
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-br-cr))
580
- );
581
- --_sf-hr-br-se: var(
582
- --_ctm-mob-dn-be-ts-be-tb-hr-se-br-se,
583
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-se, var(--_ctm-dn-be-ts-be-tb-hr-se-br-se))
584
- );
585
- --_sf-hr-br-wh: var(
586
- --_ctm-mob-dn-be-ts-be-tb-hr-se-br-wh,
587
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-wh, var(--_ctm-dn-be-ts-be-tb-hr-se-br-wh))
588
- );
589
- --_sf-hr-br-rs: var(
590
- --_ctm-mob-dn-be-ts-be-tb-hr-se-br-rs,
591
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-rs, var(--_ctm-dn-be-ts-be-tb-hr-se-br-rs))
592
- );
593
- --_sf-hr-at: var(
594
- --_ctm-mob-dn-be-ts-be-tb-hr-se-at,
595
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-at, var(--_ctm-dn-be-ts-be-tb-hr-se-at))
596
- );
597
- --_sf-hr-in-ad-tt-sg: var(
598
- --_ctm-mob-dn-be-ts-be-tb-hr-se-in-ad-tt-sg,
599
- var(
600
- --_ctm-tab-dn-be-ts-be-tb-hr-se-in-ad-tt-sg,
601
- var(--_ctm-dn-be-ts-be-tb-hr-se-in-ad-tt-sg)
602
- )
603
- );
509
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-bd-cr,
510
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-bd-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-bd-cr)));
511
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-br-cr,
512
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-br-cr)));
513
+ --_sf-hr-br-se: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-br-se,
514
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-se, var(--_ctm-dn-be-ts-be-tb-hr-se-br-se)));
515
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-br-wh,
516
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-wh, var(--_ctm-dn-be-ts-be-tb-hr-se-br-wh)));
517
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-br-rs,
518
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-br-rs, var(--_ctm-dn-be-ts-be-tb-hr-se-br-rs)));
519
+ --_sf-hr-at: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-at,
520
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-at, var(--_ctm-dn-be-ts-be-tb-hr-se-at)));
521
+ --_sf-hr-in-ad-tt-sg: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-in-ad-tt-sg,
522
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-ad-tt-sg,
523
+ var(--_ctm-dn-be-ts-be-tb-hr-se-in-ad-tt-sg)));
604
524
 
605
525
  // for shadow
606
- --_sf-hr-sw-ae: var(
607
- --_ctm-mob-dn-be-ts-be-tb-hr-se-sw-ae,
608
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-ae, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-ae))
609
- );
610
- --_sf-hr-sw-br: var(
611
- --_ctm-mob-dn-be-ts-be-tb-hr-se-sw-br,
612
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-br, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-br))
613
- );
614
- --_sf-hr-sw-hr: var(
615
- --_ctm-mob-dn-be-ts-be-tb-hr-se-sw-hr,
616
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-hr, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-hr))
617
- );
618
- --_sf-hr-sw-cr: var(
619
- --_ctm-mob-dn-be-ts-be-tb-hr-se-sw-cr,
620
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-cr))
621
- );
526
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-sw-ae,
527
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-ae, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-ae)));
528
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-sw-br,
529
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-br, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-br)));
530
+ --_sf-hr-sw-hr: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-sw-hr,
531
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-hr, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-hr)));
532
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-sw-cr,
533
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-sw-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-sw-cr)));
622
534
 
623
535
  // for font
624
536
 
625
- --_sf-hr-cr: var(
626
- --_ctm-mob-dn-be-ts-be-tb-hr-se-cr,
627
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-cr))
628
- );
629
- --_sf-hr-ft-fy: var(
630
- --_ctm-mob-dn-be-ts-be-tb-hr-se-ft-fy,
631
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-fy, var(--_ctm-dn-be-ts-be-tb-hr-se-ft-fy))
632
- );
633
- --_sf-hr-tt-tm: var(
634
- --_ctm-mob-dn-be-ts-be-tb-hr-se-tt-tm,
635
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-tt-tm, var(--_ctm-dn-be-ts-be-tb-hr-se-tt-tm))
636
- );
637
- --_sf-hr-wd-wp: var(
638
- --_ctm-mob-dn-be-ts-be-tb-hr-se-wd-wp,
639
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-wd-wp, var(--_ctm-dn-be-ts-be-tb-hr-se-wd-wp))
640
- );
641
- --_sf-hr-wd-bk: var(
642
- --_ctm-mob-dn-be-ts-be-tb-hr-se-wd-bk,
643
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-wd-bk, var(--_ctm-dn-be-ts-be-tb-hr-se-wd-bk))
644
- );
645
- --_sf-hr-ft-se: var(
646
- --_ctm-mob-dn-be-ts-be-tb-hr-se-ft-se,
647
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-se, var(--_ctm-dn-be-ts-be-tb-hr-se-ft-se))
648
- );
649
- --_sf-hr-ft-wt: var(
650
- --_ctm-mob-dn-be-ts-be-tb-hr-se-ft-wt,
651
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-wt, var(--_ctm-dn-be-ts-be-tb-hr-se-ft-wt))
652
- );
653
- --_sf-hr-ft-se-ic: var(
654
- --_ctm-mob-dn-be-ts-be-tb-hr-se-ft-se-ic,
655
- var(
656
- --_ctm-tab-dn-be-ts-be-tb-hr-se-ft-se-ic,
657
- var(--_ctm-dn-be-ts-be-tb-hr-se-ft-se-ic)
658
- )
659
- );
660
- --_sf-hr-tt-an: var(
661
- --_ctm-mob-dn-be-ts-be-tb-hr-se-tt-an,
662
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-tt-an, var(--_ctm-dn-be-ts-be-tb-hr-se-tt-an))
663
- );
664
- --_sf-hr-lr-sg: var(
665
- --_ctm-mob-dn-be-ts-be-tb-hr-se-lr-sg,
666
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-lr-sg, var(--_ctm-dn-be-ts-be-tb-hr-se-lr-sg))
667
- );
668
- --_sf-hr-le-ht: var(
669
- --_ctm-mob-dn-be-ts-be-tb-hr-se-le-ht,
670
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-le-ht, var(--_ctm-dn-be-ts-be-tb-hr-se-le-ht))
671
- );
672
-
673
- --_sf-hr-in-se: var(
674
- --_ctm-mob-dn-be-ts-be-tb-hr-se-in-se,
675
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-se, var(--_ctm-dn-be-ts-be-tb-hr-se-in-se))
676
- );
677
- --_sf-hr-in-se: var(
678
- --_ctm-mob-dn-be-ts-be-tb-hr-se-in-se,
679
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-se, var(--_ctm-dn-be-ts-be-tb-hr-se-in-se))
680
- );
681
- --_sf-hr-in-c1: var(
682
- --_ctm-mob-dn-be-ts-be-tb-hr-se-in-c1,
683
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-c1, var(--_ctm-dn-be-ts-be-tb-hr-se-in-c1))
684
- );
685
- --_sf-hr-ue: var(
686
- --_ctm-mob-dn-be-ts-be-tb-hr-se-ue,
687
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ue, var(--_ctm-dn-be-ts-be-tb-hr-se-ue))
688
- );
537
+ --_sf-hr-cr: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-cr,
538
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-cr, var(--_ctm-dn-be-ts-be-tb-hr-se-cr)));
539
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-ft-fy,
540
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-fy, var(--_ctm-dn-be-ts-be-tb-hr-se-ft-fy)));
541
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-tt-tm,
542
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-tt-tm, var(--_ctm-dn-be-ts-be-tb-hr-se-tt-tm)));
543
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-wd-wp,
544
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-wd-wp, var(--_ctm-dn-be-ts-be-tb-hr-se-wd-wp)));
545
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-wd-bk,
546
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-wd-bk, var(--_ctm-dn-be-ts-be-tb-hr-se-wd-bk)));
547
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-ft-se,
548
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-se, var(--_ctm-dn-be-ts-be-tb-hr-se-ft-se)));
549
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-ft-wt,
550
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-wt, var(--_ctm-dn-be-ts-be-tb-hr-se-ft-wt)));
551
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-ft-se-ic,
552
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ft-se-ic,
553
+ var(--_ctm-dn-be-ts-be-tb-hr-se-ft-se-ic)));
554
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-tt-an,
555
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-tt-an, var(--_ctm-dn-be-ts-be-tb-hr-se-tt-an)));
556
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-lr-sg,
557
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-lr-sg, var(--_ctm-dn-be-ts-be-tb-hr-se-lr-sg)));
558
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-le-ht,
559
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-le-ht, var(--_ctm-dn-be-ts-be-tb-hr-se-le-ht)));
560
+
561
+ --_sf-hr-in-se: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-in-se,
562
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-se, var(--_ctm-dn-be-ts-be-tb-hr-se-in-se)));
563
+ --_sf-hr-in-se: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-in-se,
564
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-se, var(--_ctm-dn-be-ts-be-tb-hr-se-in-se)));
565
+ --_sf-hr-in-c1: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-in-c1,
566
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-in-c1, var(--_ctm-dn-be-ts-be-tb-hr-se-in-c1)));
567
+ --_sf-hr-ue: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-ue,
568
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-ue, var(--_ctm-dn-be-ts-be-tb-hr-se-ue)));
689
569
 
690
570
  // for pading and width
691
- --_sf-hr-pg: var(
692
- --_ctm-mob-dn-be-ts-be-tb-hr-se-pg,
693
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-pg, var(--_ctm-dn-be-ts-be-tb-hr-se-pg))
694
- );
695
- --_sf-hr-wh: var(
696
- --_ctm-mob-dn-be-ts-be-tb-hr-se-wh,
697
- var(--_ctm-tab-dn-be-ts-be-tb-hr-se-wh, var(--_ctm-dn-be-ts-be-tb-hr-se-wh))
698
- );
571
+ --_sf-hr-pg: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-pg,
572
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-pg, var(--_ctm-dn-be-ts-be-tb-hr-se-pg)));
573
+ --_sf-hr-wh: var(--_ctm-mob-dn-be-ts-be-tb-hr-se-wh,
574
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-se-wh, var(--_ctm-dn-be-ts-be-tb-hr-se-wh)));
699
575
 
700
576
  &[data-hover-show-shadow="false"] {
701
577
  --_hover-show-shadow: none;
702
578
  }
579
+
703
580
  &[data-hover-show-icon="false"] {
704
581
  --_hover-show-icon: none;
705
582
  }
706
583
  }
707
584
 
708
- background-color: var(
709
- --_sf-hr-bd-cr,
710
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-bd-cr)
711
- );
585
+ background-color: var(--_sf-hr-bd-cr,
586
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-bd-cr));
712
587
 
713
588
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-pg));
714
589
  display: flex;
@@ -716,36 +591,23 @@ $resizeActive: '[data-cms-element-resizer="true"]';
716
591
  align-items: center;
717
592
 
718
593
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-at));
719
- gap: var(
720
- --_sf-hr-in-ad-tt-sg,
721
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-in-ad-tt-sg)
722
- );
594
+ gap: var(--_sf-hr-in-ad-tt-sg,
595
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-in-ad-tt-sg));
723
596
 
724
- border-radius: var(
725
- --_sf-hr-br-rs,
726
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-rs)
727
- );
597
+ border-radius: var(--_sf-hr-br-rs,
598
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-rs));
728
599
 
729
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-ae))
730
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-br))
731
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-sd))
732
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-cr));
600
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-cr));
733
601
 
734
602
  &[data-show-border="true"] {
735
- border-color: var(
736
- --_sf-hr-br-cr,
737
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-cr)
738
- );
739
-
740
- border-style: var(
741
- --_sf-hr-br-se,
742
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-se)
743
- );
744
-
745
- border-width: var(
746
- --_sf-hr-br-wh,
747
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-wh)
748
- );
603
+ border-color: var(--_sf-hr-br-cr,
604
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-cr));
605
+
606
+ border-style: var(--_sf-hr-br-se,
607
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-se));
608
+
609
+ border-width: var(--_sf-hr-br-wh,
610
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-wh));
749
611
  }
750
612
 
751
613
  // text styles
@@ -753,12 +615,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
753
615
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-cr));
754
616
 
755
617
  font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-fy));
756
- text-transform: var(
757
- --_sf-hr-tt-tm,
758
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-tm)
759
- );
618
+ text-transform: var(--_sf-hr-tt-tm, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-tm));
760
619
  word-wrap: var(--_sf-hr-wd-wp, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-wd-wp));
761
620
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-wd-bk));
621
+
762
622
  &.flex__overflow {
763
623
  white-space: normal;
764
624
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -768,17 +628,13 @@ $resizeActive: '[data-cms-element-resizer="true"]';
768
628
 
769
629
  font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-wt));
770
630
 
771
- font-style: var(
772
- --_sf-hr-ft-se-ic,
773
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-se-ic)
774
- );
631
+ font-style: var(--_sf-hr-ft-se-ic,
632
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-se-ic));
775
633
 
776
634
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-an));
777
635
 
778
- letter-spacing: var(
779
- --_sf-hr-lr-sg,
780
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-lr-sg)
781
- );
636
+ letter-spacing: var(--_sf-hr-lr-sg,
637
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-lr-sg));
782
638
 
783
639
  line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-le-ht));
784
640
 
@@ -790,144 +646,83 @@ $resizeActive: '[data-cms-element-resizer="true"]';
790
646
  }
791
647
 
792
648
  &[data-is-selected="true"] {
793
- --_sf-sd-bd-cr: var(
794
- --_ctm-mob-dn-me-sd-se-bd-cr,
795
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-bd-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-bd-cr))
796
- );
797
- --_sf-sd-br-cr: var(
798
- --_ctm-mob-dn-be-ts-be-tb-sd-se-br-cr,
799
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-br-cr))
800
- );
801
- --_sf-sd-br-se: var(
802
- --_ctm-mob-dn-be-ts-be-tb-sd-se-br-se,
803
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-se, var(--_ctm-dn-be-ts-be-tb-sd-se-br-se))
804
- );
805
- --_sf-sd-br-wh: var(
806
- --_ctm-mob-dn-be-ts-be-tb-sd-se-br-wh,
807
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-wh, var(--_ctm-dn-be-ts-be-tb-sd-se-br-wh))
808
- );
809
- --_sf-sd-br-rs: var(
810
- --_ctm-mob-dn-be-ts-be-tb-sd-se-br-rs,
811
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-rs, var(--_ctm-dn-be-ts-be-tb-sd-se-br-rs))
812
- );
813
- --_sf-sd-at: var(
814
- --_ctm-mob-dn-be-ts-be-tb-sd-se-at,
815
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-at, var(--_ctm-dn-be-ts-be-tb-sd-se-at))
816
- );
817
- --_sf-sd-in-ad-tt-sg: var(
818
- --_ctm-mob-dn-be-ts-be-tb-sd-se-in-ad-tt-sg,
819
- var(
820
- --_ctm-tab-dn-be-ts-be-tb-sd-se-in-ad-tt-sg,
821
- var(--_ctm-dn-be-ts-be-tb-sd-se-in-ad-tt-sg)
822
- )
823
- );
649
+ --_sf-sd-bd-cr: var(--_ctm-mob-dn-me-sd-se-bd-cr,
650
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-bd-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-bd-cr)));
651
+ --_sf-sd-br-cr: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-br-cr,
652
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-br-cr)));
653
+ --_sf-sd-br-se: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-br-se,
654
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-se, var(--_ctm-dn-be-ts-be-tb-sd-se-br-se)));
655
+ --_sf-sd-br-wh: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-br-wh,
656
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-wh, var(--_ctm-dn-be-ts-be-tb-sd-se-br-wh)));
657
+ --_sf-sd-br-rs: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-br-rs,
658
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-br-rs, var(--_ctm-dn-be-ts-be-tb-sd-se-br-rs)));
659
+ --_sf-sd-at: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-at,
660
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-at, var(--_ctm-dn-be-ts-be-tb-sd-se-at)));
661
+ --_sf-sd-in-ad-tt-sg: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-in-ad-tt-sg,
662
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-ad-tt-sg,
663
+ var(--_ctm-dn-be-ts-be-tb-sd-se-in-ad-tt-sg)));
824
664
 
825
665
  // for shadow
826
- --_sf-sd-sw-ae: var(
827
- --_ctm-mob-dn-be-ts-be-tb-sd-se-sw-ae,
828
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-ae, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-ae))
829
- );
830
- --_sf-sd-sw-br: var(
831
- --_ctm-mob-dn-be-ts-be-tb-sd-se-sw-br,
832
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-br, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-br))
833
- );
834
- --_sf-sd-sw-hr: var(
835
- --_ctm-mob-dn-be-ts-be-tb-sd-se-sw-hr,
836
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-hr, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-hr))
837
- );
838
- --_sf-sd-sw-cr: var(
839
- --_ctm-mob-dn-be-ts-be-tb-sd-se-sw-cr,
840
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-cr))
841
- );
666
+ --_sf-sd-sw-ae: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-sw-ae,
667
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-ae, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-ae)));
668
+ --_sf-sd-sw-br: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-sw-br,
669
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-br, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-br)));
670
+ --_sf-sd-sw-hr: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-sw-hr,
671
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-hr, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-hr)));
672
+ --_sf-sd-sw-cr: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-sw-cr,
673
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-sw-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-sw-cr)));
842
674
 
843
675
  // for font
844
676
 
845
- --_sf-sd-cr: var(
846
- --_ctm-mob-dn-be-ts-be-tb-sd-se-cr,
847
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-cr))
848
- );
849
- --_sf-sd-ft-fy: var(
850
- --_ctm-mob-dn-be-ts-be-tb-sd-se-ft-fy,
851
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-fy, var(--_ctm-dn-be-ts-be-tb-sd-se-ft-fy))
852
- );
853
- --_sf-sd-tt-tm: var(
854
- --_ctm-mob-dn-be-ts-be-tb-sd-se-tt-tm,
855
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-tt-tm, var(--_ctm-dn-be-ts-be-tb-sd-se-tt-tm))
856
- );
857
- --_sf-sd-wd-wp: var(
858
- --_ctm-mob-dn-be-ts-be-tb-sd-se-wd-wp,
859
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-wd-wp, var(--_ctm-dn-be-ts-be-tb-sd-se-wd-wp))
860
- );
861
- --_sf-sd-wd-bk: var(
862
- --_ctm-mob-dn-be-ts-be-tb-sd-se-wd-bk,
863
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-wd-bk, var(--_ctm-dn-be-ts-be-tb-sd-se-wd-bk))
864
- );
865
- --_sf-sd-ft-se: var(
866
- --_ctm-mob-dn-be-ts-be-tb-sd-se-ft-se,
867
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-se, var(--_ctm-dn-be-ts-be-tb-sd-se-ft-se))
868
- );
869
- --_sf-sd-ft-wt: var(
870
- --_ctm-mob-dn-be-ts-be-tb-sd-se-ft-wt,
871
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-wt, var(--_ctm-dn-be-ts-be-tb-sd-se-ft-wt))
872
- );
873
- --_sf-sd-ft-se-ic: var(
874
- --_ctm-mob-dn-be-ts-be-tb-sd-se-ft-se-ic,
875
- var(
876
- --_ctm-tab-dn-be-ts-be-tb-sd-se-ft-se-ic,
877
- var(--_ctm-dn-be-ts-be-tb-sd-se-ft-se-ic)
878
- )
879
- );
880
- --_sf-sd-tt-an: var(
881
- --_ctm-mob-dn-be-ts-be-tb-sd-se-tt-an,
882
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-tt-an, var(--_ctm-dn-be-ts-be-tb-sd-se-tt-an))
883
- );
884
- --_sf-sd-lr-sg: var(
885
- --_ctm-mob-dn-be-ts-be-tb-sd-se-lr-sg,
886
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-lr-sg, var(--_ctm-dn-be-ts-be-tb-sd-se-lr-sg))
887
- );
888
- --_sf-sd-le-ht: var(
889
- --_ctm-mob-dn-be-ts-be-tb-sd-se-le-ht,
890
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-le-ht, var(--_ctm-dn-be-ts-be-tb-sd-se-le-ht))
891
- );
892
-
893
- --_sf-sd-in-se: var(
894
- --_ctm-mob-dn-be-ts-be-tb-sd-se-in-se,
895
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-se, var(--_ctm-dn-be-ts-be-tb-sd-se-in-se))
896
- );
897
- --_sf-sd-in-se: var(
898
- --_ctm-mob-dn-be-ts-be-tb-sd-se-in-se,
899
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-se, var(--_ctm-dn-be-ts-be-tb-sd-se-in-se))
900
- );
901
- --_sf-sd-in-c1: var(
902
- --_ctm-mob-dn-be-ts-be-tb-sd-se-in-c1,
903
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-c1, var(--_ctm-dn-be-ts-be-tb-sd-se-in-c1))
904
- );
905
- --_sf-sd-ue: var(
906
- --_ctm-mob-dn-be-ts-be-tb-hr-ue,
907
- var(--_ctm-tab-dn-be-ts-be-tb-hr-ue, var(--_ctm-dn-be-ts-be-tb-hr-ue))
908
- );
677
+ --_sf-sd-cr: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-cr,
678
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-cr, var(--_ctm-dn-be-ts-be-tb-sd-se-cr)));
679
+ --_sf-sd-ft-fy: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-ft-fy,
680
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-fy, var(--_ctm-dn-be-ts-be-tb-sd-se-ft-fy)));
681
+ --_sf-sd-tt-tm: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-tt-tm,
682
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-tt-tm, var(--_ctm-dn-be-ts-be-tb-sd-se-tt-tm)));
683
+ --_sf-sd-wd-wp: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-wd-wp,
684
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-wd-wp, var(--_ctm-dn-be-ts-be-tb-sd-se-wd-wp)));
685
+ --_sf-sd-wd-bk: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-wd-bk,
686
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-wd-bk, var(--_ctm-dn-be-ts-be-tb-sd-se-wd-bk)));
687
+ --_sf-sd-ft-se: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-ft-se,
688
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-se, var(--_ctm-dn-be-ts-be-tb-sd-se-ft-se)));
689
+ --_sf-sd-ft-wt: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-ft-wt,
690
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-wt, var(--_ctm-dn-be-ts-be-tb-sd-se-ft-wt)));
691
+ --_sf-sd-ft-se-ic: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-ft-se-ic,
692
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-ft-se-ic,
693
+ var(--_ctm-dn-be-ts-be-tb-sd-se-ft-se-ic)));
694
+ --_sf-sd-tt-an: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-tt-an,
695
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-tt-an, var(--_ctm-dn-be-ts-be-tb-sd-se-tt-an)));
696
+ --_sf-sd-lr-sg: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-lr-sg,
697
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-lr-sg, var(--_ctm-dn-be-ts-be-tb-sd-se-lr-sg)));
698
+ --_sf-sd-le-ht: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-le-ht,
699
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-le-ht, var(--_ctm-dn-be-ts-be-tb-sd-se-le-ht)));
700
+
701
+ --_sf-sd-in-se: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-in-se,
702
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-se, var(--_ctm-dn-be-ts-be-tb-sd-se-in-se)));
703
+ --_sf-sd-in-se: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-in-se,
704
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-se, var(--_ctm-dn-be-ts-be-tb-sd-se-in-se)));
705
+ --_sf-sd-in-c1: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-in-c1,
706
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-in-c1, var(--_ctm-dn-be-ts-be-tb-sd-se-in-c1)));
707
+ --_sf-sd-ue: var(--_ctm-mob-dn-be-ts-be-tb-hr-ue,
708
+ var(--_ctm-tab-dn-be-ts-be-tb-hr-ue, var(--_ctm-dn-be-ts-be-tb-hr-ue)));
909
709
 
910
710
  // for pading and width
911
- --_sf-sd-pg: var(
912
- --_ctm-mob-dn-be-ts-be-tb-sd-se-pg,
913
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-pg, var(--_ctm-dn-be-ts-be-tb-sd-se-pg))
914
- );
915
- --_sf-sd-wh: var(
916
- --_ctm-mob-dn-be-ts-be-tb-sd-se-wh,
917
- var(--_ctm-tab-dn-be-ts-be-tb-sd-se-wh, var(--_ctm-dn-be-ts-be-tb-sd-se-wh))
918
- );
711
+ --_sf-sd-pg: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-pg,
712
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-pg, var(--_ctm-dn-be-ts-be-tb-sd-se-pg)));
713
+ --_sf-sd-wh: var(--_ctm-mob-dn-be-ts-be-tb-sd-se-wh,
714
+ var(--_ctm-tab-dn-be-ts-be-tb-sd-se-wh, var(--_ctm-dn-be-ts-be-tb-sd-se-wh)));
919
715
 
920
716
  &[data-hover-show-shadow="false"] {
921
717
  --_hover-show-shadow: none;
922
718
  }
719
+
923
720
  &[data-hover-show-icon="false"] {
924
721
  --_hover-show-icon: none;
925
722
  }
926
723
 
927
- background-color: var(
928
- --_sf-sd-bd-cr,
929
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-bd-cr)
930
- );
724
+ background-color: var(--_sf-sd-bd-cr,
725
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-bd-cr));
931
726
 
932
727
  padding: var(--_sf-sd-pg, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-pg));
933
728
  display: flex;
@@ -935,55 +730,38 @@ $resizeActive: '[data-cms-element-resizer="true"]';
935
730
  align-items: center;
936
731
 
937
732
  justify-content: var(--_sf-sd-at, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-at));
938
- gap: var(
939
- --_sf-sd-in-ad-tt-sg,
940
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-in-ad-tt-sg)
941
- );
733
+ gap: var(--_sf-sd-in-ad-tt-sg,
734
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-in-ad-tt-sg));
942
735
 
943
- border-radius: var(
944
- --_sf-sd-br-rs,
945
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-rs)
946
- );
736
+ border-radius: var(--_sf-sd-br-rs,
737
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-rs));
947
738
 
948
- box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-ae))
949
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-br))
950
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-sd))
951
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-cr));
739
+ box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-sw-cr));
952
740
 
953
741
  &[data-show-border="true"] {
954
- border-color: var(
955
- --_sf-sd-br-cr,
956
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-cr)
957
- );
958
-
959
- border-style: var(
960
- --_sf-sd-br-se,
961
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-se)
962
- );
963
-
964
- border-width: var(
965
- --_sf-sd-br-wh,
966
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-wh)
967
- );
742
+ border-color: var(--_sf-sd-br-cr,
743
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-cr));
744
+
745
+ border-style: var(--_sf-sd-br-se,
746
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-se));
747
+
748
+ border-width: var(--_sf-sd-br-wh,
749
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-br-wh));
968
750
  }
969
751
 
970
752
  // text styles
971
753
 
972
754
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-cr));
973
755
 
974
- font-family: var(
975
- --_sf-sd-ft-fy,
976
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-fy)
977
- );
978
- text-transform: var(
979
- --_sf-sd-tt-tm,
980
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-tm)
981
- );
982
- word-wrap: var(--_sf-sd-wd-wp, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-wd-wp));
983
- word-break: var(
984
- --_sf-sd-wd-bk,
985
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-wd-bk)
986
- );
756
+ font-family: var(--_sf-sd-ft-fy,
757
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-fy));
758
+ text-transform: var(--_sf-sd-tt-tm,
759
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-tm));
760
+ word-wrap: var(--_sf-sd-wd-wp,
761
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-wd-wp));
762
+ word-break: var(--_sf-sd-wd-bk,
763
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-wd-bk));
764
+
987
765
  &.flex__overflow {
988
766
  white-space: normal;
989
767
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -991,30 +769,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
991
769
 
992
770
  font-size: var(--_sf-sd-ft-se, prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-se));
993
771
 
994
- font-weight: var(
995
- --_sf-sd-ft-wt,
996
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-wt)
997
- );
772
+ font-weight: var(--_sf-sd-ft-wt,
773
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-wt));
998
774
 
999
- font-style: var(
1000
- --_sf-sd-ft-se-ic,
1001
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-se-ic)
1002
- );
775
+ font-style: var(--_sf-sd-ft-se-ic,
776
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-ft-se-ic));
1003
777
 
1004
- text-align: var(
1005
- --_sf-sd-tt-an,
1006
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-an)
1007
- );
778
+ text-align: var(--_sf-sd-tt-an,
779
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-tt-an));
1008
780
 
1009
- letter-spacing: var(
1010
- --_sf-sd-lr-sg,
1011
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-lr-sg)
1012
- );
781
+ letter-spacing: var(--_sf-sd-lr-sg,
782
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-lr-sg));
1013
783
 
1014
- line-height: var(
1015
- --_sf-sd-le-ht,
1016
- prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-le-ht)
1017
- );
784
+ line-height: var(--_sf-sd-le-ht,
785
+ prepareMediaVariable(--_ctm-dn-be-ts-be-tb-dt-se-le-ht));
1018
786
 
1019
787
  text-decoration: var(--_sf-sd-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
1020
788
 
@@ -1024,12 +792,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1024
792
  }
1025
793
  }
1026
794
  }
795
+
1027
796
  .embla {
1028
797
  height: auto;
798
+
1029
799
  .embla__viewport {
1030
800
  .embla__container {
1031
801
  display: flex;
1032
802
  gap: prepareMediaVariable(--_ctm-dn-be-ts-wt-se-im-gp);
803
+
1033
804
  .embla__slide {
1034
805
  width: unset;
1035
806
  }
@@ -1037,216 +808,137 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1037
808
  }
1038
809
  }
1039
810
  }
811
+
1040
812
  .category__tabs {
1041
813
  width: 100%;
1042
- background-color: var(
1043
- --_ctm-mob-dn-cy-ts-wt-se-bd-cr,
1044
- var(--_ctm-tab-dn-cy-ts-wt-se-bd-cr, var(--_ctm-dn-cy-ts-wt-se-bd-cr))
1045
- );
814
+ background-color: var(--_ctm-mob-dn-cy-ts-wt-se-bd-cr,
815
+ var(--_ctm-tab-dn-cy-ts-wt-se-bd-cr, var(--_ctm-dn-cy-ts-wt-se-bd-cr)));
1046
816
  // padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
1047
817
  display: flex;
1048
818
  flex-direction: column;
1049
- --_sf-gp: var(
1050
- --_ctm-mob-lt-im-sg,
1051
- var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
1052
- );
819
+ --_sf-gp: var(--_ctm-mob-lt-im-sg,
820
+ var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px)));
1053
821
  --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
1054
822
  row-gap: var(--_sf-gp);
1055
823
  width: 100%;
824
+
1056
825
  // height: 100%;
1057
826
  // Border only drawn when the widget's "Show Border" toggle is on. The
1058
827
  // renderer emits data-show-border="true"/"" on the .category__tabs container.
1059
828
  &[data-show-border="true"] {
1060
- border-color: var(
1061
- --_ctm-mob-dn-cy-ts-wt-se-br-cr,
1062
- var(--_ctm-tab-dn-cy-ts-wt-se-br-cr, var(--_ctm-dn-cy-ts-wt-se-br-cr))
1063
- );
1064
- border-style: var(
1065
- --_ctm-mob-dn-cy-ts-wt-se-br-se,
1066
- var(--_ctm-tab-dn-cy-ts-wt-se-br-se, var(--_ctm-dn-cy-ts-wt-se-br-se))
1067
- );
1068
- border-width: var(
1069
- --_ctm-mob-dn-cy-ts-wt-se-br-wh,
1070
- var(--_ctm-tab-dn-cy-ts-wt-se-br-wh, var(--_ctm-dn-cy-ts-wt-se-br-wh))
1071
- );
829
+ border-color: var(--_ctm-mob-dn-cy-ts-wt-se-br-cr,
830
+ var(--_ctm-tab-dn-cy-ts-wt-se-br-cr, var(--_ctm-dn-cy-ts-wt-se-br-cr)));
831
+ border-style: var(--_ctm-mob-dn-cy-ts-wt-se-br-se,
832
+ var(--_ctm-tab-dn-cy-ts-wt-se-br-se, var(--_ctm-dn-cy-ts-wt-se-br-se)));
833
+ border-width: var(--_ctm-mob-dn-cy-ts-wt-se-br-wh,
834
+ var(--_ctm-tab-dn-cy-ts-wt-se-br-wh, var(--_ctm-dn-cy-ts-wt-se-br-wh)));
1072
835
  }
1073
- border-radius: var(
1074
- --_ctm-mob-dn-cy-ts-wt-se-br-rs,
1075
- var(--_ctm-tab-dn-cy-ts-wt-se-br-rs, var(--_ctm-dn-cy-ts-wt-se-br-rs))
1076
- );
1077
- box-shadow: var(
1078
- --_show-shadow,
1079
- var(
1080
- --_ctm-mob-dn-cy-ts-wt-se-sw-ae,
1081
- var(--_ctm-tab-dn-cy-ts-wt-se-sw-ae, var(--_ctm-dn-cy-ts-wt-se-sw-ae))
1082
- )
1083
- var(
1084
- --_ctm-mob-dn-cy-ts-wt-se-sw-br,
1085
- var(--_ctm-tab-dn-cy-ts-wt-se-sw-br, var(--_ctm-dn-cy-ts-wt-se-sw-br))
1086
- )
1087
- var(
1088
- --_ctm-mob-dn-cy-ts-wt-se-sw-sd,
1089
- var(--_ctm-tab-dn-cy-ts-wt-se-sw-sd, var(--_ctm-dn-cy-ts-wt-se-sw-sd))
1090
- )
1091
- var(
1092
- --_ctm-mob-dn-cy-ts-wt-se-sw-cr,
1093
- var(--_ctm-tab-dn-cy-ts-wt-se-sw-cr, var(--_ctm-dn-cy-ts-wt-se-sw-cr))
1094
- )
1095
- );
836
+
837
+ border-radius: var(--_ctm-mob-dn-cy-ts-wt-se-br-rs,
838
+ var(--_ctm-tab-dn-cy-ts-wt-se-br-rs, var(--_ctm-dn-cy-ts-wt-se-br-rs)));
839
+ box-shadow: var(--_show-shadow,
840
+ var(--_ctm-mob-dn-cy-ts-wt-se-sw-ae,
841
+ var(--_ctm-tab-dn-cy-ts-wt-se-sw-ae, var(--_ctm-dn-cy-ts-wt-se-sw-ae))) var(--_ctm-mob-dn-cy-ts-wt-se-sw-br,
842
+ var(--_ctm-tab-dn-cy-ts-wt-se-sw-br, var(--_ctm-dn-cy-ts-wt-se-sw-br))) var(--_ctm-mob-dn-cy-ts-wt-se-sw-sd,
843
+ var(--_ctm-tab-dn-cy-ts-wt-se-sw-sd, var(--_ctm-dn-cy-ts-wt-se-sw-sd))) var(--_ctm-mob-dn-cy-ts-wt-se-sw-cr,
844
+ var(--_ctm-tab-dn-cy-ts-wt-se-sw-cr, var(--_ctm-dn-cy-ts-wt-se-sw-cr))));
845
+
1096
846
  .profile__button {
1097
847
  &[data-show-shadow="false"] {
1098
848
  --_show-shadow: none;
1099
849
  }
850
+
1100
851
  &[data-icon-position="left"] {
1101
852
  --_sf-fd-bn: row;
1102
853
  }
854
+
1103
855
  &[data-icon-position="right"] {
1104
856
  --_sf-fd-bn: row-reverse;
1105
857
  }
858
+
1106
859
  &[data-icon-position="center"] {
1107
860
  --_sf-fd-bn: row;
1108
861
  }
1109
862
 
1110
863
  &:hover {
1111
- --_sf-hr-bd-cr: var(
1112
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-bd-cr,
1113
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-bd-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-bd-cr))
1114
- );
1115
- --_sf-hr-br-cr: var(
1116
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-cr,
1117
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-cr))
1118
- );
1119
- --_sf-hr-br-se: var(
1120
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-se,
1121
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-se))
1122
- );
1123
- --_sf-hr-br-wh: var(
1124
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-wh,
1125
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-wh, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-wh))
1126
- );
1127
- --_sf-hr-br-rs: var(
1128
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-rs,
1129
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-rs, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-rs))
1130
- );
1131
- --_sf-hr-at: var(
1132
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-at,
1133
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-at, var(--_ctm-dn-cy-ts-cy-tb-hr-se-at))
1134
- );
1135
- --_sf-hr-in-ad-tt-sg: var(
1136
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-ad-tt-sg,
1137
- var(
1138
- --_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-ad-tt-sg,
1139
- var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-ad-tt-sg)
1140
- )
1141
- );
864
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-bd-cr,
865
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-bd-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-bd-cr)));
866
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-cr,
867
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-cr)));
868
+ --_sf-hr-br-se: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-se,
869
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-se)));
870
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-wh,
871
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-wh, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-wh)));
872
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-br-rs,
873
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-br-rs, var(--_ctm-dn-cy-ts-cy-tb-hr-se-br-rs)));
874
+ --_sf-hr-at: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-at,
875
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-at, var(--_ctm-dn-cy-ts-cy-tb-hr-se-at)));
876
+ --_sf-hr-in-ad-tt-sg: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-ad-tt-sg,
877
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-ad-tt-sg,
878
+ var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-ad-tt-sg)));
1142
879
 
1143
880
  // for shadow
1144
- --_sf-hr-sw-ae: var(
1145
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-ae,
1146
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-ae, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-ae))
1147
- );
1148
- --_sf-hr-sw-br: var(
1149
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-br,
1150
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-br, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-br))
1151
- );
1152
- --_sf-hr-sw-hr: var(
1153
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-hr,
1154
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-hr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-hr))
1155
- );
1156
- --_sf-hr-sw-cr: var(
1157
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-cr,
1158
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-cr))
1159
- );
881
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-ae,
882
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-ae, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-ae)));
883
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-br,
884
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-br, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-br)));
885
+ --_sf-hr-sw-hr: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-hr,
886
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-hr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-hr)));
887
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-sw-cr,
888
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-sw-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-sw-cr)));
1160
889
 
1161
890
  // for font
1162
891
 
1163
- --_sf-hr-cr: var(
1164
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-cr,
1165
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-cr))
1166
- );
1167
- --_sf-hr-ft-fy: var(
1168
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-fy,
1169
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-fy, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-fy))
1170
- );
1171
- --_sf-hr-tt-tm: var(
1172
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-tt-tm,
1173
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-tt-tm, var(--_ctm-dn-cy-ts-cy-tb-hr-se-tt-tm))
1174
- );
1175
- --_sf-hr-wd-wp: var(
1176
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-wd-wp,
1177
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-wd-wp, var(--_ctm-dn-cy-ts-cy-tb-hr-se-wd-wp))
1178
- );
1179
- --_sf-hr-wd-bk: var(
1180
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-wd-bk,
1181
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-wd-bk, var(--_ctm-dn-cy-ts-cy-tb-hr-se-wd-bk))
1182
- );
1183
- --_sf-hr-ft-se: var(
1184
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-se,
1185
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-se))
1186
- );
1187
- --_sf-hr-ft-wt: var(
1188
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-wt,
1189
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-wt, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-wt))
1190
- );
1191
- --_sf-hr-ft-se-ic: var(
1192
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-se-ic,
1193
- var(
1194
- --_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-se-ic,
1195
- var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-se-ic)
1196
- )
1197
- );
1198
- --_sf-hr-tt-an: var(
1199
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-tt-an,
1200
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-tt-an, var(--_ctm-dn-cy-ts-cy-tb-hr-se-tt-an))
1201
- );
1202
- --_sf-hr-lr-sg: var(
1203
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-lr-sg,
1204
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-lr-sg, var(--_ctm-dn-cy-ts-cy-tb-hr-se-lr-sg))
1205
- );
1206
- --_sf-hr-le-ht: var(
1207
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-le-ht,
1208
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-le-ht, var(--_ctm-dn-cy-ts-cy-tb-hr-se-le-ht))
1209
- );
1210
-
1211
- --_sf-hr-in-se: var(
1212
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-se,
1213
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-se))
1214
- );
1215
- --_sf-hr-in-se: var(
1216
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-se,
1217
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-se))
1218
- );
1219
- --_sf-hr-in-c1: var(
1220
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-c1,
1221
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-c1, var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-c1))
1222
- );
1223
- --_sf-hr-ue: var(
1224
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-ue,
1225
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ue, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ue))
1226
- );
892
+ --_sf-hr-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-cr,
893
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-cr, var(--_ctm-dn-cy-ts-cy-tb-hr-se-cr)));
894
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-fy,
895
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-fy, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-fy)));
896
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-tt-tm,
897
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-tt-tm, var(--_ctm-dn-cy-ts-cy-tb-hr-se-tt-tm)));
898
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-wd-wp,
899
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-wd-wp, var(--_ctm-dn-cy-ts-cy-tb-hr-se-wd-wp)));
900
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-wd-bk,
901
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-wd-bk, var(--_ctm-dn-cy-ts-cy-tb-hr-se-wd-bk)));
902
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-se,
903
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-se)));
904
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-wt,
905
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-wt, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-wt)));
906
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-ft-se-ic,
907
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ft-se-ic,
908
+ var(--_ctm-dn-cy-ts-cy-tb-hr-se-ft-se-ic)));
909
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-tt-an,
910
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-tt-an, var(--_ctm-dn-cy-ts-cy-tb-hr-se-tt-an)));
911
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-lr-sg,
912
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-lr-sg, var(--_ctm-dn-cy-ts-cy-tb-hr-se-lr-sg)));
913
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-le-ht,
914
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-le-ht, var(--_ctm-dn-cy-ts-cy-tb-hr-se-le-ht)));
915
+
916
+ --_sf-hr-in-se: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-se,
917
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-se)));
918
+ --_sf-hr-in-se: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-se,
919
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-se)));
920
+ --_sf-hr-in-c1: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-in-c1,
921
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-in-c1, var(--_ctm-dn-cy-ts-cy-tb-hr-se-in-c1)));
922
+ --_sf-hr-ue: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-ue,
923
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-ue, var(--_ctm-dn-cy-ts-cy-tb-hr-se-ue)));
1227
924
 
1228
925
  // for pading and width
1229
- --_sf-hr-pg: var(
1230
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-pg,
1231
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-pg, var(--_ctm-dn-cy-ts-cy-tb-hr-se-pg))
1232
- );
1233
- --_sf-hr-wh: var(
1234
- --_ctm-mob-dn-cy-ts-cy-tb-hr-se-wh,
1235
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-wh, var(--_ctm-dn-cy-ts-cy-tb-hr-se-wh))
1236
- );
926
+ --_sf-hr-pg: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-pg,
927
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-pg, var(--_ctm-dn-cy-ts-cy-tb-hr-se-pg)));
928
+ --_sf-hr-wh: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-se-wh,
929
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-se-wh, var(--_ctm-dn-cy-ts-cy-tb-hr-se-wh)));
1237
930
 
1238
931
  &[data-hover-show-shadow="false"] {
1239
932
  --_hover-show-shadow: none;
1240
933
  }
934
+
1241
935
  &[data-hover-show-icon="false"] {
1242
936
  --_hover-show-icon: none;
1243
937
  }
1244
938
  }
1245
939
 
1246
- background-color: var(
1247
- --_sf-hr-bd-cr,
1248
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-bd-cr)
1249
- );
940
+ background-color: var(--_sf-hr-bd-cr,
941
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-bd-cr));
1250
942
 
1251
943
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-pg));
1252
944
  display: flex;
@@ -1254,36 +946,23 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1254
946
  align-items: center;
1255
947
 
1256
948
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-at));
1257
- gap: var(
1258
- --_sf-hr-in-ad-tt-sg,
1259
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-in-ad-tt-sg)
1260
- );
949
+ gap: var(--_sf-hr-in-ad-tt-sg,
950
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-in-ad-tt-sg));
1261
951
 
1262
- border-radius: var(
1263
- --_sf-hr-br-rs,
1264
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-rs)
1265
- );
952
+ border-radius: var(--_sf-hr-br-rs,
953
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-rs));
1266
954
 
1267
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-ae))
1268
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-br))
1269
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-sd))
1270
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-cr));
955
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-cr));
1271
956
 
1272
957
  &[data-show-border="true"] {
1273
- border-color: var(
1274
- --_sf-hr-br-cr,
1275
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-cr)
1276
- );
1277
-
1278
- border-style: var(
1279
- --_sf-hr-br-se,
1280
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-se)
1281
- );
1282
-
1283
- border-width: var(
1284
- --_sf-hr-br-wh,
1285
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-wh)
1286
- );
958
+ border-color: var(--_sf-hr-br-cr,
959
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-cr));
960
+
961
+ border-style: var(--_sf-hr-br-se,
962
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-se));
963
+
964
+ border-width: var(--_sf-hr-br-wh,
965
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-wh));
1287
966
  }
1288
967
 
1289
968
  // text styles
@@ -1291,12 +970,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1291
970
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-cr));
1292
971
 
1293
972
  font-family: var(--_sf-hr-ft-fy, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-fy));
1294
- text-transform: var(
1295
- --_sf-hr-tt-tm,
1296
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-tm)
1297
- );
973
+ text-transform: var(--_sf-hr-tt-tm, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-tm));
1298
974
  word-wrap: var(--_sf-hr-wd-wp, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-wd-wp));
1299
975
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-wd-bk));
976
+
1300
977
  &.flex__overflow {
1301
978
  white-space: normal;
1302
979
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -1306,17 +983,13 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1306
983
 
1307
984
  font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-wt));
1308
985
 
1309
- font-style: var(
1310
- --_sf-hr-ft-se-ic,
1311
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-se-ic)
1312
- );
986
+ font-style: var(--_sf-hr-ft-se-ic,
987
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-se-ic));
1313
988
 
1314
989
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-an));
1315
990
 
1316
- letter-spacing: var(
1317
- --_sf-hr-lr-sg,
1318
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-lr-sg)
1319
- );
991
+ letter-spacing: var(--_sf-hr-lr-sg,
992
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-lr-sg));
1320
993
 
1321
994
  line-height: var(--_sf-hr-le-ht, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-le-ht));
1322
995
 
@@ -1328,144 +1001,83 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1328
1001
  }
1329
1002
 
1330
1003
  &[data-is-selected="true"] {
1331
- --_sf-sd-bd-cr: var(
1332
- --_ctm-mob-dn-me-sd-se-bd-cr,
1333
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-bd-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-bd-cr))
1334
- );
1335
- --_sf-sd-br-cr: var(
1336
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-cr,
1337
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-cr))
1338
- );
1339
- --_sf-sd-br-se: var(
1340
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-se,
1341
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-se))
1342
- );
1343
- --_sf-sd-br-wh: var(
1344
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-wh,
1345
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-wh, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-wh))
1346
- );
1347
- --_sf-sd-br-rs: var(
1348
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-rs,
1349
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-rs, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-rs))
1350
- );
1351
- --_sf-sd-at: var(
1352
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-at,
1353
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-at, var(--_ctm-dn-cy-ts-cy-tb-sd-se-at))
1354
- );
1355
- --_sf-sd-in-ad-tt-sg: var(
1356
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-ad-tt-sg,
1357
- var(
1358
- --_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-ad-tt-sg,
1359
- var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-ad-tt-sg)
1360
- )
1361
- );
1004
+ --_sf-sd-bd-cr: var(--_ctm-mob-dn-me-sd-se-bd-cr,
1005
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-bd-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-bd-cr)));
1006
+ --_sf-sd-br-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-cr,
1007
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-cr)));
1008
+ --_sf-sd-br-se: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-se,
1009
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-se)));
1010
+ --_sf-sd-br-wh: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-wh,
1011
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-wh, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-wh)));
1012
+ --_sf-sd-br-rs: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-br-rs,
1013
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-br-rs, var(--_ctm-dn-cy-ts-cy-tb-sd-se-br-rs)));
1014
+ --_sf-sd-at: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-at,
1015
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-at, var(--_ctm-dn-cy-ts-cy-tb-sd-se-at)));
1016
+ --_sf-sd-in-ad-tt-sg: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-ad-tt-sg,
1017
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-ad-tt-sg,
1018
+ var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-ad-tt-sg)));
1362
1019
 
1363
1020
  // for shadow
1364
- --_sf-sd-sw-ae: var(
1365
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-ae,
1366
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-ae, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-ae))
1367
- );
1368
- --_sf-sd-sw-br: var(
1369
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-br,
1370
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-br, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-br))
1371
- );
1372
- --_sf-sd-sw-hr: var(
1373
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-hr,
1374
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-hr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-hr))
1375
- );
1376
- --_sf-sd-sw-cr: var(
1377
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-cr,
1378
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-cr))
1379
- );
1021
+ --_sf-sd-sw-ae: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-ae,
1022
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-ae, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-ae)));
1023
+ --_sf-sd-sw-br: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-br,
1024
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-br, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-br)));
1025
+ --_sf-sd-sw-hr: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-hr,
1026
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-hr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-hr)));
1027
+ --_sf-sd-sw-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-sw-cr,
1028
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-sw-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-sw-cr)));
1380
1029
 
1381
1030
  // for font
1382
1031
 
1383
- --_sf-sd-cr: var(
1384
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-cr,
1385
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-cr))
1386
- );
1387
- --_sf-sd-ft-fy: var(
1388
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-fy,
1389
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-fy, var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-fy))
1390
- );
1391
- --_sf-sd-tt-tm: var(
1392
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-tt-tm,
1393
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-tt-tm, var(--_ctm-dn-cy-ts-cy-tb-sd-se-tt-tm))
1394
- );
1395
- --_sf-sd-wd-wp: var(
1396
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-wd-wp,
1397
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-wd-wp, var(--_ctm-dn-cy-ts-cy-tb-sd-se-wd-wp))
1398
- );
1399
- --_sf-sd-wd-bk: var(
1400
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-wd-bk,
1401
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-wd-bk, var(--_ctm-dn-cy-ts-cy-tb-sd-se-wd-bk))
1402
- );
1403
- --_sf-sd-ft-se: var(
1404
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-se,
1405
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-se))
1406
- );
1407
- --_sf-sd-ft-wt: var(
1408
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-wt,
1409
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-wt, var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-wt))
1410
- );
1411
- --_sf-sd-ft-se-ic: var(
1412
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-se-ic,
1413
- var(
1414
- --_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-se-ic,
1415
- var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-se-ic)
1416
- )
1417
- );
1418
- --_sf-sd-tt-an: var(
1419
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-tt-an,
1420
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-tt-an, var(--_ctm-dn-cy-ts-cy-tb-sd-se-tt-an))
1421
- );
1422
- --_sf-sd-lr-sg: var(
1423
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-lr-sg,
1424
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-lr-sg, var(--_ctm-dn-cy-ts-cy-tb-sd-se-lr-sg))
1425
- );
1426
- --_sf-sd-le-ht: var(
1427
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-le-ht,
1428
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-le-ht, var(--_ctm-dn-cy-ts-cy-tb-sd-se-le-ht))
1429
- );
1430
-
1431
- --_sf-sd-in-se: var(
1432
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-se,
1433
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-se))
1434
- );
1435
- --_sf-sd-in-se: var(
1436
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-se,
1437
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-se))
1438
- );
1439
- --_sf-sd-in-c1: var(
1440
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-c1,
1441
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-c1, var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-c1))
1442
- );
1443
- --_sf-sd-ue: var(
1444
- --_ctm-mob-dn-cy-ts-cy-tb-hr-ue,
1445
- var(--_ctm-tab-dn-cy-ts-cy-tb-hr-ue, var(--_ctm-dn-cy-ts-cy-tb-hr-ue))
1446
- );
1032
+ --_sf-sd-cr: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-cr,
1033
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-cr, var(--_ctm-dn-cy-ts-cy-tb-sd-se-cr)));
1034
+ --_sf-sd-ft-fy: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-fy,
1035
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-fy, var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-fy)));
1036
+ --_sf-sd-tt-tm: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-tt-tm,
1037
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-tt-tm, var(--_ctm-dn-cy-ts-cy-tb-sd-se-tt-tm)));
1038
+ --_sf-sd-wd-wp: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-wd-wp,
1039
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-wd-wp, var(--_ctm-dn-cy-ts-cy-tb-sd-se-wd-wp)));
1040
+ --_sf-sd-wd-bk: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-wd-bk,
1041
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-wd-bk, var(--_ctm-dn-cy-ts-cy-tb-sd-se-wd-bk)));
1042
+ --_sf-sd-ft-se: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-se,
1043
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-se)));
1044
+ --_sf-sd-ft-wt: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-wt,
1045
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-wt, var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-wt)));
1046
+ --_sf-sd-ft-se-ic: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-ft-se-ic,
1047
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-ft-se-ic,
1048
+ var(--_ctm-dn-cy-ts-cy-tb-sd-se-ft-se-ic)));
1049
+ --_sf-sd-tt-an: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-tt-an,
1050
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-tt-an, var(--_ctm-dn-cy-ts-cy-tb-sd-se-tt-an)));
1051
+ --_sf-sd-lr-sg: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-lr-sg,
1052
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-lr-sg, var(--_ctm-dn-cy-ts-cy-tb-sd-se-lr-sg)));
1053
+ --_sf-sd-le-ht: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-le-ht,
1054
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-le-ht, var(--_ctm-dn-cy-ts-cy-tb-sd-se-le-ht)));
1055
+
1056
+ --_sf-sd-in-se: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-se,
1057
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-se)));
1058
+ --_sf-sd-in-se: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-se,
1059
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-se, var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-se)));
1060
+ --_sf-sd-in-c1: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-in-c1,
1061
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-in-c1, var(--_ctm-dn-cy-ts-cy-tb-sd-se-in-c1)));
1062
+ --_sf-sd-ue: var(--_ctm-mob-dn-cy-ts-cy-tb-hr-ue,
1063
+ var(--_ctm-tab-dn-cy-ts-cy-tb-hr-ue, var(--_ctm-dn-cy-ts-cy-tb-hr-ue)));
1447
1064
 
1448
1065
  // for pading and width
1449
- --_sf-sd-pg: var(
1450
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-pg,
1451
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-pg, var(--_ctm-dn-cy-ts-cy-tb-sd-se-pg))
1452
- );
1453
- --_sf-sd-wh: var(
1454
- --_ctm-mob-dn-cy-ts-cy-tb-sd-se-wh,
1455
- var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-wh, var(--_ctm-dn-cy-ts-cy-tb-sd-se-wh))
1456
- );
1066
+ --_sf-sd-pg: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-pg,
1067
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-pg, var(--_ctm-dn-cy-ts-cy-tb-sd-se-pg)));
1068
+ --_sf-sd-wh: var(--_ctm-mob-dn-cy-ts-cy-tb-sd-se-wh,
1069
+ var(--_ctm-tab-dn-cy-ts-cy-tb-sd-se-wh, var(--_ctm-dn-cy-ts-cy-tb-sd-se-wh)));
1457
1070
 
1458
1071
  &[data-hover-show-shadow="false"] {
1459
1072
  --_hover-show-shadow: none;
1460
1073
  }
1074
+
1461
1075
  &[data-hover-show-icon="false"] {
1462
1076
  --_hover-show-icon: none;
1463
1077
  }
1464
1078
 
1465
- background-color: var(
1466
- --_sf-sd-bd-cr,
1467
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-bd-cr)
1468
- );
1079
+ background-color: var(--_sf-sd-bd-cr,
1080
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-bd-cr));
1469
1081
 
1470
1082
  padding: var(--_sf-sd-pg, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-pg));
1471
1083
  display: flex;
@@ -1473,55 +1085,38 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1473
1085
  align-items: center;
1474
1086
 
1475
1087
  justify-content: var(--_sf-sd-at, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-at));
1476
- gap: var(
1477
- --_sf-sd-in-ad-tt-sg,
1478
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-in-ad-tt-sg)
1479
- );
1088
+ gap: var(--_sf-sd-in-ad-tt-sg,
1089
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-in-ad-tt-sg));
1480
1090
 
1481
- border-radius: var(
1482
- --_sf-sd-br-rs,
1483
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-rs)
1484
- );
1091
+ border-radius: var(--_sf-sd-br-rs,
1092
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-rs));
1485
1093
 
1486
- box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-ae))
1487
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-br))
1488
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-sd))
1489
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-cr));
1094
+ box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-sw-cr));
1490
1095
 
1491
1096
  &[data-show-border="true"] {
1492
- border-color: var(
1493
- --_sf-sd-br-cr,
1494
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-cr)
1495
- );
1496
-
1497
- border-style: var(
1498
- --_sf-sd-br-se,
1499
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-se)
1500
- );
1501
-
1502
- border-width: var(
1503
- --_sf-sd-br-wh,
1504
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-wh)
1505
- );
1097
+ border-color: var(--_sf-sd-br-cr,
1098
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-cr));
1099
+
1100
+ border-style: var(--_sf-sd-br-se,
1101
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-se));
1102
+
1103
+ border-width: var(--_sf-sd-br-wh,
1104
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-br-wh));
1506
1105
  }
1507
1106
 
1508
1107
  // text styles
1509
1108
 
1510
1109
  color: var(--_sf-sd-cr, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-cr));
1511
1110
 
1512
- font-family: var(
1513
- --_sf-sd-ft-fy,
1514
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-fy)
1515
- );
1516
- text-transform: var(
1517
- --_sf-sd-tt-tm,
1518
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-tm)
1519
- );
1520
- word-wrap: var(--_sf-sd-wd-wp, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-wd-wp));
1521
- word-break: var(
1522
- --_sf-sd-wd-bk,
1523
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-wd-bk)
1524
- );
1111
+ font-family: var(--_sf-sd-ft-fy,
1112
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-fy));
1113
+ text-transform: var(--_sf-sd-tt-tm,
1114
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-tm));
1115
+ word-wrap: var(--_sf-sd-wd-wp,
1116
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-wd-wp));
1117
+ word-break: var(--_sf-sd-wd-bk,
1118
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-wd-bk));
1119
+
1525
1120
  &.flex__overflow {
1526
1121
  white-space: normal;
1527
1122
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -1529,30 +1124,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1529
1124
 
1530
1125
  font-size: var(--_sf-sd-ft-se, prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-se));
1531
1126
 
1532
- font-weight: var(
1533
- --_sf-sd-ft-wt,
1534
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-wt)
1535
- );
1127
+ font-weight: var(--_sf-sd-ft-wt,
1128
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-wt));
1536
1129
 
1537
- font-style: var(
1538
- --_sf-sd-ft-se-ic,
1539
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-se-ic)
1540
- );
1130
+ font-style: var(--_sf-sd-ft-se-ic,
1131
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-ft-se-ic));
1541
1132
 
1542
- text-align: var(
1543
- --_sf-sd-tt-an,
1544
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-an)
1545
- );
1133
+ text-align: var(--_sf-sd-tt-an,
1134
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-tt-an));
1546
1135
 
1547
- letter-spacing: var(
1548
- --_sf-sd-lr-sg,
1549
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-lr-sg)
1550
- );
1136
+ letter-spacing: var(--_sf-sd-lr-sg,
1137
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-lr-sg));
1551
1138
 
1552
- line-height: var(
1553
- --_sf-sd-le-ht,
1554
- prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-le-ht)
1555
- );
1139
+ line-height: var(--_sf-sd-le-ht,
1140
+ prepareMediaVariable(--_ctm-dn-cy-ts-cy-tb-dt-se-le-ht));
1556
1141
 
1557
1142
  text-decoration: var(--_sf-sd-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
1558
1143
 
@@ -1562,12 +1147,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1562
1147
  }
1563
1148
  }
1564
1149
  }
1150
+
1565
1151
  .embla {
1566
1152
  height: auto;
1153
+
1567
1154
  .embla__viewport {
1568
1155
  .embla__container {
1569
1156
  display: flex;
1570
1157
  gap: prepareMediaVariable(--_ctm-dn-cy-ts-wt-se-im-gp);
1158
+
1571
1159
  .embla__slide {
1572
1160
  width: unset;
1573
1161
  }
@@ -1575,6 +1163,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1575
1163
  }
1576
1164
  }
1577
1165
  }
1166
+
1578
1167
  .single__bundle_container {
1579
1168
  display: flex;
1580
1169
  flex-direction: column;
@@ -1605,10 +1194,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1605
1194
  border-color: prepareMediaVariable(--_ctm-dn-hg-dn-br-cr);
1606
1195
  border-style: prepareMediaVariable(--_ctm-dn-hg-dn-br-se);
1607
1196
  border-radius: prepareMediaVariable(--_ctm-dn-hg-dn-br-rs);
1608
- box-shadow: prepareMediaVariable(--_ctm-dn-hg-dn-sw-ae)
1609
- prepareMediaVariable(--_ctm-dn-hg-dn-sw-br)
1610
- prepareMediaVariable(--_ctm-dn-hg-dn-sw-sd)
1611
- prepareMediaVariable(--_ctm-dn-hg-dn-sw-cr);
1197
+ box-shadow: prepareMediaVariable(--_ctm-dn-hg-dn-sw-ae) prepareMediaVariable(--_ctm-dn-hg-dn-sw-br) prepareMediaVariable(--_ctm-dn-hg-dn-sw-sd) prepareMediaVariable(--_ctm-dn-hg-dn-sw-cr);
1612
1198
  }
1613
1199
 
1614
1200
  .bundle__description {
@@ -1629,229 +1215,132 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1629
1215
  border-color: prepareMediaVariable(--_ctm-dn-dn-dn-br-cr);
1630
1216
  border-style: prepareMediaVariable(--_ctm-dn-dn-dn-br-se);
1631
1217
  border-radius: prepareMediaVariable(--_ctm-dn-dn-dn-br-rs);
1632
- box-shadow: prepareMediaVariable(--_ctm-dn-dn-dn-sw-ae)
1633
- prepareMediaVariable(--_ctm-dn-dn-dn-sw-br)
1634
- prepareMediaVariable(--_ctm-dn-dn-dn-sw-sd)
1635
- prepareMediaVariable(--_ctm-dn-dn-dn-sw-cr);
1218
+ box-shadow: prepareMediaVariable(--_ctm-dn-dn-dn-sw-ae) prepareMediaVariable(--_ctm-dn-dn-dn-sw-br) prepareMediaVariable(--_ctm-dn-dn-dn-sw-sd) prepareMediaVariable(--_ctm-dn-dn-dn-sw-cr);
1636
1219
  }
1220
+
1637
1221
  .button__items {
1638
1222
  display: flex;
1639
1223
  align-items: center;
1640
1224
  }
1225
+
1641
1226
  .btn__with__text[data-btn-name="bundleDetailPageButton"] {
1642
1227
  justify-content: center;
1228
+
1643
1229
  &[data-show-shadow="false"] {
1644
1230
  --_show-shadow: none;
1645
1231
  }
1232
+
1646
1233
  &[data-icon-position="left"] {
1647
1234
  --_sf-fd-bn: row;
1648
1235
  }
1236
+
1649
1237
  &[data-icon-position="right"] {
1650
1238
  --_sf-fd-bn: row-reverse;
1651
1239
  }
1240
+
1652
1241
  &[data-icon-position="center"] {
1653
1242
  --_sf-fd-bn: row;
1654
1243
  }
1655
1244
 
1656
1245
  &:hover {
1657
- --_sf-hr-bd-cr: var(
1658
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-bd-cr,
1659
- var(
1660
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-bd-cr,
1661
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-bd-cr)
1662
- )
1663
- );
1664
- --_sf-hr-br-cr: var(
1665
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-cr,
1666
- var(
1667
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-cr,
1668
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-cr)
1669
- )
1670
- );
1671
- --_sf-hr-br-se: var(
1672
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-se,
1673
- var(
1674
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-se,
1675
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-se)
1676
- )
1677
- );
1678
- --_sf-hr-br-wh: var(
1679
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-wh,
1680
- var(
1681
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-wh,
1682
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-wh)
1683
- )
1684
- );
1685
- --_sf-hr-br-rs: var(
1686
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-rs,
1687
- var(
1688
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-rs,
1689
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-rs)
1690
- )
1691
- );
1692
- --_sf-hr-at: var(
1693
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-at,
1694
- var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-at, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-at))
1695
- );
1696
- --_sf-hr-gp: var(
1697
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-gp,
1698
- var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-gp, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-gp))
1699
- );
1246
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-bd-cr,
1247
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-bd-cr,
1248
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-bd-cr)));
1249
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-cr,
1250
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-cr,
1251
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-cr)));
1252
+ --_sf-hr-br-se: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-se,
1253
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-se,
1254
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-se)));
1255
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-wh,
1256
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-wh,
1257
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-wh)));
1258
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-br-rs,
1259
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-br-rs,
1260
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-br-rs)));
1261
+ --_sf-hr-at: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-at,
1262
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-at, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-at)));
1263
+ --_sf-hr-gp: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-gp,
1264
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-gp, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-gp)));
1700
1265
 
1701
1266
  // for shadow
1702
- --_sf-hr-sw-ae: var(
1703
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-ae,
1704
- var(
1705
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-ae,
1706
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-ae)
1707
- )
1708
- );
1709
- --_sf-hr-sw-br: var(
1710
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-br,
1711
- var(
1712
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-br,
1713
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-br)
1714
- )
1715
- );
1716
- --_sf-hr-sw-hr: var(
1717
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-hr,
1718
- var(
1719
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-hr,
1720
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-hr)
1721
- )
1722
- );
1723
- --_sf-hr-sw-cr: var(
1724
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-cr,
1725
- var(
1726
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-cr,
1727
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-cr)
1728
- )
1729
- );
1267
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-ae,
1268
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-ae,
1269
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-ae)));
1270
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-br,
1271
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-br,
1272
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-br)));
1273
+ --_sf-hr-sw-hr: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-hr,
1274
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-hr,
1275
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-hr)));
1276
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-sw-cr,
1277
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-sw-cr,
1278
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-sw-cr)));
1730
1279
 
1731
1280
  // for font
1732
1281
 
1733
- --_sf-hr-cr: var(
1734
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-cr,
1735
- var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-cr, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-cr))
1736
- );
1737
- --_sf-hr-ft-fy: var(
1738
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-fy,
1739
- var(
1740
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-fy,
1741
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-fy)
1742
- )
1743
- );
1744
- --_sf-hr-tt-tm: var(
1745
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-tt-tm,
1746
- var(
1747
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-tt-tm,
1748
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-tt-tm)
1749
- )
1750
- );
1751
- --_sf-hr-wd-wp: var(
1752
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-wd-wp,
1753
- var(
1754
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-wd-wp,
1755
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-wd-wp)
1756
- )
1757
- );
1758
- --_sf-hr-wd-bk: var(
1759
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-wd-bk,
1760
- var(
1761
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-wd-bk,
1762
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-wd-bk)
1763
- )
1764
- );
1765
- --_sf-hr-ft-se: var(
1766
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-se,
1767
- var(
1768
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-se,
1769
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-se)
1770
- )
1771
- );
1772
- --_sf-hr-ft-wt: var(
1773
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-wt,
1774
- var(
1775
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-wt,
1776
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-wt)
1777
- )
1778
- );
1779
- --_sf-hr-ft-se-ic: var(
1780
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-se-ic,
1781
- var(
1782
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-se-ic,
1783
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-se-ic)
1784
- )
1785
- );
1786
- --_sf-hr-tt-an: var(
1787
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-tt-an,
1788
- var(
1789
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-tt-an,
1790
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-tt-an)
1791
- )
1792
- );
1793
- --_sf-hr-lr-sg: var(
1794
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-lr-sg,
1795
- var(
1796
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-lr-sg,
1797
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-lr-sg)
1798
- )
1799
- );
1800
- --_sf-hr-le-ht: var(
1801
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-le-ht,
1802
- var(
1803
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-le-ht,
1804
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-le-ht)
1805
- )
1806
- );
1807
-
1808
- --_sf-hr-in-se: var(
1809
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-in-se,
1810
- var(
1811
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-in-se,
1812
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-in-se)
1813
- )
1814
- );
1815
- --_sf-hr-in-se: var(
1816
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-in-se,
1817
- var(
1818
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-in-se,
1819
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-in-se)
1820
- )
1821
- );
1822
- --_sf-hr-in-c1: var(
1823
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-in-c1,
1824
- var(
1825
- --_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-in-c1,
1826
- var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-in-c1)
1827
- )
1828
- );
1829
- --_sf-hr-ue: var(
1830
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ue,
1831
- var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ue, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ue))
1832
- );
1282
+ --_sf-hr-cr: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-cr,
1283
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-cr, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-cr)));
1284
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-fy,
1285
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-fy,
1286
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-fy)));
1287
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-tt-tm,
1288
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-tt-tm,
1289
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-tt-tm)));
1290
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-wd-wp,
1291
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-wd-wp,
1292
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-wd-wp)));
1293
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-wd-bk,
1294
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-wd-bk,
1295
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-wd-bk)));
1296
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-se,
1297
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-se,
1298
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-se)));
1299
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-wt,
1300
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-wt,
1301
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-wt)));
1302
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ft-se-ic,
1303
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ft-se-ic,
1304
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ft-se-ic)));
1305
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-tt-an,
1306
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-tt-an,
1307
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-tt-an)));
1308
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-lr-sg,
1309
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-lr-sg,
1310
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-lr-sg)));
1311
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-le-ht,
1312
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-le-ht,
1313
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-le-ht)));
1314
+
1315
+ --_sf-hr-in-se: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-in-se,
1316
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-in-se,
1317
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-in-se)));
1318
+ --_sf-hr-in-se: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-in-se,
1319
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-in-se,
1320
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-in-se)));
1321
+ --_sf-hr-in-c1: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-in-c1,
1322
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-in-c1,
1323
+ var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-in-c1)));
1324
+ --_sf-hr-ue: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-se-ue,
1325
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-se-ue, var(--_ctm-dn-be-ds-pe-bn-dn-hr-se-ue)));
1833
1326
 
1834
1327
  // for pading and width
1835
- --_sf-hr-pg: var(
1836
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-pg,
1837
- var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-pg, var(--_ctm-dn-be-ds-pe-bn-dn-hr-pg))
1838
- );
1839
- --_sf-hr-wh: var(
1840
- --_ctm-mob-dn-be-ds-pe-bn-dn-hr-wh,
1841
- var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-wh, var(--_ctm-dn-be-ds-pe-bn-dn-hr-wh))
1842
- );
1328
+ --_sf-hr-pg: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-pg,
1329
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-pg, var(--_ctm-dn-be-ds-pe-bn-dn-hr-pg)));
1330
+ --_sf-hr-wh: var(--_ctm-mob-dn-be-ds-pe-bn-dn-hr-wh,
1331
+ var(--_ctm-tab-dn-be-ds-pe-bn-dn-hr-wh, var(--_ctm-dn-be-ds-pe-bn-dn-hr-wh)));
1843
1332
 
1844
1333
  &[data-hover-show-shadow="false"] {
1845
1334
  --_hover-show-shadow: none;
1846
1335
  }
1336
+
1847
1337
  &[data-hover-show-icon="false"] {
1848
1338
  --_hover-show-icon: none;
1849
1339
  }
1850
1340
  }
1851
- background-color: var(
1852
- --_sf-hr-bd-cr,
1853
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-bd-cr)
1854
- );
1341
+
1342
+ background-color: var(--_sf-hr-bd-cr,
1343
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-bd-cr));
1855
1344
 
1856
1345
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-pg));
1857
1346
  width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-wh));
@@ -1859,40 +1348,25 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1859
1348
  flex-direction: var(--_sf-fd-bn);
1860
1349
  align-items: center;
1861
1350
 
1862
- justify-content: var(
1863
- --_sf-hr-at,
1864
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-at)
1865
- );
1351
+ justify-content: var(--_sf-hr-at,
1352
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-at));
1866
1353
  gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-gp));
1867
1354
 
1868
- border-radius: var(
1869
- --_sf-hr-br-rs,
1870
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-rs)
1871
- );
1355
+ border-radius: var(--_sf-hr-br-rs,
1356
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-rs));
1872
1357
 
1873
- box-shadow: var(
1874
- --_sf-hr-sw-ae,
1875
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-ae)
1876
- )
1877
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-br))
1878
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-sd))
1879
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-cr));
1358
+ box-shadow: var(--_sf-hr-sw-ae,
1359
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-sw-cr));
1880
1360
 
1881
1361
  &[data-show-border="true"] {
1882
- border-color: var(
1883
- --_sf-hr-br-cr,
1884
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-cr)
1885
- );
1886
-
1887
- border-style: var(
1888
- --_sf-hr-br-se,
1889
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-se)
1890
- );
1891
-
1892
- border-width: var(
1893
- --_sf-hr-br-wh,
1894
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-wh)
1895
- );
1362
+ border-color: var(--_sf-hr-br-cr,
1363
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-cr));
1364
+
1365
+ border-style: var(--_sf-hr-br-se,
1366
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-se));
1367
+
1368
+ border-width: var(--_sf-hr-br-wh,
1369
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-br-wh));
1896
1370
  }
1897
1371
 
1898
1372
  .txt {
@@ -1900,82 +1374,59 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1900
1374
 
1901
1375
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-cr));
1902
1376
 
1903
- font-family: var(
1904
- --_sf-hr-ft-fy,
1905
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-fy)
1906
- );
1907
- text-transform: var(
1908
- --_sf-hr-tt-tm,
1909
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-tt-tm)
1910
- );
1911
- word-wrap: var(
1912
- --_sf-hr-wd-wp,
1913
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-wd-wp)
1914
- );
1915
- word-break: var(
1916
- --_sf-hr-wd-bk,
1917
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-wd-bk)
1918
- );
1377
+ font-family: var(--_sf-hr-ft-fy,
1378
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-fy));
1379
+ text-transform: var(--_sf-hr-tt-tm,
1380
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-tt-tm));
1381
+ word-wrap: var(--_sf-hr-wd-wp,
1382
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-wd-wp));
1383
+ word-break: var(--_sf-hr-wd-bk,
1384
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-wd-bk));
1385
+
1919
1386
  &.flex__overflow {
1920
1387
  white-space: normal;
1921
1388
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
1922
1389
  }
1923
1390
 
1924
- font-size: var(
1925
- --_sf-hr-ft-se,
1926
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-se)
1927
- );
1391
+ font-size: var(--_sf-hr-ft-se,
1392
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-se));
1928
1393
 
1929
- font-weight: var(
1930
- --_sf-hr-ft-wt,
1931
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-wt)
1932
- );
1394
+ font-weight: var(--_sf-hr-ft-wt,
1395
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-wt));
1933
1396
 
1934
- font-style: var(
1935
- --_sf-hr-ft-se-ic,
1936
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-se-ic)
1937
- );
1397
+ font-style: var(--_sf-hr-ft-se-ic,
1398
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-ft-se-ic));
1938
1399
 
1939
- text-align: var(
1940
- --_sf-hr-tt-an,
1941
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-tt-an)
1942
- );
1400
+ text-align: var(--_sf-hr-tt-an,
1401
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-tt-an));
1943
1402
 
1944
- letter-spacing: var(
1945
- --_sf-hr-lr-sg,
1946
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-lr-sg)
1947
- );
1403
+ letter-spacing: var(--_sf-hr-lr-sg,
1404
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-lr-sg));
1948
1405
 
1949
- line-height: var(
1950
- --_sf-hr-le-ht,
1951
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-le-ht)
1952
- );
1406
+ line-height: var(--_sf-hr-le-ht,
1407
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-le-ht));
1953
1408
 
1954
1409
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
1955
1410
  }
1956
1411
 
1957
1412
  .icon {
1958
1413
  display: var(--_hover-show-icon, var(--_show-icon, flex));
1414
+
1959
1415
  svg {
1960
- width: var(
1961
- --_sf-hr-in-se,
1962
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-in-se)
1963
- );
1964
- height: var(
1965
- --_sf-hr-in-se,
1966
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-in-se)
1967
- );
1416
+ width: var(--_sf-hr-in-se,
1417
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-in-se));
1418
+ height: var(--_sf-hr-in-se,
1419
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-in-se));
1968
1420
 
1969
1421
  path {
1970
- stroke: var(
1971
- --_sf-hr-in-c1,
1972
- prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-in-c1)
1973
- );
1422
+ stroke: var(--_sf-hr-in-c1,
1423
+ prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-in-c1));
1974
1424
  // Overrides the stroke-width presentation attribute baked into the icon markup.
1975
1425
  stroke-width: prepareMediaVariable(--_ctm-dn-be-ds-pe-bn-dn-dt-se-se-wh, 1.25);
1976
1426
  }
1977
1427
  }
1978
1428
  }
1429
+
1979
1430
  [data-element-style="Text"] {
1980
1431
  display: inline-block;
1981
1432
  width: 100%;
@@ -2000,17 +1451,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2000
1451
  }
2001
1452
  }
2002
1453
  }
1454
+
2003
1455
  .divider {
2004
1456
  border: none;
2005
- height: var(
2006
- --_ctm-mob-dr-dr-wt,
2007
- var(--_ctm-tab-dr-dr-wt, var(--_ctm-dn-dr-dr-wt))
2008
- ); /* Set thickness */
2009
- background-color: var(
2010
- --_ctm-mob-dr-dr-cr,
2011
- var(--_ctm-tab-dr-dr-cr, var(--_ctm-dn-dr-dr-cr))
2012
- );
1457
+ height: var(--_ctm-mob-dr-dr-wt,
1458
+ var(--_ctm-tab-dr-dr-wt, var(--_ctm-dn-dr-dr-wt)));
1459
+ /* Set thickness */
1460
+ background-color: var(--_ctm-mob-dr-dr-cr,
1461
+ var(--_ctm-tab-dr-dr-cr, var(--_ctm-dn-dr-dr-cr)));
2013
1462
  }
1463
+
2014
1464
  .single__bundle_slider {
2015
1465
  display: flex;
2016
1466
  flex-direction: column;
@@ -2018,6 +1468,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2018
1468
  align-items: flex-start;
2019
1469
  flex: 1;
2020
1470
  min-height: 0;
1471
+
2021
1472
  // height: 100%;
2022
1473
  // & > div {
2023
1474
  // height: 100%;
@@ -2028,18 +1479,21 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2028
1479
  min-height: 0;
2029
1480
  width: 100%;
2030
1481
  }
1482
+
2031
1483
  .items__warper {
2032
1484
  display: flex;
2033
1485
  gap: prepareMediaVariable(--_ctm-lt-im-sg);
2034
1486
  flex-wrap: wrap;
2035
1487
  // align-items: center;
2036
1488
  --items-per-row: #{prepareMediaVariable(--_ctm-lt-is-pr-rw)};
1489
+
2037
1490
  .bundle-image-container,
2038
1491
  .tiles-grid-view {
2039
1492
  flex: 0 0 calc((100% / var(--items-per-row)) - var(--_ctm-lt-im-sg));
2040
1493
  height: unset;
2041
1494
  }
2042
1495
  }
1496
+
2043
1497
  .bundle-image-container {
2044
1498
  height: 100%;
2045
1499
  background-color: prepareMediaVariable(--_ctm-dn-pt-cd-dn-bd-cr);
@@ -2047,10 +1501,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2047
1501
  border-style: prepareMediaVariable(--_ctm-dn-pt-cd-dn-br-se);
2048
1502
  border-color: prepareMediaVariable(--_ctm-dn-pt-cd-dn-br-cr);
2049
1503
  border-radius: prepareMediaVariable(--_ctm-dn-pt-cd-dn-br-rs);
2050
- box-shadow: prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-ae)
2051
- prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-br)
2052
- prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-sd)
2053
- prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-cr);
1504
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-ae) prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-br) prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-sd) prepareMediaVariable(--_ctm-dn-pt-cd-dn-sw-cr);
2054
1505
  width: 100%;
2055
1506
  display: flex;
2056
1507
  flex-direction: column;
@@ -2067,6 +1518,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2067
1518
  min-height: 100px;
2068
1519
  width: 100%;
2069
1520
  max-height: prepareMediaVariable(--_ctm-lt-ie-ht);
1521
+
2070
1522
  img {
2071
1523
  max-width: 100%;
2072
1524
  // max-height: 100%;
@@ -2076,6 +1528,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2076
1528
  height: prepareMediaVariable(--_ctm-lt-ie-ht);
2077
1529
  }
2078
1530
  }
1531
+
2079
1532
  .img-title {
2080
1533
  // padding: 12px;
2081
1534
  font-family: prepareMediaVariable(--_ctm-dn-pt-ne-dn-ft-fy);
@@ -2095,171 +1548,117 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2095
1548
  border-style: prepareMediaVariable(--_ctm-dn-pt-ne-dn-br-se);
2096
1549
  border-radius: prepareMediaVariable(--_ctm-dn-pt-ne-dn-br-rs);
2097
1550
  text-transform: prepareMediaVariable(--_ctm-dn-pt-ne-dn-tt-tm);
2098
- box-shadow: prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-ae)
2099
- prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-br)
2100
- prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-sd)
2101
- prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-cr);
1551
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-ae) prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-br) prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-sd) prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-cr);
1552
+
2102
1553
  &#{$overflowSelector} {
2103
1554
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2104
1555
  }
2105
1556
  }
2106
1557
  }
1558
+
2107
1559
  .bundle__navigation_btn_wrapper {
2108
1560
  display: flex;
2109
1561
  width: 100%;
2110
1562
  justify-content: center;
2111
1563
  }
1564
+
2112
1565
  .btn__with__text[data-btn-name="bundle_navigation_button"] {
2113
1566
  justify-content: center;
1567
+
2114
1568
  &[data-show-shadow="false"] {
2115
1569
  --_show-shadow: none;
2116
1570
  }
1571
+
2117
1572
  &[data-icon-position="left"] {
2118
1573
  --_sf-fd-bn: row;
2119
1574
  }
1575
+
2120
1576
  &[data-icon-position="right"] {
2121
1577
  --_sf-fd-bn: row-reverse;
2122
1578
  }
1579
+
2123
1580
  &[data-icon-position="center"] {
2124
1581
  --_sf-fd-bn: row;
2125
1582
  }
2126
1583
 
2127
1584
  &:hover {
2128
- --_sf-hr-bd-cr: var(
2129
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-bd-cr,
2130
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-bd-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-bd-cr))
2131
- );
2132
- --_sf-hr-br-cr: var(
2133
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-br-cr,
2134
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-cr))
2135
- );
2136
- --_sf-hr-br-se: var(
2137
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-br-se,
2138
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-se))
2139
- );
2140
- --_sf-hr-br-wh: var(
2141
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-br-wh,
2142
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-wh, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-wh))
2143
- );
2144
- --_sf-hr-br-rs: var(
2145
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-br-rs,
2146
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-rs, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-rs))
2147
- );
2148
- --_sf-hr-at: var(
2149
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-at,
2150
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-at, var(--_ctm-dn-be-nn-bn-dn-hr-se-at))
2151
- );
2152
- --_sf-hr-gp: var(
2153
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-gp,
2154
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-gp, var(--_ctm-dn-be-nn-bn-dn-hr-se-gp))
2155
- );
1585
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-bd-cr,
1586
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-bd-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-bd-cr)));
1587
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-br-cr,
1588
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-cr)));
1589
+ --_sf-hr-br-se: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-br-se,
1590
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-se)));
1591
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-br-wh,
1592
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-wh, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-wh)));
1593
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-br-rs,
1594
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-br-rs, var(--_ctm-dn-be-nn-bn-dn-hr-se-br-rs)));
1595
+ --_sf-hr-at: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-at,
1596
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-at, var(--_ctm-dn-be-nn-bn-dn-hr-se-at)));
1597
+ --_sf-hr-gp: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-gp,
1598
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-gp, var(--_ctm-dn-be-nn-bn-dn-hr-se-gp)));
2156
1599
 
2157
1600
  // for shadow
2158
- --_sf-hr-sw-ae: var(
2159
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-ae,
2160
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-ae, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-ae))
2161
- );
2162
- --_sf-hr-sw-br: var(
2163
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-br,
2164
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-br, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-br))
2165
- );
2166
- --_sf-hr-sw-hr: var(
2167
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-hr,
2168
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-hr, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-hr))
2169
- );
2170
- --_sf-hr-sw-cr: var(
2171
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-cr,
2172
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-cr))
2173
- );
1601
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-ae,
1602
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-ae, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-ae)));
1603
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-br,
1604
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-br, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-br)));
1605
+ --_sf-hr-sw-hr: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-hr,
1606
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-hr, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-hr)));
1607
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-sw-cr,
1608
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-sw-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-sw-cr)));
2174
1609
 
2175
1610
  // for font
2176
1611
 
2177
- --_sf-hr-cr: var(
2178
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-cr,
2179
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-cr))
2180
- );
2181
- --_sf-hr-ft-fy: var(
2182
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-fy,
2183
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-fy, var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-fy))
2184
- );
2185
- --_sf-hr-tt-tm: var(
2186
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-tt-tm,
2187
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-tt-tm, var(--_ctm-dn-be-nn-bn-dn-hr-se-tt-tm))
2188
- );
2189
- --_sf-hr-wd-wp: var(
2190
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-wd-wp,
2191
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-wd-wp, var(--_ctm-dn-be-nn-bn-dn-hr-se-wd-wp))
2192
- );
2193
- --_sf-hr-wd-bk: var(
2194
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-wd-bk,
2195
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-wd-bk, var(--_ctm-dn-be-nn-bn-dn-hr-se-wd-bk))
2196
- );
2197
- --_sf-hr-ft-se: var(
2198
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-se,
2199
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-se))
2200
- );
2201
- --_sf-hr-ft-wt: var(
2202
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-wt,
2203
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-wt, var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-wt))
2204
- );
2205
- --_sf-hr-ft-se-ic: var(
2206
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-se-ic,
2207
- var(
2208
- --_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-se-ic,
2209
- var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-se-ic)
2210
- )
2211
- );
2212
- --_sf-hr-tt-an: var(
2213
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-tt-an,
2214
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-tt-an, var(--_ctm-dn-be-nn-bn-dn-hr-se-tt-an))
2215
- );
2216
- --_sf-hr-lr-sg: var(
2217
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-lr-sg,
2218
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-lr-sg, var(--_ctm-dn-be-nn-bn-dn-hr-se-lr-sg))
2219
- );
2220
- --_sf-hr-le-ht: var(
2221
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-le-ht,
2222
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-le-ht, var(--_ctm-dn-be-nn-bn-dn-hr-se-le-ht))
2223
- );
2224
-
2225
- --_sf-hr-in-se: var(
2226
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-in-se,
2227
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-in-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-in-se))
2228
- );
2229
- --_sf-hr-in-se: var(
2230
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-in-se,
2231
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-in-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-in-se))
2232
- );
2233
- --_sf-hr-in-c1: var(
2234
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-in-c1,
2235
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-in-c1, var(--_ctm-dn-be-nn-bn-dn-hr-se-in-c1))
2236
- );
2237
- --_sf-hr-ue: var(
2238
- --_ctm-mob-dn-be-nn-bn-dn-hr-se-ue,
2239
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ue, var(--_ctm-dn-be-nn-bn-dn-hr-se-ue))
2240
- );
1612
+ --_sf-hr-cr: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-cr,
1613
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-cr, var(--_ctm-dn-be-nn-bn-dn-hr-se-cr)));
1614
+ --_sf-hr-ft-fy: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-fy,
1615
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-fy, var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-fy)));
1616
+ --_sf-hr-tt-tm: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-tt-tm,
1617
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-tt-tm, var(--_ctm-dn-be-nn-bn-dn-hr-se-tt-tm)));
1618
+ --_sf-hr-wd-wp: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-wd-wp,
1619
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-wd-wp, var(--_ctm-dn-be-nn-bn-dn-hr-se-wd-wp)));
1620
+ --_sf-hr-wd-bk: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-wd-bk,
1621
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-wd-bk, var(--_ctm-dn-be-nn-bn-dn-hr-se-wd-bk)));
1622
+ --_sf-hr-ft-se: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-se,
1623
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-se)));
1624
+ --_sf-hr-ft-wt: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-wt,
1625
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-wt, var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-wt)));
1626
+ --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-ft-se-ic,
1627
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ft-se-ic,
1628
+ var(--_ctm-dn-be-nn-bn-dn-hr-se-ft-se-ic)));
1629
+ --_sf-hr-tt-an: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-tt-an,
1630
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-tt-an, var(--_ctm-dn-be-nn-bn-dn-hr-se-tt-an)));
1631
+ --_sf-hr-lr-sg: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-lr-sg,
1632
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-lr-sg, var(--_ctm-dn-be-nn-bn-dn-hr-se-lr-sg)));
1633
+ --_sf-hr-le-ht: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-le-ht,
1634
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-le-ht, var(--_ctm-dn-be-nn-bn-dn-hr-se-le-ht)));
1635
+
1636
+ --_sf-hr-in-se: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-in-se,
1637
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-in-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-in-se)));
1638
+ --_sf-hr-in-se: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-in-se,
1639
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-in-se, var(--_ctm-dn-be-nn-bn-dn-hr-se-in-se)));
1640
+ --_sf-hr-in-c1: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-in-c1,
1641
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-in-c1, var(--_ctm-dn-be-nn-bn-dn-hr-se-in-c1)));
1642
+ --_sf-hr-ue: var(--_ctm-mob-dn-be-nn-bn-dn-hr-se-ue,
1643
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-se-ue, var(--_ctm-dn-be-nn-bn-dn-hr-se-ue)));
2241
1644
 
2242
1645
  // for pading and width
2243
- --_sf-hr-pg: var(
2244
- --_ctm-mob-dn-be-nn-bn-dn-hr-pg,
2245
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-pg, var(--_ctm-dn-be-nn-bn-dn-hr-pg))
2246
- );
2247
- --_sf-hr-wh: var(
2248
- --_ctm-mob-dn-be-nn-bn-dn-hr-wh,
2249
- var(--_ctm-tab-dn-be-nn-bn-dn-hr-wh, var(--_ctm-dn-be-nn-bn-dn-hr-wh))
2250
- );
1646
+ --_sf-hr-pg: var(--_ctm-mob-dn-be-nn-bn-dn-hr-pg,
1647
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-pg, var(--_ctm-dn-be-nn-bn-dn-hr-pg)));
1648
+ --_sf-hr-wh: var(--_ctm-mob-dn-be-nn-bn-dn-hr-wh,
1649
+ var(--_ctm-tab-dn-be-nn-bn-dn-hr-wh, var(--_ctm-dn-be-nn-bn-dn-hr-wh)));
2251
1650
 
2252
1651
  &[data-hover-show-shadow="false"] {
2253
1652
  --_hover-show-shadow: none;
2254
1653
  }
1654
+
2255
1655
  &[data-hover-show-icon="false"] {
2256
1656
  --_hover-show-icon: none;
2257
1657
  }
2258
1658
  }
2259
- background-color: var(
2260
- --_sf-hr-bd-cr,
2261
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-bd-cr)
2262
- );
1659
+
1660
+ background-color: var(--_sf-hr-bd-cr,
1661
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-bd-cr));
2263
1662
 
2264
1663
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-pg));
2265
1664
  width: var(--_sf-hr-wh, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-wh));
@@ -2270,31 +1669,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2270
1669
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-at));
2271
1670
  gap: var(--_sf-hr-gp, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-gp));
2272
1671
 
2273
- border-radius: var(
2274
- --_sf-hr-br-rs,
2275
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-rs)
2276
- );
1672
+ border-radius: var(--_sf-hr-br-rs,
1673
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-rs));
2277
1674
 
2278
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-ae))
2279
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-br))
2280
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-sd))
2281
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-cr));
1675
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-sw-cr));
2282
1676
 
2283
1677
  &[data-show-border="true"] {
2284
- border-color: var(
2285
- --_sf-hr-br-cr,
2286
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-cr)
2287
- );
2288
-
2289
- border-style: var(
2290
- --_sf-hr-br-se,
2291
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-se)
2292
- );
2293
-
2294
- border-width: var(
2295
- --_sf-hr-br-wh,
2296
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-wh)
2297
- );
1678
+ border-color: var(--_sf-hr-br-cr,
1679
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-cr));
1680
+
1681
+ border-style: var(--_sf-hr-br-se,
1682
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-se));
1683
+
1684
+ border-width: var(--_sf-hr-br-wh,
1685
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-br-wh));
2298
1686
  }
2299
1687
 
2300
1688
  .txt {
@@ -2302,79 +1690,58 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2302
1690
 
2303
1691
  color: var(--_sf-hr-cr, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-cr));
2304
1692
 
2305
- font-family: var(
2306
- --_sf-hr-ft-fy,
2307
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-fy)
2308
- );
2309
- text-transform: var(
2310
- --_sf-hr-tt-tm,
2311
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-tt-tm)
2312
- );
2313
- word-wrap: var(
2314
- --_sf-hr-wd-wp,
2315
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-wd-wp)
2316
- );
2317
- word-break: var(
2318
- --_sf-hr-wd-bk,
2319
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-wd-bk)
2320
- );
1693
+ font-family: var(--_sf-hr-ft-fy,
1694
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-fy));
1695
+ text-transform: var(--_sf-hr-tt-tm,
1696
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-tt-tm));
1697
+ word-wrap: var(--_sf-hr-wd-wp,
1698
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-wd-wp));
1699
+ word-break: var(--_sf-hr-wd-bk,
1700
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-wd-bk));
1701
+
2321
1702
  &.flex__overflow {
2322
1703
  white-space: normal;
2323
1704
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2324
1705
  }
2325
1706
 
2326
- font-size: var(
2327
- --_sf-hr-ft-se,
2328
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-se)
2329
- );
1707
+ font-size: var(--_sf-hr-ft-se,
1708
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-se));
2330
1709
 
2331
- font-weight: var(
2332
- --_sf-hr-ft-wt,
2333
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-wt)
2334
- );
1710
+ font-weight: var(--_sf-hr-ft-wt,
1711
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-wt));
2335
1712
 
2336
- font-style: var(
2337
- --_sf-hr-ft-se-ic,
2338
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-se-ic)
2339
- );
1713
+ font-style: var(--_sf-hr-ft-se-ic,
1714
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-ft-se-ic));
2340
1715
 
2341
- text-align: var(
2342
- --_sf-hr-tt-an,
2343
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-tt-an)
2344
- );
1716
+ text-align: var(--_sf-hr-tt-an,
1717
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-tt-an));
2345
1718
 
2346
- letter-spacing: var(
2347
- --_sf-hr-lr-sg,
2348
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-lr-sg)
2349
- );
1719
+ letter-spacing: var(--_sf-hr-lr-sg,
1720
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-lr-sg));
2350
1721
 
2351
- line-height: var(
2352
- --_sf-hr-le-ht,
2353
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-le-ht)
2354
- );
1722
+ line-height: var(--_sf-hr-le-ht,
1723
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-le-ht));
2355
1724
 
2356
1725
  text-decoration: var(--_sf-hr-ue, prepareMediaVariable(--_ctm-dn-dt-ue));
2357
1726
  }
2358
1727
 
2359
1728
  .icon {
2360
1729
  display: var(--_hover-show-icon, var(--_show-icon, flex));
1730
+
2361
1731
  svg {
2362
1732
  width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-in-se));
2363
- height: var(
2364
- --_sf-hr-in-se,
2365
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-in-se)
2366
- );
1733
+ height: var(--_sf-hr-in-se,
1734
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-in-se));
2367
1735
 
2368
1736
  path {
2369
- stroke: var(
2370
- --_sf-hr-in-c1,
2371
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-in-c1)
2372
- );
1737
+ stroke: var(--_sf-hr-in-c1,
1738
+ prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-in-c1));
2373
1739
  // Overrides the stroke-width presentation attribute baked into the icon markup.
2374
1740
  stroke-width: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-dt-se-se-wh, 1.25);
2375
1741
  }
2376
1742
  }
2377
1743
  }
1744
+
2378
1745
  [data-element-style="Text"] {
2379
1746
  display: inline-block;
2380
1747
  width: 100%;
@@ -2416,10 +1783,12 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2416
1783
  text-transform: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-tt-tm);
2417
1784
  word-wrap: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-wd-wp);
2418
1785
  word-break: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-wd-bk);
1786
+
2419
1787
  &.flex__overflow {
2420
1788
  white-space: normal;
2421
1789
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2422
1790
  }
1791
+
2423
1792
  font-size: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-se);
2424
1793
  color: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-cr);
2425
1794
  font-weight: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-wt);
@@ -2433,15 +1802,13 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2433
1802
  border-color: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-cr);
2434
1803
  border-style: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-se);
2435
1804
  border-radius: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-rs);
2436
- box-shadow: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-ae)
2437
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-br)
2438
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-sd)
2439
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-cr);
1805
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-ae) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-br) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-sd) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-cr);
2440
1806
 
2441
1807
  .icon {
2442
1808
  svg {
2443
1809
  width: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-se);
2444
1810
  height: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-se);
1811
+
2445
1812
  path {
2446
1813
  stroke: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-c1);
2447
1814
  // Overrides the stroke-width presentation attribute baked into the icon markup.
@@ -2480,17 +1847,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2480
1847
  gap: prepareMediaVariable(--_ctm-lt-im-gp);
2481
1848
  justify-content: space-between;
2482
1849
  background-color: prepareMediaVariable(--_ctm-dn-te-cd-dn-bd-cr);
1850
+
2483
1851
  // Border only drawn when the tile card's "Show Border" toggle is on.
2484
1852
  &[data-show-border="true"] {
2485
1853
  border-width: prepareMediaVariable(--_ctm-dn-te-cd-dn-br-wh);
2486
1854
  border-style: prepareMediaVariable(--_ctm-dn-te-cd-dn-br-se);
2487
1855
  border-color: prepareMediaVariable(--_ctm-dn-te-cd-dn-br-cr);
2488
1856
  }
1857
+
2489
1858
  border-radius: prepareMediaVariable(--_ctm-dn-te-cd-dn-br-rs);
2490
- box-shadow: prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-ae)
2491
- prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-br)
2492
- prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-sd)
2493
- prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-cr);
1859
+ box-shadow: prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-ae) prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-br) prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-sd) prepareMediaVariable(--_ctm-dn-te-cd-dn-sw-cr);
2494
1860
 
2495
1861
  .tile-content {
2496
1862
  display: flex;
@@ -2499,6 +1865,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2499
1865
  align-items: flex-start;
2500
1866
  height: 100%;
2501
1867
  width: 100%;
1868
+
2502
1869
  .tile_bundle_name {
2503
1870
  display: flex;
2504
1871
  align-items: flex-start;
@@ -2511,10 +1878,12 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2511
1878
  text-transform: prepareMediaVariable(--_ctm-dn-pt-ne-dn-tt-tm);
2512
1879
  word-wrap: prepareMediaVariable(--_ctm-dn-pt-ne-dn-wd-wp);
2513
1880
  word-break: prepareMediaVariable(--_ctm-dn-pt-ne-dn-wd-bk);
1881
+
2514
1882
  &.flex__overflow {
2515
1883
  white-space: normal;
2516
1884
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2517
1885
  }
1886
+
2518
1887
  font-size: prepareMediaVariable(--_ctm-dn-pt-ne-dn-ft-se);
2519
1888
  color: prepareMediaVariable(--_ctm-dn-pt-ne-dn-cr);
2520
1889
  font-weight: prepareMediaVariable(--_ctm-dn-pt-ne-dn-ft-wt);
@@ -2528,10 +1897,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2528
1897
  border-color: prepareMediaVariable(--_ctm-dn-pt-ne-dn-br-cr);
2529
1898
  border-style: prepareMediaVariable(--_ctm-dn-pt-ne-dn-br-se);
2530
1899
  border-radius: prepareMediaVariable(--_ctm-dn-pt-ne-dn-br-rs);
2531
- box-shadow: prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-ae)
2532
- prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-br)
2533
- prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-sd)
2534
- prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-cr);
1900
+ box-shadow: prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-ae) prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-br) prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-sd) prepareMediaVariable(--_ctm-dn-pt-ne-dn-sw-cr);
2535
1901
 
2536
1902
  &#{$overflowSelector} {
2537
1903
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -2556,13 +1922,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2556
1922
  // Rows next to a category slider also reserve the arrow button
2557
1923
  // box — same sizing NAVIGATION_STYLES gives those buttons.
2558
1924
  &[data-reserve-nav-height="true"] {
2559
- min-height: calc(
2560
- var(
2561
- --_sf-icn-size,
2562
- #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-cy-sr-dt-se-in-se, 16px)}
2563
- ) *
2564
- 1.75
2565
- );
1925
+ min-height: calc(var(--_sf-icn-size,
1926
+ #{prepareMediaVariable(--_ctm-dn-sr-nn-ss-cy-sr-dt-se-in-se, 16px)}) * 1.75);
2566
1927
  }
2567
1928
  }
2568
1929
 
@@ -2607,6 +1968,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2607
1968
  }
2608
1969
 
2609
1970
  &.animate-flip {
1971
+
2610
1972
  // Padding cells hold no image, so they sit the animation out.
2611
1973
  .product-image-wrapper:not(.empty-image-slot) {
2612
1974
  animation: flip 0.6s ease-in-out;
@@ -2616,6 +1978,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2616
1978
  0% {
2617
1979
  transform: rotateY(0deg);
2618
1980
  }
1981
+
2619
1982
  100% {
2620
1983
  transform: rotateY(180deg);
2621
1984
  }
@@ -2630,17 +1993,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2630
1993
  justify-content: center;
2631
1994
  align-items: center;
2632
1995
  background-color: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-bd-cr);
1996
+
2633
1997
  // Border only drawn when the tile card image's "Show Border" toggle is on.
2634
1998
  &[data-show-border="true"] {
2635
1999
  border-width: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-br-wh);
2636
2000
  border-color: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-br-cr);
2637
2001
  border-style: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-br-se);
2638
2002
  }
2003
+
2639
2004
  border-radius: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-br-rs);
2640
- box-shadow: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-ae)
2641
- prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-br)
2642
- prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-sd)
2643
- prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-cr);
2005
+ box-shadow: prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-ae) prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-br) prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-sd) prepareMediaVariable(--_ctm-dn-te-cd-ie-dn-sw-cr);
2644
2006
 
2645
2007
  img {
2646
2008
  // max-height: 135px;
@@ -2664,10 +2026,12 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2664
2026
  text-transform: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-tt-tm);
2665
2027
  word-wrap: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-wd-wp);
2666
2028
  word-break: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-wd-bk);
2029
+
2667
2030
  &.flex__overflow {
2668
2031
  white-space: normal;
2669
2032
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2670
2033
  }
2034
+
2671
2035
  font-size: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-se);
2672
2036
  color: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-cr);
2673
2037
  font-weight: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-wt);
@@ -2681,15 +2045,13 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2681
2045
  border-color: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-cr);
2682
2046
  border-style: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-se);
2683
2047
  border-radius: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-rs);
2684
- box-shadow: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-ae)
2685
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-br)
2686
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-sd)
2687
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-cr);
2048
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-ae) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-br) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-sd) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-cr);
2688
2049
 
2689
2050
  .icon {
2690
2051
  svg {
2691
2052
  width: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-se);
2692
2053
  height: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-se);
2054
+
2693
2055
  path {
2694
2056
  stroke: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-c1);
2695
2057
  // Overrides the stroke-width presentation attribute baked into the icon markup.
@@ -2716,10 +2078,12 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2716
2078
  font-family: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-fy);
2717
2079
  word-wrap: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-wd-wp);
2718
2080
  word-break: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-wd-bk);
2081
+
2719
2082
  &.flex__overflow {
2720
2083
  white-space: normal;
2721
2084
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
2722
2085
  }
2086
+
2723
2087
  font-size: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-se);
2724
2088
  color: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-cr);
2725
2089
  font-weight: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-ft-wt);
@@ -2733,15 +2097,13 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2733
2097
  border-color: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-cr);
2734
2098
  border-style: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-se);
2735
2099
  border-radius: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-br-rs);
2736
- box-shadow: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-ae)
2737
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-br)
2738
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-sd)
2739
- prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-cr);
2100
+ box-shadow: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-ae) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-br) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-sd) prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-sw-cr);
2740
2101
 
2741
2102
  .icon {
2742
2103
  svg {
2743
2104
  width: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-se);
2744
2105
  height: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-se);
2106
+
2745
2107
  path {
2746
2108
  stroke: prepareMediaVariable(--_ctm-dn-be-nn-bn-dn-in-c1);
2747
2109
  // Overrides the stroke-width presentation attribute baked into the icon markup.
@@ -2754,10 +2116,12 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2754
2116
  }
2755
2117
  }
2756
2118
  }
2119
+
2757
2120
  .embla__container {
2758
2121
  gap: prepareMediaVariable(--_ctm-lt-im-sg);
2759
2122
  }
2760
2123
  }
2124
+
2761
2125
  .arrow-navigation-categories {
2762
2126
  display: flex;
2763
2127
  flex-direction: row;
@@ -2765,7 +2129,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2765
2129
  justify-content: space-between;
2766
2130
  gap: 4px;
2767
2131
 
2768
- & > button {
2132
+ &>button {
2769
2133
  // display: var(--_d-flex);
2770
2134
  // align-items: center;
2771
2135
  // justify-content: center;
@@ -2775,4 +2139,4 @@ $resizeActive: '[data-cms-element-resizer="true"]';
2775
2139
  }
2776
2140
  }
2777
2141
  }
2778
- }
2142
+ }