@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
@@ -11,23 +11,13 @@ $defaultValues: (
11
11
  &[data-element-type="productImage"] {
12
12
  // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
13
  // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
14
- width: var(
15
- --_sf-el-wh-st-mx,
16
- calc(
17
- 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
18
- )
19
- );
14
+ width: var(--_sf-el-wh-st-mx,
15
+ calc(1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))));
20
16
  // height: var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht)));
21
17
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
22
18
 
23
19
  // aspect-ratio
24
- --_aspect-ratio: calc(
25
- 1 *
26
- (
27
- var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht))) /
28
- var(--_ctm-lt-wh, var(--_tst-lt-wh))
29
- )
30
- );
20
+ --_aspect-ratio: calc(1 * (var(--_ctm-mob-lt-ht, var(--_ctm-tab-lt-ht, var(--_ctm-lt-ht))) / var(--_ctm-lt-wh, var(--_tst-lt-wh))));
31
21
 
32
22
  // Display styles whose items stack vertically, with scroll control left at "Non".
33
23
  // These size to their content, so the element grows as more images arrive — 6
@@ -72,7 +62,7 @@ $defaultValues: (
72
62
  // }
73
63
  // }
74
64
 
75
- & > .wrapper {
65
+ &>.wrapper {
76
66
  width: 100%;
77
67
  height: 100%;
78
68
 
@@ -215,13 +205,9 @@ $defaultValues: (
215
205
  overflow: hidden;
216
206
 
217
207
  position: relative;
218
- background-color: var(
219
- --_ctm-mob-dn-gy-wt-se-bd-cr,
220
- var(
221
- --_ctm-tab-dn-gy-wt-se-bd-cr,
222
- var(--_ctm-dn-gy-wt-se-bd-cr, var(--_tst-dn-gy-wt-se-bd-cr))
223
- )
224
- );
208
+ background-color: var(--_ctm-mob-dn-gy-wt-se-bd-cr,
209
+ var(--_ctm-tab-dn-gy-wt-se-bd-cr,
210
+ var(--_ctm-dn-gy-wt-se-bd-cr, var(--_tst-dn-gy-wt-se-bd-cr))));
225
211
 
226
212
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
227
213
 
@@ -229,10 +215,8 @@ $defaultValues: (
229
215
  flex-direction: column;
230
216
  --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
231
217
 
232
- gap: var(
233
- --_ctm-mob-dn-gy-wt-lt-gy-tt-ad-im-sg,
234
- var(--_ctm-tab-dn-gy-wt-lt-gy-tt-ad-im-sg, var(--_ctm-dn-gy-wt-lt-gy-tt-ad-im-sg))
235
- );
218
+ gap: var(--_ctm-mob-dn-gy-wt-lt-gy-tt-ad-im-sg,
219
+ var(--_ctm-tab-dn-gy-wt-lt-gy-tt-ad-im-sg, var(--_ctm-dn-gy-wt-lt-gy-tt-ad-im-sg)));
236
220
 
237
221
  width: 100%;
238
222
  height: 100%;
@@ -248,54 +232,27 @@ $defaultValues: (
248
232
  --_show-gy-shadow: none;
249
233
  }
250
234
 
251
- border-color: var(
252
- --_show-gy-border,
253
- var(
254
- --_ctm-mob-dn-gy-wt-se-br-cr,
255
- var(--_ctm-tab-dn-gy-wt-se-br-cr, var(--_ctm-dn-gy-wt-se-br-cr))
256
- )
257
- );
258
-
259
- border-style: var(
260
- --_show-gy-border,
261
- var(
262
- --_ctm-mob-dn-gy-wt-se-br-se,
263
- var(--_ctm-tab-dn-gy-wt-se-br-se, var(--_ctm-dn-gy-wt-se-br-se))
264
- )
265
- );
266
-
267
- border-width: var(
268
- --_show-gy-border,
269
- var(
270
- --_ctm-mob-dn-gy-wt-se-br-wh,
271
- var(--_ctm-tab-dn-gy-wt-se-br-wh, var(--_ctm-dn-gy-wt-se-br-wh))
272
- )
273
- );
274
-
275
- border-radius: var(
276
- --_ctm-mob-dn-gy-wt-se-br-rs,
277
- var(--_ctm-tab-dn-gy-wt-se-br-rs, var(--_ctm-dn-gy-wt-se-br-rs))
278
- );
279
-
280
- box-shadow: var(
281
- --_show-gy-shadow,
282
- var(
283
- --_ctm-mob-dn-gy-wt-se-sw-ae,
284
- var(--_ctm-tab-dn-gy-wt-se-sw-ae, var(--_ctm-dn-gy-wt-se-sw-ae))
285
- )
286
- var(
287
- --_ctm-mob-dn-gy-wt-se-sw-br,
288
- var(--_ctm-tab-dn-gy-wt-se-sw-br, var(--_ctm-dn-gy-wt-se-sw-br))
289
- )
290
- var(
291
- --_ctm-mob-dn-gy-wt-se-sw-sd,
292
- var(--_ctm-tab-dn-gy-wt-se-sw-sd, var(--_ctm-dn-gy-wt-se-sw-sd))
293
- )
294
- var(
295
- --_ctm-mob-dn-gy-wt-se-sw-cr,
296
- var(--_ctm-tab-dn-gy-wt-se-sw-cr, var(--_ctm-dn-gy-wt-se-sw-cr))
297
- )
298
- );
235
+ border-color: var(--_show-gy-border,
236
+ var(--_ctm-mob-dn-gy-wt-se-br-cr,
237
+ var(--_ctm-tab-dn-gy-wt-se-br-cr, var(--_ctm-dn-gy-wt-se-br-cr))));
238
+
239
+ border-style: var(--_show-gy-border,
240
+ var(--_ctm-mob-dn-gy-wt-se-br-se,
241
+ var(--_ctm-tab-dn-gy-wt-se-br-se, var(--_ctm-dn-gy-wt-se-br-se))));
242
+
243
+ border-width: var(--_show-gy-border,
244
+ var(--_ctm-mob-dn-gy-wt-se-br-wh,
245
+ var(--_ctm-tab-dn-gy-wt-se-br-wh, var(--_ctm-dn-gy-wt-se-br-wh))));
246
+
247
+ border-radius: var(--_ctm-mob-dn-gy-wt-se-br-rs,
248
+ var(--_ctm-tab-dn-gy-wt-se-br-rs, var(--_ctm-dn-gy-wt-se-br-rs)));
249
+
250
+ box-shadow: var(--_show-gy-shadow,
251
+ var(--_ctm-mob-dn-gy-wt-se-sw-ae,
252
+ var(--_ctm-tab-dn-gy-wt-se-sw-ae, var(--_ctm-dn-gy-wt-se-sw-ae))) var(--_ctm-mob-dn-gy-wt-se-sw-br,
253
+ var(--_ctm-tab-dn-gy-wt-se-sw-br, var(--_ctm-dn-gy-wt-se-sw-br))) var(--_ctm-mob-dn-gy-wt-se-sw-sd,
254
+ var(--_ctm-tab-dn-gy-wt-se-sw-sd, var(--_ctm-dn-gy-wt-se-sw-sd))) var(--_ctm-mob-dn-gy-wt-se-sw-cr,
255
+ var(--_ctm-tab-dn-gy-wt-se-sw-cr, var(--_ctm-dn-gy-wt-se-sw-cr))));
299
256
 
300
257
  .gallery-header {
301
258
  // text-align: var(--_ctm-dn-gy-lt-an, var(--_tst-dn-gy-lt-an));
@@ -303,184 +260,107 @@ $defaultValues: (
303
260
  display: flex;
304
261
  flex-direction: column;
305
262
 
306
- gap: var(
307
- --_ctm-mob-dn-gy-wt-tt-cr-lt-te-ad-dn-sg,
308
- var(--_ctm-tab-dn-gy-wt-tt-cr-lt-te-ad-dn-sg, var(--_ctm-dn-gy-wt-tt-cr-lt-te-ad-dn-sg))
309
- );
263
+ gap: var(--_ctm-mob-dn-gy-wt-tt-cr-lt-te-ad-dn-sg,
264
+ var(--_ctm-tab-dn-gy-wt-tt-cr-lt-te-ad-dn-sg, var(--_ctm-dn-gy-wt-tt-cr-lt-te-ad-dn-sg)));
310
265
 
311
- padding-block: var(
312
- --_ctm-mob-dn-gy-wt-tt-cr-lt-tt-vl-pg,
313
- var(--_ctm-tab-dn-gy-wt-tt-cr-lt-tt-vl-pg, var(--_ctm-dn-gy-wt-tt-cr-lt-tt-vl-pg))
314
- );
266
+ padding-block: var(--_ctm-mob-dn-gy-wt-tt-cr-lt-tt-vl-pg,
267
+ var(--_ctm-tab-dn-gy-wt-tt-cr-lt-tt-vl-pg, var(--_ctm-dn-gy-wt-tt-cr-lt-tt-vl-pg)));
315
268
 
316
- padding-inline: var(
317
- --_ctm-mob-dn-gy-wt-tt-cr-lt-tt-hl-pg,
318
- var(--_ctm-tab-dn-gy-wt-tt-cr-lt-tt-hl-pg, var(--_ctm-dn-gy-wt-tt-cr-lt-tt-hl-pg))
319
- );
269
+ padding-inline: var(--_ctm-mob-dn-gy-wt-tt-cr-lt-tt-hl-pg,
270
+ var(--_ctm-tab-dn-gy-wt-tt-cr-lt-tt-hl-pg, var(--_ctm-dn-gy-wt-tt-cr-lt-tt-hl-pg)));
320
271
 
321
- background-color: var(
322
- --_ctm-mob-dn-gy-wt-tt-cr-dn-bd-cr,
323
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-bd-cr, var(--_ctm-dn-gy-wt-tt-cr-dn-bd-cr))
324
- );
272
+ background-color: var(--_ctm-mob-dn-gy-wt-tt-cr-dn-bd-cr,
273
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-bd-cr, var(--_ctm-dn-gy-wt-tt-cr-dn-bd-cr)));
325
274
 
326
275
  width: 100%;
327
276
 
328
- border-color: var(
329
- --_ctm-mob-dn-gy-wt-tt-cr-dn-br-cr,
330
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-cr, var(--_ctm-dn-gy-wt-tt-cr-dn-br-cr))
331
- );
332
-
333
- border-style: var(
334
- --_ctm-mob-dn-gy-wt-tt-cr-dn-br-se,
335
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-se, var(--_ctm-dn-gy-wt-tt-cr-dn-br-se))
336
- );
337
-
338
- border-width: var(
339
- --_ctm-mob-dn-gy-wt-tt-cr-dn-br-wh,
340
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-wh, var(--_ctm-dn-gy-wt-tt-cr-dn-br-wh))
341
- );
342
-
343
- border-radius: var(
344
- --_ctm-mob-dn-gy-wt-tt-cr-dn-br-rs,
345
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-rs, var(--_ctm-dn-gy-wt-tt-cr-dn-br-rs))
346
- );
347
-
348
- box-shadow: var(
349
- --_show-shadow,
350
- var(
351
- --_ctm-mob-dn-gy-wt-tt-cr-dn-sw-ae,
352
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-ae, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-ae))
353
- )
354
- var(
355
- --_ctm-mob-dn-gy-wt-tt-cr-dn-sw-br,
356
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-br, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-br))
357
- )
358
- var(
359
- --_ctm-mob-dn-gy-wt-tt-cr-dn-sw-sd,
360
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-sd, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-sd))
361
- )
362
- var(
363
- --_ctm-mob-dn-gy-wt-tt-cr-dn-sw-cr,
364
- var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-cr, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-cr))
365
- )
366
- );
277
+ border-color: var(--_ctm-mob-dn-gy-wt-tt-cr-dn-br-cr,
278
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-cr, var(--_ctm-dn-gy-wt-tt-cr-dn-br-cr)));
279
+
280
+ border-style: var(--_ctm-mob-dn-gy-wt-tt-cr-dn-br-se,
281
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-se, var(--_ctm-dn-gy-wt-tt-cr-dn-br-se)));
282
+
283
+ border-width: var(--_ctm-mob-dn-gy-wt-tt-cr-dn-br-wh,
284
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-wh, var(--_ctm-dn-gy-wt-tt-cr-dn-br-wh)));
285
+
286
+ border-radius: var(--_ctm-mob-dn-gy-wt-tt-cr-dn-br-rs,
287
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-br-rs, var(--_ctm-dn-gy-wt-tt-cr-dn-br-rs)));
288
+
289
+ box-shadow: var(--_show-shadow,
290
+ var(--_ctm-mob-dn-gy-wt-tt-cr-dn-sw-ae,
291
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-ae, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-ae))) var(--_ctm-mob-dn-gy-wt-tt-cr-dn-sw-br,
292
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-br, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-br))) var(--_ctm-mob-dn-gy-wt-tt-cr-dn-sw-sd,
293
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-sd, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-sd))) var(--_ctm-mob-dn-gy-wt-tt-cr-dn-sw-cr,
294
+ var(--_ctm-tab-dn-gy-wt-tt-cr-dn-sw-cr, var(--_ctm-dn-gy-wt-tt-cr-dn-sw-cr))));
367
295
 
368
296
  & h3 {
369
- color: var(
370
- --_ctm-mob-dn-gy-wt-se-cr,
371
- var(--_ctm-tab-dn-gy-wt-se-cr, var(--_ctm-dn-gy-wt-se-cr))
372
- );
373
-
374
- font-family: var(
375
- --_ctm-mob-dn-gy-wt-se-ft-fy,
376
- var(--_ctm-tab-dn-gy-wt-se-ft-fy, var(--_ctm-dn-gy-wt-se-ft-fy))
377
- );
378
- text-transform: var(
379
- --_ctm-mob-dn-gy-wt-se-tt-tm,
380
- var(--_ctm-tab-dn-gy-wt-se-tt-tm, var(--_ctm-dn-gy-wt-se-tt-tm))
381
- );
382
- word-wrap: var(
383
- --_ctm-mob-dn-gy-wt-se-wd-wp,
384
- var(--_ctm-tab-dn-gy-wt-se-wd-wp, var(--_ctm-dn-gy-wt-se-wd-wp))
385
- );
386
- word-break: var(
387
- --_ctm-mob-dn-gy-wt-se-wd-bk,
388
- var(--_ctm-tab-dn-gy-wt-se-wd-bk, var(--_ctm-dn-gy-wt-se-wd-bk))
389
- );
390
-
391
- font-size: var(
392
- --_ctm-mob-dn-gy-wt-se-ft-se,
393
- var(--_ctm-tab-dn-gy-wt-se-ft-se, var(--_ctm-dn-gy-wt-se-ft-se))
394
- );
395
-
396
- font-weight: var(
397
- --_ctm-mob-dn-gy-wt-se-ft-wt,
398
- var(--_ctm-tab-dn-gy-wt-se-ft-wt, var(--_ctm-dn-gy-wt-se-ft-wt))
399
- );
400
-
401
- font-style: var(
402
- --_ctm-mob-dn-gy-wt-se-ft-se-ic,
403
- var(--_ctm-tab-dn-gy-wt-se-ft-se-ic, var(--_ctm-dn-gy-wt-se-ft-se-ic))
404
- );
405
-
406
- text-align: var(
407
- --_ctm-mob-dn-gy-wt-se-tt-an,
408
- var(--_ctm-tab-dn-gy-wt-se-tt-an, var(--_ctm-dn-gy-wt-se-tt-an))
409
- );
410
-
411
- letter-spacing: var(
412
- --_ctm-mob-dn-gy-wt-se-lr-sg,
413
- var(--_ctm-tab-dn-gy-wt-se-lr-sg, var(--_ctm-dn-gy-wt-se-lr-sg))
414
- );
415
-
416
- line-height: var(
417
- --_ctm-mob-dn-gy-wt-se-le-ht,
418
- var(--_ctm-tab-dn-gy-wt-se-le-ht, var(--_ctm-dn-gy-wt-se-le-ht))
419
- );
420
-
421
- text-decoration: var(
422
- --_ctm-mob-dn-gy-wt-se-ue,
423
- var(--_ctm-tab-dn-gy-wt-se-ue, var(--_ctm-dn-gy-wt-se-ue))
424
- );
297
+ color: var(--_ctm-mob-dn-gy-wt-se-cr,
298
+ var(--_ctm-tab-dn-gy-wt-se-cr, var(--_ctm-dn-gy-wt-se-cr)));
299
+
300
+ font-family: var(--_ctm-mob-dn-gy-wt-se-ft-fy,
301
+ var(--_ctm-tab-dn-gy-wt-se-ft-fy, var(--_ctm-dn-gy-wt-se-ft-fy)));
302
+ text-transform: var(--_ctm-mob-dn-gy-wt-se-tt-tm,
303
+ var(--_ctm-tab-dn-gy-wt-se-tt-tm, var(--_ctm-dn-gy-wt-se-tt-tm)));
304
+ word-wrap: var(--_ctm-mob-dn-gy-wt-se-wd-wp,
305
+ var(--_ctm-tab-dn-gy-wt-se-wd-wp, var(--_ctm-dn-gy-wt-se-wd-wp)));
306
+ word-break: var(--_ctm-mob-dn-gy-wt-se-wd-bk,
307
+ var(--_ctm-tab-dn-gy-wt-se-wd-bk, var(--_ctm-dn-gy-wt-se-wd-bk)));
308
+
309
+ font-size: var(--_ctm-mob-dn-gy-wt-se-ft-se,
310
+ var(--_ctm-tab-dn-gy-wt-se-ft-se, var(--_ctm-dn-gy-wt-se-ft-se)));
311
+
312
+ font-weight: var(--_ctm-mob-dn-gy-wt-se-ft-wt,
313
+ var(--_ctm-tab-dn-gy-wt-se-ft-wt, var(--_ctm-dn-gy-wt-se-ft-wt)));
314
+
315
+ font-style: var(--_ctm-mob-dn-gy-wt-se-ft-se-ic,
316
+ var(--_ctm-tab-dn-gy-wt-se-ft-se-ic, var(--_ctm-dn-gy-wt-se-ft-se-ic)));
317
+
318
+ text-align: var(--_ctm-mob-dn-gy-wt-se-tt-an,
319
+ var(--_ctm-tab-dn-gy-wt-se-tt-an, var(--_ctm-dn-gy-wt-se-tt-an)));
320
+
321
+ letter-spacing: var(--_ctm-mob-dn-gy-wt-se-lr-sg,
322
+ var(--_ctm-tab-dn-gy-wt-se-lr-sg, var(--_ctm-dn-gy-wt-se-lr-sg)));
323
+
324
+ line-height: var(--_ctm-mob-dn-gy-wt-se-le-ht,
325
+ var(--_ctm-tab-dn-gy-wt-se-le-ht, var(--_ctm-dn-gy-wt-se-le-ht)));
326
+
327
+ text-decoration: var(--_ctm-mob-dn-gy-wt-se-ue,
328
+ var(--_ctm-tab-dn-gy-wt-se-ue, var(--_ctm-dn-gy-wt-se-ue)));
425
329
  }
426
330
 
427
331
  & p {
428
- color: var(
429
- --_ctm-mob-dn-gy-wt-se-cr-dc,
430
- var(--_ctm-tab-dn-gy-wt-se-cr-dc, var(--_ctm-dn-gy-wt-se-cr-dc))
431
- );
432
-
433
- font-family: var(
434
- --_ctm-mob-dn-gy-wt-se-ft-fy-dc,
435
- var(--_ctm-tab-dn-gy-wt-se-ft-fy-dc, var(--_ctm-dn-gy-wt-se-ft-fy-dc))
436
- );
437
- text-transform: var(
438
- --_ctm-mob-dn-gy-wt-se-tt-tm-dc,
439
- var(--_ctm-tab-dn-gy-wt-se-tt-tm-dc, var(--_ctm-dn-gy-wt-se-tt-tm-dc))
440
- );
441
- word-wrap: var(
442
- --_ctm-mob-dn-gy-wt-se-wd-wp-dc,
443
- var(--_ctm-tab-dn-gy-wt-se-wd-wp-dc, var(--_ctm-dn-gy-wt-se-wd-wp-dc))
444
- );
445
- word-break: var(
446
- --_ctm-mob-dn-gy-wt-se-wd-bk-dc,
447
- var(--_ctm-tab-dn-gy-wt-se-wd-bk-dc, var(--_ctm-dn-gy-wt-se-wd-bk-dc))
448
- );
449
-
450
- font-size: var(
451
- --_ctm-mob-dn-gy-wt-se-ft-se-dc,
452
- var(--_ctm-tab-dn-gy-wt-se-ft-se-dc, var(--_ctm-dn-gy-wt-se-ft-se-dc))
453
- );
454
-
455
- font-weight: var(
456
- --_ctm-mob-dn-gy-wt-se-ft-wt-dc,
457
- var(--_ctm-tab-dn-gy-wt-se-ft-wt-dc, var(--_ctm-dn-gy-wt-se-ft-wt-dc))
458
- );
459
-
460
- font-style: var(
461
- --_ctm-mob-dn-gy-wt-se-ft-se-ic-dc,
462
- var(--_ctm-tab-dn-gy-wt-se-ft-se-ic-dc, var(--_ctm-dn-gy-wt-se-ft-se-ic-dc))
463
- );
464
-
465
- text-align: var(
466
- --_ctm-mob-dn-gy-wt-se-tt-an-dc,
467
- var(--_ctm-tab-dn-gy-wt-se-tt-an-dc, var(--_ctm-dn-gy-wt-se-tt-an-dc))
468
- );
469
-
470
- letter-spacing: var(
471
- --_ctm-mob-dn-gy-wt-se-lr-sg-dc,
472
- var(--_ctm-tab-dn-gy-wt-se-lr-sg-dc, var(--_ctm-dn-gy-wt-se-lr-sg-dc))
473
- );
474
-
475
- line-height: var(
476
- --_ctm-mob-dn-gy-wt-se-le-ht-dc,
477
- var(--_ctm-tab-dn-gy-wt-se-le-ht-dc, var(--_ctm-dn-gy-wt-se-le-ht-dc))
478
- );
479
-
480
- text-decoration: var(
481
- --_ctm-mob-dn-gy-wt-se-ue-dc,
482
- var(--_ctm-tab-dn-gy-wt-se-ue-dc, var(--_ctm-dn-gy-wt-se-ue-dc))
483
- );
332
+ color: var(--_ctm-mob-dn-gy-wt-se-cr-dc,
333
+ var(--_ctm-tab-dn-gy-wt-se-cr-dc, var(--_ctm-dn-gy-wt-se-cr-dc)));
334
+
335
+ font-family: var(--_ctm-mob-dn-gy-wt-se-ft-fy-dc,
336
+ var(--_ctm-tab-dn-gy-wt-se-ft-fy-dc, var(--_ctm-dn-gy-wt-se-ft-fy-dc)));
337
+ text-transform: var(--_ctm-mob-dn-gy-wt-se-tt-tm-dc,
338
+ var(--_ctm-tab-dn-gy-wt-se-tt-tm-dc, var(--_ctm-dn-gy-wt-se-tt-tm-dc)));
339
+ word-wrap: var(--_ctm-mob-dn-gy-wt-se-wd-wp-dc,
340
+ var(--_ctm-tab-dn-gy-wt-se-wd-wp-dc, var(--_ctm-dn-gy-wt-se-wd-wp-dc)));
341
+ word-break: var(--_ctm-mob-dn-gy-wt-se-wd-bk-dc,
342
+ var(--_ctm-tab-dn-gy-wt-se-wd-bk-dc, var(--_ctm-dn-gy-wt-se-wd-bk-dc)));
343
+
344
+ font-size: var(--_ctm-mob-dn-gy-wt-se-ft-se-dc,
345
+ var(--_ctm-tab-dn-gy-wt-se-ft-se-dc, var(--_ctm-dn-gy-wt-se-ft-se-dc)));
346
+
347
+ font-weight: var(--_ctm-mob-dn-gy-wt-se-ft-wt-dc,
348
+ var(--_ctm-tab-dn-gy-wt-se-ft-wt-dc, var(--_ctm-dn-gy-wt-se-ft-wt-dc)));
349
+
350
+ font-style: var(--_ctm-mob-dn-gy-wt-se-ft-se-ic-dc,
351
+ var(--_ctm-tab-dn-gy-wt-se-ft-se-ic-dc, var(--_ctm-dn-gy-wt-se-ft-se-ic-dc)));
352
+
353
+ text-align: var(--_ctm-mob-dn-gy-wt-se-tt-an-dc,
354
+ var(--_ctm-tab-dn-gy-wt-se-tt-an-dc, var(--_ctm-dn-gy-wt-se-tt-an-dc)));
355
+
356
+ letter-spacing: var(--_ctm-mob-dn-gy-wt-se-lr-sg-dc,
357
+ var(--_ctm-tab-dn-gy-wt-se-lr-sg-dc, var(--_ctm-dn-gy-wt-se-lr-sg-dc)));
358
+
359
+ line-height: var(--_ctm-mob-dn-gy-wt-se-le-ht-dc,
360
+ var(--_ctm-tab-dn-gy-wt-se-le-ht-dc, var(--_ctm-dn-gy-wt-se-le-ht-dc)));
361
+
362
+ text-decoration: var(--_ctm-mob-dn-gy-wt-se-ue-dc,
363
+ var(--_ctm-tab-dn-gy-wt-se-ue-dc, var(--_ctm-dn-gy-wt-se-ue-dc)));
484
364
  }
485
365
 
486
366
  // h3 {
@@ -608,51 +488,25 @@ $defaultValues: (
608
488
  display: grid;
609
489
  grid-template-rows: 100%;
610
490
  // grid-template-columns: 100%;
611
- grid-template-columns: repeat(
612
- var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))),
613
- calc(
614
- 100% /
615
- var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se)))
616
- )
617
- );
491
+ grid-template-columns: repeat(var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))),
492
+ calc(100% / var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se)))));
618
493
 
619
494
  grid-auto-flow: column;
620
495
  gap: var(--_ctm-mob-lt-im-gp, var(--_ctm-tab-lt-im-gp, var(--_ctm-lt-im-gp)));
621
496
 
622
497
  &[data-control-type="Bottom"][data-slider-control="Arrows"] {
623
- height: calc(
624
- 100% - calc(
625
- var(
626
- --_ctm-mob-dn-pn-as-aw-se,
627
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
628
- ) +
629
- 10px
630
- )
631
- );
498
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-as-aw-se,
499
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) + 10px));
632
500
  }
633
501
 
634
502
  &[data-control-type="Bottom"][data-slider-control="Pagination Line"] {
635
- height: calc(
636
- 100% - calc(
637
- var(
638
- --_ctm-mob-dn-pn-le-le-ht,
639
- var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
640
- ) +
641
- 20px
642
- )
643
- );
503
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-le-le-ht,
504
+ var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))) + 20px));
644
505
  }
645
506
 
646
507
  &[data-control-type="Bottom"][data-slider-control="Dots"] {
647
- height: calc(
648
- 100% - calc(
649
- var(
650
- --_ctm-mob-dn-pn-ds-dt-se,
651
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
652
- ) +
653
- 20px
654
- )
655
- );
508
+ height: calc(100% - calc(var(--_ctm-mob-dn-pn-ds-dt-se,
509
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))) + 20px));
656
510
  }
657
511
 
658
512
  .embla__slide {
@@ -665,9 +519,7 @@ $defaultValues: (
665
519
 
666
520
  &:not([data-display-style="Column"]) {
667
521
  .embla__container {
668
- grid-auto-columns: calc(
669
- 100% / var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se)))
670
- );
522
+ grid-auto-columns: calc(100% / var(--_ctm-mob-lt-is-pr-se, var(--_ctm-tab-lt-is-pr-se, var(--_ctm-lt-is-pr-se))));
671
523
  }
672
524
  }
673
525
 
@@ -689,10 +541,8 @@ $defaultValues: (
689
541
 
690
542
  // min-height: var(--_ctm-height);
691
543
 
692
- grid-template-columns: repeat(
693
- var(--_ctm-mob-lt-is-pr-rw, var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))),
694
- 1fr
695
- );
544
+ grid-template-columns: repeat(var(--_ctm-mob-lt-is-pr-rw, var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))),
545
+ 1fr);
696
546
 
697
547
  grid-template-rows: unset;
698
548
 
@@ -712,13 +562,8 @@ $defaultValues: (
712
562
  &[data-display-style="Grid"][data-scroll-direction="Horizontal"] {
713
563
  .embla__viewport {
714
564
  .embla__container {
715
- grid-template-rows: repeat(
716
- var(--_ctm-mob-lt-is-pr-cn, var(--_ctm-tab-lt-is-pr-cn, var(--_ctm-lt-is-pr-cn))),
717
- calc(
718
- 100% /
719
- var(--_ctm-mob-lt-is-pr-cn, var(--_ctm-tab-lt-is-pr-cn, var(--_ctm-lt-is-pr-cn)))
720
- )
721
- );
565
+ grid-template-rows: repeat(var(--_ctm-mob-lt-is-pr-cn, var(--_ctm-tab-lt-is-pr-cn, var(--_ctm-lt-is-pr-cn))),
566
+ calc(100% / var(--_ctm-mob-lt-is-pr-cn, var(--_ctm-tab-lt-is-pr-cn, var(--_ctm-lt-is-pr-cn)))));
722
567
  }
723
568
  }
724
569
  }
@@ -785,10 +630,8 @@ $defaultValues: (
785
630
  overflow: unset;
786
631
 
787
632
  display: block;
788
- column-count: var(
789
- --_ctm-mob-lt-is-pr-rw,
790
- var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw))
791
- );
633
+ column-count: var(--_ctm-mob-lt-is-pr-rw,
634
+ var(--_ctm-tab-lt-is-pr-rw, var(--_ctm-lt-is-pr-rw)));
792
635
  gap: unset;
793
636
  column-gap: var(--_ctm-mob-lt-im-gp, var(--_ctm-tab-lt-im-gp, var(--_ctm-lt-im-gp)));
794
637
 
@@ -798,10 +641,8 @@ $defaultValues: (
798
641
 
799
642
  .embla__slide {
800
643
  // break-inside: avoid;
801
- margin-bottom: var(
802
- --_ctm-mob-lt-im-gp,
803
- var(--_ctm-tab-lt-im-gp, var(--_ctm-lt-im-gp))
804
- );
644
+ margin-bottom: var(--_ctm-mob-lt-im-gp,
645
+ var(--_ctm-tab-lt-im-gp, var(--_ctm-lt-im-gp)));
805
646
 
806
647
  height: unset;
807
648
 
@@ -845,6 +686,7 @@ $defaultValues: (
845
686
  }
846
687
 
847
688
  &[data-control-type="Side"] {
689
+
848
690
  .left-button,
849
691
  .right-button {
850
692
  background-color: transparent;
@@ -852,6 +694,7 @@ $defaultValues: (
852
694
  }
853
695
 
854
696
  &[data-background-shape="Round"] {
697
+
855
698
  .left-button,
856
699
  .right-button {
857
700
  @include BgColorLighter(var(--_ctm-dn-pn-as-bd-cr), 10%);
@@ -866,14 +709,10 @@ $defaultValues: (
866
709
  padding: 10px;
867
710
  border-radius: 50%;
868
711
  border: none;
869
- width: var(
870
- --_ctm-mob-dn-pn-as-aw-se,
871
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
872
- );
873
- height: var(
874
- --_ctm-mob-dn-pn-as-aw-se,
875
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
876
- );
712
+ width: var(--_ctm-mob-dn-pn-as-aw-se,
713
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
714
+ height: var(--_ctm-mob-dn-pn-as-aw-se,
715
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
877
716
 
878
717
  display: flex;
879
718
  align-items: center;
@@ -886,26 +725,14 @@ $defaultValues: (
886
725
  display: flex;
887
726
 
888
727
  svg {
889
- width: calc(
890
- var(
891
- --_ctm-mob-dn-pn-as-aw-se,
892
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
893
- ) *
894
- 0.5
895
- );
896
- height: calc(
897
- var(
898
- --_ctm-mob-dn-pn-as-aw-se,
899
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
900
- ) *
901
- 0.5
902
- );
728
+ width: calc(var(--_ctm-mob-dn-pn-as-aw-se,
729
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
730
+ height: calc(var(--_ctm-mob-dn-pn-as-aw-se,
731
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
903
732
 
904
733
  path {
905
- stroke: var(
906
- --_ctm-mob-dn-pn-as-aw-cr,
907
- var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr))
908
- );
734
+ stroke: var(--_ctm-mob-dn-pn-as-aw-cr,
735
+ var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr)));
909
736
  }
910
737
  }
911
738
  }
@@ -922,14 +749,10 @@ $defaultValues: (
922
749
  .right-button {
923
750
  border-radius: 50%;
924
751
  border: none;
925
- width: var(
926
- --_ctm-mob-dn-pn-as-aw-se,
927
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
928
- );
929
- height: var(
930
- --_ctm-mob-dn-pn-as-aw-se,
931
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
932
- );
752
+ width: var(--_ctm-mob-dn-pn-as-aw-se,
753
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
754
+ height: var(--_ctm-mob-dn-pn-as-aw-se,
755
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se)));
933
756
 
934
757
  display: flex;
935
758
  align-items: center;
@@ -943,26 +766,14 @@ $defaultValues: (
943
766
  display: flex;
944
767
 
945
768
  svg {
946
- width: calc(
947
- var(
948
- --_ctm-mob-dn-pn-as-aw-se,
949
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
950
- ) *
951
- 0.5
952
- );
953
- height: calc(
954
- var(
955
- --_ctm-mob-dn-pn-as-aw-se,
956
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
957
- ) *
958
- 0.5
959
- );
769
+ width: calc(var(--_ctm-mob-dn-pn-as-aw-se,
770
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
771
+ height: calc(var(--_ctm-mob-dn-pn-as-aw-se,
772
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
960
773
 
961
774
  path {
962
- stroke: var(
963
- --_ctm-mob-dn-pn-as-aw-cr,
964
- var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr))
965
- );
775
+ stroke: var(--_ctm-mob-dn-pn-as-aw-cr,
776
+ var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr)));
966
777
  }
967
778
  }
968
779
  }
@@ -980,26 +791,14 @@ $defaultValues: (
980
791
  display: flex;
981
792
 
982
793
  svg {
983
- width: calc(
984
- var(
985
- --_ctm-mob-dn-pn-as-aw-se,
986
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
987
- ) *
988
- 0.5
989
- );
990
- height: calc(
991
- var(
992
- --_ctm-mob-dn-pn-as-aw-se,
993
- var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))
994
- ) *
995
- 0.5
996
- );
794
+ width: calc(var(--_ctm-mob-dn-pn-as-aw-se,
795
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
796
+ height: calc(var(--_ctm-mob-dn-pn-as-aw-se,
797
+ var(--_ctm-tab-dn-pn-as-aw-se, var(--_ctm-dn-pn-as-aw-se))) * 0.5);
997
798
 
998
799
  path {
999
- stroke: var(
1000
- --_ctm-mob-dn-pn-as-aw-cr,
1001
- var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr))
1002
- );
800
+ stroke: var(--_ctm-mob-dn-pn-as-aw-cr,
801
+ var(--_ctm-tab-dn-pn-as-aw-cr, var(--_ctm-dn-pn-as-aw-cr)));
1003
802
  }
1004
803
  }
1005
804
  }
@@ -1027,10 +826,8 @@ $defaultValues: (
1027
826
  height: 100%;
1028
827
  flex-direction: column;
1029
828
  margin-top: 0;
1030
- margin-right: var(
1031
- --_ctm-mob-lt-sr-ad-tl-gp,
1032
- var(--_ctm-tab-lt-sr-ad-tl-gp, var(--_ctm-lt-sr-ad-tl-gp))
1033
- );
829
+ margin-right: var(--_ctm-mob-lt-sr-ad-tl-gp,
830
+ var(--_ctm-tab-lt-sr-ad-tl-gp, var(--_ctm-lt-sr-ad-tl-gp)));
1034
831
 
1035
832
  & .embla__thumbs__container {
1036
833
  flex-direction: column;
@@ -1059,10 +856,8 @@ $defaultValues: (
1059
856
  height: 100%;
1060
857
  flex-direction: column;
1061
858
  margin-top: 0;
1062
- margin-left: var(
1063
- --_ctm-mob-lt-sr-ad-tl-gp,
1064
- var(--_ctm-tab-lt-sr-ad-tl-gp, var(--_ctm-lt-sr-ad-tl-gp))
1065
- );
859
+ margin-left: var(--_ctm-mob-lt-sr-ad-tl-gp,
860
+ var(--_ctm-tab-lt-sr-ad-tl-gp, var(--_ctm-lt-sr-ad-tl-gp)));
1066
861
 
1067
862
  & .embla__thumbs__container {
1068
863
  flex-direction: column;
@@ -1109,10 +904,8 @@ $defaultValues: (
1109
904
  -webkit-tap-highlight-color: rgba(var(--text-high-contrast-rgb-value), 0.5);
1110
905
  -webkit-appearance: none;
1111
906
  appearance: none;
1112
- background-color: var(
1113
- --_ctm-mob-dn-pn-ds-or-dt-cr,
1114
- var(--_ctm-tab-dn-pn-ds-or-dt-cr, var(--_ctm-dn-pn-ds-or-dt-cr))
1115
- );
907
+ background-color: var(--_ctm-mob-dn-pn-ds-or-dt-cr,
908
+ var(--_ctm-tab-dn-pn-ds-or-dt-cr, var(--_ctm-dn-pn-ds-or-dt-cr)));
1116
909
 
1117
910
  touch-action: manipulation;
1118
911
  display: inline-flex;
@@ -1123,14 +916,10 @@ $defaultValues: (
1123
916
  margin: 0;
1124
917
  // width: 0.6rem;
1125
918
  // height: 0.6rem;
1126
- width: var(
1127
- --_ctm-mob-dn-pn-ds-dt-se,
1128
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
1129
- );
1130
- height: var(
1131
- --_ctm-mob-dn-pn-ds-dt-se,
1132
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
1133
- );
919
+ width: var(--_ctm-mob-dn-pn-ds-dt-se,
920
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se)));
921
+ height: var(--_ctm-mob-dn-pn-ds-dt-se,
922
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se)));
1134
923
 
1135
924
  display: flex;
1136
925
  align-items: center;
@@ -1140,14 +929,10 @@ $defaultValues: (
1140
929
 
1141
930
  .embla__dot:after {
1142
931
  // box-shadow: inset 0 0 0 0.2rem var(--detail-medium-contrast);
1143
- width: var(
1144
- --_ctm-mob-dn-pn-ds-dt-se,
1145
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
1146
- );
1147
- height: var(
1148
- --_ctm-mob-dn-pn-ds-dt-se,
1149
- var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se))
1150
- );
932
+ width: var(--_ctm-mob-dn-pn-ds-dt-se,
933
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se)));
934
+ height: var(--_ctm-mob-dn-pn-ds-dt-se,
935
+ var(--_ctm-tab-dn-pn-ds-dt-se, var(--_ctm-dn-pn-ds-dt-se)));
1151
936
 
1152
937
  border-radius: 50%;
1153
938
  display: flex;
@@ -1157,28 +942,20 @@ $defaultValues: (
1157
942
 
1158
943
  .embla__dot--selected:after {
1159
944
  box-shadow: inset 0 0 0 1px var(--text-body);
1160
- background-color: var(
1161
- --_ctm-mob-dn-pn-ds-ct-dt-cr,
1162
- var(--_ctm-tab-dn-pn-ds-ct-dt-cr, var(--_ctm-dn-pn-ds-ct-dt-cr))
1163
- );
945
+ background-color: var(--_ctm-mob-dn-pn-ds-ct-dt-cr,
946
+ var(--_ctm-tab-dn-pn-ds-ct-dt-cr, var(--_ctm-dn-pn-ds-ct-dt-cr)));
1164
947
  }
1165
948
 
1166
949
  &[data-slider-control="Pagination Line"] {
1167
950
  .embla__dot {
1168
- width: var(
1169
- --_ctm-mob-dn-pn-le-le-wh,
1170
- var(--_ctm-tab-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh))
1171
- );
951
+ width: var(--_ctm-mob-dn-pn-le-le-wh,
952
+ var(--_ctm-tab-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh)));
1172
953
 
1173
- height: var(
1174
- --_ctm-mob-dn-pn-le-le-ht,
1175
- var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
1176
- );
954
+ height: var(--_ctm-mob-dn-pn-le-le-ht,
955
+ var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht)));
1177
956
 
1178
- background-color: var(
1179
- --_ctm-mob-dn-pn-le-or-le-cr,
1180
- var(--_ctm-tab-dn-pn-le-or-le-cr, var(--_ctm-dn-pn-le-or-le-cr))
1181
- );
957
+ background-color: var(--_ctm-mob-dn-pn-le-or-le-cr,
958
+ var(--_ctm-tab-dn-pn-le-or-le-cr, var(--_ctm-dn-pn-le-or-le-cr)));
1182
959
 
1183
960
  border-radius: 6px;
1184
961
  }
@@ -1186,21 +963,15 @@ $defaultValues: (
1186
963
  .embla__dot--selected:after {
1187
964
  box-shadow: inset 0 0 0 1px var(--text-body);
1188
965
  border-radius: 6px;
1189
- width: var(
1190
- --_ctm-mob-dn-pn-le-le-wh,
1191
- var(--_ctm-tab-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh))
1192
- );
966
+ width: var(--_ctm-mob-dn-pn-le-le-wh,
967
+ var(--_ctm-tab-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh)));
1193
968
 
1194
- height: var(
1195
- --_ctm-mob-dn-pn-le-le-ht,
1196
- var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht))
1197
- );
969
+ height: var(--_ctm-mob-dn-pn-le-le-ht,
970
+ var(--_ctm-tab-dn-pn-le-le-ht, var(--_ctm-dn-pn-le-le-ht)));
1198
971
 
1199
972
  // background-color: #fff;
1200
- background-color: var(
1201
- --_ctm-mob-dn-pn-le-ct-le-cr,
1202
- var(--_ctm-tab-dn-pn-le-ct-le-cr, var(--_ctm-dn-pn-le-ct-le-cr))
1203
- );
973
+ background-color: var(--_ctm-mob-dn-pn-le-ct-le-cr,
974
+ var(--_ctm-tab-dn-pn-le-ct-le-cr, var(--_ctm-dn-pn-le-ct-le-cr)));
1204
975
  }
1205
976
  }
1206
977
  }
@@ -1208,10 +979,8 @@ $defaultValues: (
1208
979
  .embla__thumbs {
1209
980
  width: 100%;
1210
981
  height: var(--_ctm-mob-lt-tl-ht, var(--_ctm-tab-lt-tl-ht, var(--_ctm-lt-tl-ht)));
1211
- margin-top: var(
1212
- --_ctm-mob-lt-sr-ad-tl-gp,
1213
- var(--_ctm-tab-lt-sr-ad-tl-gp, var(--_ctm-lt-sr-ad-tl-gp))
1214
- );
982
+ margin-top: var(--_ctm-mob-lt-sr-ad-tl-gp,
983
+ var(--_ctm-tab-lt-sr-ad-tl-gp, var(--_ctm-lt-sr-ad-tl-gp)));
1215
984
 
1216
985
  position: relative;
1217
986
  display: flex;
@@ -1234,39 +1003,23 @@ $defaultValues: (
1234
1003
  background-color: transparent;
1235
1004
  z-index: 1;
1236
1005
 
1237
- width: var(
1238
- --_ctm-mob-dn-tl-as-aw-se,
1239
- var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px))
1240
- );
1241
- height: var(
1242
- --_ctm-mob-dn-tl-as-aw-se,
1243
- var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px))
1244
- );
1006
+ width: var(--_ctm-mob-dn-tl-as-aw-se,
1007
+ var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px)));
1008
+ height: var(--_ctm-mob-dn-tl-as-aw-se,
1009
+ var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px)));
1245
1010
 
1246
1011
  span {
1247
1012
  display: flex;
1248
1013
 
1249
1014
  svg {
1250
- width: calc(
1251
- var(
1252
- --_ctm-mob-dn-tl-as-aw-se,
1253
- var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px))
1254
- ) *
1255
- 0.5
1256
- );
1257
- height: calc(
1258
- var(
1259
- --_ctm-mob-dn-tl-as-aw-se,
1260
- var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px))
1261
- ) *
1262
- 0.5
1263
- );
1015
+ width: calc(var(--_ctm-mob-dn-tl-as-aw-se,
1016
+ var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px))) * 0.5);
1017
+ height: calc(var(--_ctm-mob-dn-tl-as-aw-se,
1018
+ var(--_ctm-tab-dn-tl-as-aw-se, var(--_ctm-dn-tl-as-aw-se, 30px))) * 0.5);
1264
1019
 
1265
1020
  path {
1266
- stroke: var(
1267
- --_ctm-mob-dn-tl-as-aw-cr,
1268
- var(--_ctm-tab-dn-tl-as-aw-cr, var(--_ctm-dn-tl-as-aw-cr))
1269
- );
1021
+ stroke: var(--_ctm-mob-dn-tl-as-aw-cr,
1022
+ var(--_ctm-tab-dn-tl-as-aw-cr, var(--_ctm-dn-tl-as-aw-cr)));
1270
1023
  }
1271
1024
  }
1272
1025
  }
@@ -1278,6 +1031,7 @@ $defaultValues: (
1278
1031
  }
1279
1032
 
1280
1033
  &[data-background-shape="Round"] {
1034
+
1281
1035
  .thumb-prev-button,
1282
1036
  .thumb-next-button {
1283
1037
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
@@ -1323,112 +1077,66 @@ $defaultValues: (
1323
1077
 
1324
1078
  // thumbnailStyle - hoverState
1325
1079
  &:hover {
1326
- --_sf-hr-bd-cr: var(
1327
- --_ctm-mob-dn-tl-se-hr-se-bd-cr,
1328
- var(--_ctm-tab-dn-tl-se-hr-se-bd-cr, var(--_ctm-dn-tl-se-hr-se-bd-cr))
1329
- );
1330
- --_sf-hr-br-cr: var(
1331
- --_ctm-mob-dn-tl-se-hr-se-br-cr,
1332
- var(--_ctm-tab-dn-tl-se-hr-se-br-cr, var(--_ctm-dn-tl-se-hr-se-br-cr))
1333
- );
1334
- --_sf-hr-br-se: var(
1335
- --_ctm-mob-dn-tl-se-hr-se-br-se,
1336
- var(--_ctm-tab-dn-tl-se-hr-se-br-se, var(--_ctm-dn-tl-se-hr-se-br-se))
1337
- );
1338
- --_sf-hr-br-wh: var(
1339
- --_ctm-mob-dn-tl-se-hr-se-br-wh,
1340
- var(--_ctm-tab-dn-tl-se-hr-se-br-wh, var(--_ctm-dn-tl-se-hr-se-br-wh))
1341
- );
1342
- --_sf-hr-br-rs: var(
1343
- --_ctm-mob-dn-tl-se-hr-se-br-rs,
1344
- var(--_ctm-tab-dn-tl-se-hr-se-br-rs, var(--_ctm-dn-tl-se-hr-se-br-rs))
1345
- );
1346
- --_sf-hr-sw-ae: var(
1347
- --_ctm-mob-dn-tl-se-hr-se-sw-ae,
1348
- var(--_ctm-tab-dn-tl-se-hr-se-sw-ae, var(--_ctm-dn-tl-se-hr-se-sw-ae))
1349
- );
1350
- --_sf-hr-sw-br: var(
1351
- --_ctm-mob-dn-tl-se-hr-se-sw-br,
1352
- var(--_ctm-tab-dn-tl-se-hr-se-sw-br, var(--_ctm-dn-tl-se-hr-se-sw-br))
1353
- );
1354
- --_sf-hr-sw-sd: var(
1355
- --_ctm-mob-dn-tl-se-hr-se-sw-sd,
1356
- var(--_ctm-tab-dn-tl-se-hr-se-sw-sd, var(--_ctm-dn-tl-se-hr-se-sw-sd))
1357
- );
1358
- --_sf-hr-sw-cr: var(
1359
- --_ctm-mob-dn-tl-se-hr-se-sw-cr,
1360
- var(--_ctm-tab-dn-tl-se-hr-se-sw-cr, var(--_ctm-dn-tl-se-hr-se-sw-cr))
1361
- );
1080
+ --_sf-hr-bd-cr: var(--_ctm-mob-dn-tl-se-hr-se-bd-cr,
1081
+ var(--_ctm-tab-dn-tl-se-hr-se-bd-cr, var(--_ctm-dn-tl-se-hr-se-bd-cr)));
1082
+ --_sf-hr-br-cr: var(--_ctm-mob-dn-tl-se-hr-se-br-cr,
1083
+ var(--_ctm-tab-dn-tl-se-hr-se-br-cr, var(--_ctm-dn-tl-se-hr-se-br-cr)));
1084
+ --_sf-hr-br-se: var(--_ctm-mob-dn-tl-se-hr-se-br-se,
1085
+ var(--_ctm-tab-dn-tl-se-hr-se-br-se, var(--_ctm-dn-tl-se-hr-se-br-se)));
1086
+ --_sf-hr-br-wh: var(--_ctm-mob-dn-tl-se-hr-se-br-wh,
1087
+ var(--_ctm-tab-dn-tl-se-hr-se-br-wh, var(--_ctm-dn-tl-se-hr-se-br-wh)));
1088
+ --_sf-hr-br-rs: var(--_ctm-mob-dn-tl-se-hr-se-br-rs,
1089
+ var(--_ctm-tab-dn-tl-se-hr-se-br-rs, var(--_ctm-dn-tl-se-hr-se-br-rs)));
1090
+ --_sf-hr-sw-ae: var(--_ctm-mob-dn-tl-se-hr-se-sw-ae,
1091
+ var(--_ctm-tab-dn-tl-se-hr-se-sw-ae, var(--_ctm-dn-tl-se-hr-se-sw-ae)));
1092
+ --_sf-hr-sw-br: var(--_ctm-mob-dn-tl-se-hr-se-sw-br,
1093
+ var(--_ctm-tab-dn-tl-se-hr-se-sw-br, var(--_ctm-dn-tl-se-hr-se-sw-br)));
1094
+ --_sf-hr-sw-sd: var(--_ctm-mob-dn-tl-se-hr-se-sw-sd,
1095
+ var(--_ctm-tab-dn-tl-se-hr-se-sw-sd, var(--_ctm-dn-tl-se-hr-se-sw-sd)));
1096
+ --_sf-hr-sw-cr: var(--_ctm-mob-dn-tl-se-hr-se-sw-cr,
1097
+ var(--_ctm-tab-dn-tl-se-hr-se-sw-cr, var(--_ctm-dn-tl-se-hr-se-sw-cr)));
1362
1098
  }
1363
1099
 
1364
1100
  // thumbnailStyle - defaultState
1365
- background-color: var(
1366
- --_sf-hr-bd-cr,
1367
- prepareMediaVariable(--_ctm-dn-tl-se-dt-se-bd-cr)
1368
- );
1101
+ background-color: var(--_sf-hr-bd-cr,
1102
+ prepareMediaVariable(--_ctm-dn-tl-se-dt-se-bd-cr));
1369
1103
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-cr));
1370
1104
  border-style: var(--_sf-hr-br-se, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-se));
1371
1105
  border-width: var(--_sf-hr-br-wh, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-wh));
1372
1106
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-rs));
1373
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-ae))
1374
- var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-br))
1375
- var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-sd))
1376
- var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-cr));
1107
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-cr));
1377
1108
 
1378
1109
  // thumbnailStyle - selectedState
1379
1110
  &[data-selected="true"] {
1380
- --_sf-sd-bd-cr: var(
1381
- --_ctm-mob-dn-tl-se-sd-se-bd-cr,
1382
- var(--_ctm-tab-dn-tl-se-sd-se-bd-cr, var(--_ctm-dn-tl-se-sd-se-bd-cr))
1383
- );
1384
- --_sf-sd-br-cr: var(
1385
- --_ctm-mob-dn-tl-se-sd-se-br-cr,
1386
- var(--_ctm-tab-dn-tl-se-sd-se-br-cr, var(--_ctm-dn-tl-se-sd-se-br-cr))
1387
- );
1388
- --_sf-sd-br-se: var(
1389
- --_ctm-mob-dn-tl-se-sd-se-br-se,
1390
- var(--_ctm-tab-dn-tl-se-sd-se-br-se, var(--_ctm-dn-tl-se-sd-se-br-se))
1391
- );
1392
- --_sf-sd-br-wh: var(
1393
- --_ctm-mob-dn-tl-se-sd-se-br-wh,
1394
- var(--_ctm-tab-dn-tl-se-sd-se-br-wh, var(--_ctm-dn-tl-se-sd-se-br-wh))
1395
- );
1396
- --_sf-sd-br-rs: var(
1397
- --_ctm-mob-dn-tl-se-sd-se-br-rs,
1398
- var(--_ctm-tab-dn-tl-se-sd-se-br-rs, var(--_ctm-dn-tl-se-sd-se-br-rs))
1399
- );
1400
- --_sf-sd-sw-ae: var(
1401
- --_ctm-mob-dn-tl-se-sd-se-sw-ae,
1402
- var(--_ctm-tab-dn-tl-se-sd-se-sw-ae, var(--_ctm-dn-tl-se-sd-se-sw-ae))
1403
- );
1404
- --_sf-sd-sw-br: var(
1405
- --_ctm-mob-dn-tl-se-sd-se-sw-br,
1406
- var(--_ctm-tab-dn-tl-se-sd-se-sw-br, var(--_ctm-dn-tl-se-sd-se-sw-br))
1407
- );
1408
- --_sf-sd-sw-sd: var(
1409
- --_ctm-mob-dn-tl-se-sd-se-sw-sd,
1410
- var(--_ctm-tab-dn-tl-se-sd-se-sw-sd, var(--_ctm-dn-tl-se-sd-se-sw-sd))
1411
- );
1412
- --_sf-sd-sw-cr: var(
1413
- --_ctm-mob-dn-tl-se-sd-se-sw-cr,
1414
- var(--_ctm-tab-dn-tl-se-sd-se-sw-cr, var(--_ctm-dn-tl-se-sd-se-sw-cr))
1415
- );
1416
-
1417
- background-color: var(
1418
- --_sf-sd-bd-cr,
1419
- prepareMediaVariable(--_ctm-dn-tl-se-dt-se-bd-cr)
1420
- );
1111
+ --_sf-sd-bd-cr: var(--_ctm-mob-dn-tl-se-sd-se-bd-cr,
1112
+ var(--_ctm-tab-dn-tl-se-sd-se-bd-cr, var(--_ctm-dn-tl-se-sd-se-bd-cr)));
1113
+ --_sf-sd-br-cr: var(--_ctm-mob-dn-tl-se-sd-se-br-cr,
1114
+ var(--_ctm-tab-dn-tl-se-sd-se-br-cr, var(--_ctm-dn-tl-se-sd-se-br-cr)));
1115
+ --_sf-sd-br-se: var(--_ctm-mob-dn-tl-se-sd-se-br-se,
1116
+ var(--_ctm-tab-dn-tl-se-sd-se-br-se, var(--_ctm-dn-tl-se-sd-se-br-se)));
1117
+ --_sf-sd-br-wh: var(--_ctm-mob-dn-tl-se-sd-se-br-wh,
1118
+ var(--_ctm-tab-dn-tl-se-sd-se-br-wh, var(--_ctm-dn-tl-se-sd-se-br-wh)));
1119
+ --_sf-sd-br-rs: var(--_ctm-mob-dn-tl-se-sd-se-br-rs,
1120
+ var(--_ctm-tab-dn-tl-se-sd-se-br-rs, var(--_ctm-dn-tl-se-sd-se-br-rs)));
1121
+ --_sf-sd-sw-ae: var(--_ctm-mob-dn-tl-se-sd-se-sw-ae,
1122
+ var(--_ctm-tab-dn-tl-se-sd-se-sw-ae, var(--_ctm-dn-tl-se-sd-se-sw-ae)));
1123
+ --_sf-sd-sw-br: var(--_ctm-mob-dn-tl-se-sd-se-sw-br,
1124
+ var(--_ctm-tab-dn-tl-se-sd-se-sw-br, var(--_ctm-dn-tl-se-sd-se-sw-br)));
1125
+ --_sf-sd-sw-sd: var(--_ctm-mob-dn-tl-se-sd-se-sw-sd,
1126
+ var(--_ctm-tab-dn-tl-se-sd-se-sw-sd, var(--_ctm-dn-tl-se-sd-se-sw-sd)));
1127
+ --_sf-sd-sw-cr: var(--_ctm-mob-dn-tl-se-sd-se-sw-cr,
1128
+ var(--_ctm-tab-dn-tl-se-sd-se-sw-cr, var(--_ctm-dn-tl-se-sd-se-sw-cr)));
1129
+
1130
+ background-color: var(--_sf-sd-bd-cr,
1131
+ prepareMediaVariable(--_ctm-dn-tl-se-dt-se-bd-cr));
1421
1132
  border-color: var(--_sf-sd-br-cr, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-cr));
1422
1133
  border-style: var(--_sf-sd-br-se, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-se));
1423
1134
  border-width: var(--_sf-sd-br-wh, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-wh));
1424
1135
  border-radius: var(--_sf-sd-br-rs, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-br-rs));
1425
- box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-ae))
1426
- var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-br))
1427
- var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-sd))
1428
- var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-cr));
1136
+ box-shadow: var(--_sf-sd-sw-ae, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-ae)) var(--_sf-sd-sw-br, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-br)) var(--_sf-sd-sw-sd, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-sd)) var(--_sf-sd-sw-cr, prepareMediaVariable(--_ctm-dn-tl-se-dt-se-sw-cr));
1429
1137
  }
1430
1138
 
1431
- & > div {
1139
+ &>div {
1432
1140
  height: 100%;
1433
1141
  }
1434
1142
 
@@ -1468,10 +1176,8 @@ $defaultValues: (
1468
1176
 
1469
1177
  // flex-direction: column;
1470
1178
 
1471
- background-color: var(
1472
- --_ctm-mob-dn-im-se-bd-cr,
1473
- var(--_ctm-tab-dn-im-se-bd-cr, var(--_ctm-dn-im-se-bd-cr))
1474
- );
1179
+ background-color: var(--_ctm-mob-dn-im-se-bd-cr,
1180
+ var(--_ctm-tab-dn-im-se-bd-cr, var(--_ctm-dn-im-se-bd-cr)));
1475
1181
 
1476
1182
  // Item Style > Border / Shadow toggles.
1477
1183
  &[data-show-border="false"] {
@@ -1482,191 +1188,101 @@ $defaultValues: (
1482
1188
  --_show-im-shadow: none;
1483
1189
  }
1484
1190
 
1485
- border-color: var(
1486
- --_show-im-border,
1487
- var(--_ctm-mob-dn-im-se-br-cr, var(--_ctm-tab-dn-im-se-br-cr, var(--_ctm-dn-im-se-br-cr)))
1488
- );
1489
- border-style: var(
1490
- --_show-im-border,
1491
- var(--_ctm-mob-dn-im-se-br-se, var(--_ctm-tab-dn-im-se-br-se, var(--_ctm-dn-im-se-br-se)))
1492
- );
1493
- border-width: var(
1494
- --_show-im-border,
1495
- var(--_ctm-mob-dn-im-se-br-wh, var(--_ctm-tab-dn-im-se-br-wh, var(--_ctm-dn-im-se-br-wh)))
1496
- );
1497
- border-radius: var(
1498
- --_ctm-mob-dn-im-se-br-rs,
1499
- var(--_ctm-tab-dn-im-se-br-rs, var(--_ctm-dn-im-se-br-rs))
1500
- );
1501
-
1502
- box-shadow: var(
1503
- --_show-im-shadow,
1504
- var(--_ctm-mob-dn-im-se-sw-ae, var(--_ctm-tab-dn-im-se-sw-ae, var(--_ctm-dn-im-se-sw-ae)))
1505
- var(--_ctm-mob-dn-im-se-sw-br, var(--_ctm-tab-dn-im-se-sw-br, var(--_ctm-dn-im-se-sw-br)))
1506
- var(--_ctm-mob-dn-im-se-sw-sd, var(--_ctm-tab-dn-im-se-sw-sd, var(--_ctm-dn-im-se-sw-sd)))
1507
- var(--_ctm-mob-dn-im-se-sw-cr, var(--_ctm-tab-dn-im-se-sw-cr, var(--_ctm-dn-im-se-sw-cr)))
1508
- );
1509
-
1510
- gap: var(
1511
- --_ctm-mob-dn-im-lt-gy-tt-ad-im-sg,
1512
- var(--_ctm-tab-dn-im-lt-gy-tt-ad-im-sg, var(--_ctm-dn-im-lt-gy-tt-ad-im-sg))
1513
- );
1191
+ border-color: var(--_show-im-border,
1192
+ var(--_ctm-mob-dn-im-se-br-cr, var(--_ctm-tab-dn-im-se-br-cr, var(--_ctm-dn-im-se-br-cr))));
1193
+ border-style: var(--_show-im-border,
1194
+ var(--_ctm-mob-dn-im-se-br-se, var(--_ctm-tab-dn-im-se-br-se, var(--_ctm-dn-im-se-br-se))));
1195
+ border-width: var(--_show-im-border,
1196
+ var(--_ctm-mob-dn-im-se-br-wh, var(--_ctm-tab-dn-im-se-br-wh, var(--_ctm-dn-im-se-br-wh))));
1197
+ border-radius: var(--_ctm-mob-dn-im-se-br-rs,
1198
+ var(--_ctm-tab-dn-im-se-br-rs, var(--_ctm-dn-im-se-br-rs)));
1199
+
1200
+ box-shadow: var(--_show-im-shadow,
1201
+ var(--_ctm-mob-dn-im-se-sw-ae, var(--_ctm-tab-dn-im-se-sw-ae, var(--_ctm-dn-im-se-sw-ae))) var(--_ctm-mob-dn-im-se-sw-br, var(--_ctm-tab-dn-im-se-sw-br, var(--_ctm-dn-im-se-sw-br))) var(--_ctm-mob-dn-im-se-sw-sd, var(--_ctm-tab-dn-im-se-sw-sd, var(--_ctm-dn-im-se-sw-sd))) var(--_ctm-mob-dn-im-se-sw-cr, var(--_ctm-tab-dn-im-se-sw-cr, var(--_ctm-dn-im-se-sw-cr))));
1202
+
1203
+ gap: var(--_ctm-mob-dn-im-lt-gy-tt-ad-im-sg,
1204
+ var(--_ctm-tab-dn-im-lt-gy-tt-ad-im-sg, var(--_ctm-dn-im-lt-gy-tt-ad-im-sg)));
1514
1205
  overflow: hidden;
1515
1206
 
1516
1207
  .gallery-header {
1517
1208
  display: flex;
1518
1209
  flex-direction: column;
1519
- gap: var(
1520
- --_ctm-mob-dn-im-tt-cr-lt-te-ad-dn-sg,
1521
- var(--_ctm-tab-dn-im-tt-cr-lt-te-ad-dn-sg, var(--_ctm-dn-im-tt-cr-lt-te-ad-dn-sg))
1522
- );
1523
- padding-block: var(
1524
- --_ctm-mob-dn-im-tt-cr-lt-tt-vl-pg,
1525
- var(--_ctm-tab-dn-im-tt-cr-lt-tt-vl-pg, var(--_ctm-dn-im-tt-cr-lt-tt-vl-pg))
1526
- );
1527
- padding-inline: var(
1528
- --_ctm-mob-dn-im-tt-cr-lt-tt-hl-pg,
1529
- var(--_ctm-tab-dn-im-tt-cr-lt-tt-hl-pg, var(--_ctm-dn-im-tt-cr-lt-tt-hl-pg))
1530
- );
1531
- background-color: var(
1532
- --_ctm-mob-dn-im-tt-cr-dn-bd-cr,
1533
- var(--_ctm-tab-dn-im-tt-cr-dn-bd-cr, var(--_ctm-dn-im-tt-cr-dn-bd-cr))
1534
- );
1210
+ gap: var(--_ctm-mob-dn-im-tt-cr-lt-te-ad-dn-sg,
1211
+ var(--_ctm-tab-dn-im-tt-cr-lt-te-ad-dn-sg, var(--_ctm-dn-im-tt-cr-lt-te-ad-dn-sg)));
1212
+ padding-block: var(--_ctm-mob-dn-im-tt-cr-lt-tt-vl-pg,
1213
+ var(--_ctm-tab-dn-im-tt-cr-lt-tt-vl-pg, var(--_ctm-dn-im-tt-cr-lt-tt-vl-pg)));
1214
+ padding-inline: var(--_ctm-mob-dn-im-tt-cr-lt-tt-hl-pg,
1215
+ var(--_ctm-tab-dn-im-tt-cr-lt-tt-hl-pg, var(--_ctm-dn-im-tt-cr-lt-tt-hl-pg)));
1216
+ background-color: var(--_ctm-mob-dn-im-tt-cr-dn-bd-cr,
1217
+ var(--_ctm-tab-dn-im-tt-cr-dn-bd-cr, var(--_ctm-dn-im-tt-cr-dn-bd-cr)));
1535
1218
  width: 100%;
1536
- border-color: var(
1537
- --_ctm-mob-dn-im-tt-cr-dn-br-cr,
1538
- var(--_ctm-tab-dn-im-tt-cr-dn-br-cr, var(--_ctm-dn-im-tt-cr-dn-br-cr))
1539
- );
1540
- border-style: var(
1541
- --_ctm-mob-dn-im-tt-cr-dn-br-se,
1542
- var(--_ctm-tab-dn-im-tt-cr-dn-br-se, var(--_ctm-dn-im-tt-cr-dn-br-se))
1543
- );
1544
- border-width: var(
1545
- --_ctm-mob-dn-im-tt-cr-dn-br-wh,
1546
- var(--_ctm-tab-dn-im-tt-cr-dn-br-wh, var(--_ctm-dn-im-tt-cr-dn-br-wh))
1547
- );
1548
- border-radius: var(
1549
- --_ctm-mob-dn-im-tt-cr-dn-br-rs,
1550
- var(--_ctm-tab-dn-im-tt-cr-dn-br-rs, var(--_ctm-dn-im-tt-cr-dn-br-rs))
1551
- );
1552
-
1553
- box-shadow: var(
1554
- --_show-shadow,
1555
- var(
1556
- --_ctm-mob-dn-im-tt-cr-dn-sw-ae,
1557
- var(--_ctm-tab-dn-im-tt-cr-dn-sw-ae, var(--_ctm-dn-im-tt-cr-dn-sw-ae))
1558
- )
1559
- var(
1560
- --_ctm-mob-dn-im-tt-cr-dn-sw-br,
1561
- var(--_ctm-tab-dn-im-tt-cr-dn-sw-br, var(--_ctm-dn-im-tt-cr-dn-sw-br))
1562
- )
1563
- var(
1564
- --_ctm-mob-dn-im-tt-cr-dn-sw-sd,
1565
- var(--_ctm-tab-dn-im-tt-cr-dn-sw-sd, var(--_ctm-dn-im-tt-cr-dn-sw-sd))
1566
- )
1567
- var(
1568
- --_ctm-mob-dn-im-tt-cr-dn-sw-cr,
1569
- var(--_ctm-tab-dn-im-tt-cr-dn-sw-cr, var(--_ctm-dn-im-tt-cr-dn-sw-cr))
1570
- )
1571
- );
1219
+ border-color: var(--_ctm-mob-dn-im-tt-cr-dn-br-cr,
1220
+ var(--_ctm-tab-dn-im-tt-cr-dn-br-cr, var(--_ctm-dn-im-tt-cr-dn-br-cr)));
1221
+ border-style: var(--_ctm-mob-dn-im-tt-cr-dn-br-se,
1222
+ var(--_ctm-tab-dn-im-tt-cr-dn-br-se, var(--_ctm-dn-im-tt-cr-dn-br-se)));
1223
+ border-width: var(--_ctm-mob-dn-im-tt-cr-dn-br-wh,
1224
+ var(--_ctm-tab-dn-im-tt-cr-dn-br-wh, var(--_ctm-dn-im-tt-cr-dn-br-wh)));
1225
+ border-radius: var(--_ctm-mob-dn-im-tt-cr-dn-br-rs,
1226
+ var(--_ctm-tab-dn-im-tt-cr-dn-br-rs, var(--_ctm-dn-im-tt-cr-dn-br-rs)));
1227
+
1228
+ box-shadow: var(--_show-shadow,
1229
+ var(--_ctm-mob-dn-im-tt-cr-dn-sw-ae,
1230
+ var(--_ctm-tab-dn-im-tt-cr-dn-sw-ae, var(--_ctm-dn-im-tt-cr-dn-sw-ae))) var(--_ctm-mob-dn-im-tt-cr-dn-sw-br,
1231
+ var(--_ctm-tab-dn-im-tt-cr-dn-sw-br, var(--_ctm-dn-im-tt-cr-dn-sw-br))) var(--_ctm-mob-dn-im-tt-cr-dn-sw-sd,
1232
+ var(--_ctm-tab-dn-im-tt-cr-dn-sw-sd, var(--_ctm-dn-im-tt-cr-dn-sw-sd))) var(--_ctm-mob-dn-im-tt-cr-dn-sw-cr,
1233
+ var(--_ctm-tab-dn-im-tt-cr-dn-sw-cr, var(--_ctm-dn-im-tt-cr-dn-sw-cr))));
1572
1234
 
1573
1235
  & h3 {
1574
1236
  color: var(--_ctm-mob-dn-im-se-cr, var(--_ctm-tab-dn-im-se-cr, var(--_ctm-dn-im-se-cr)));
1575
- font-family: var(
1576
- --_ctm-mob-dn-im-se-ft-fy,
1577
- var(--_ctm-tab-dn-im-se-ft-fy, var(--_ctm-dn-im-se-ft-fy))
1578
- );
1579
- text-transform: var(
1580
- --_ctm-mob-dn-im-se-tt-tm,
1581
- var(--_ctm-tab-dn-im-se-tt-tm, var(--_ctm-dn-im-se-tt-tm))
1582
- );
1583
- word-wrap: var(
1584
- --_ctm-mob-dn-im-se-wd-wp,
1585
- var(--_ctm-tab-dn-im-se-wd-wp, var(--_ctm-dn-im-se-wd-wp))
1586
- );
1587
- word-break: var(
1588
- --_ctm-mob-dn-im-se-wd-bk,
1589
- var(--_ctm-tab-dn-im-se-wd-bk, var(--_ctm-dn-im-se-wd-bk))
1590
- );
1591
- font-size: var(
1592
- --_ctm-mob-dn-im-se-ft-se,
1593
- var(--_ctm-tab-dn-im-se-ft-se, var(--_ctm-dn-im-se-ft-se))
1594
- );
1595
- font-weight: var(
1596
- --_ctm-mob-dn-im-se-ft-wt,
1597
- var(--_ctm-tab-dn-im-se-ft-wt, var(--_ctm-dn-im-se-ft-wt))
1598
- );
1599
- font-style: var(
1600
- --_ctm-mob-dn-im-se-ft-se-ic,
1601
- var(--_ctm-tab-dn-im-se-ft-se-ic, var(--_ctm-dn-im-se-ft-se-ic))
1602
- );
1603
- text-align: var(
1604
- --_ctm-mob-dn-im-se-tt-an,
1605
- var(--_ctm-tab-dn-im-se-tt-an, var(--_ctm-dn-im-se-tt-an))
1606
- );
1607
- letter-spacing: var(
1608
- --_ctm-mob-dn-im-se-lr-sg,
1609
- var(--_ctm-tab-dn-im-se-lr-sg, var(--_ctm-dn-im-se-lr-sg))
1610
- );
1611
- line-height: var(
1612
- --_ctm-mob-dn-im-se-le-ht,
1613
- var(--_ctm-tab-dn-im-se-le-ht, var(--_ctm-dn-im-se-le-ht))
1614
- );
1615
- text-decoration: var(
1616
- --_ctm-mob-dn-im-se-ue,
1617
- var(--_ctm-tab-dn-im-se-ue, var(--_ctm-dn-im-se-ue))
1618
- );
1237
+ font-family: var(--_ctm-mob-dn-im-se-ft-fy,
1238
+ var(--_ctm-tab-dn-im-se-ft-fy, var(--_ctm-dn-im-se-ft-fy)));
1239
+ text-transform: var(--_ctm-mob-dn-im-se-tt-tm,
1240
+ var(--_ctm-tab-dn-im-se-tt-tm, var(--_ctm-dn-im-se-tt-tm)));
1241
+ word-wrap: var(--_ctm-mob-dn-im-se-wd-wp,
1242
+ var(--_ctm-tab-dn-im-se-wd-wp, var(--_ctm-dn-im-se-wd-wp)));
1243
+ word-break: var(--_ctm-mob-dn-im-se-wd-bk,
1244
+ var(--_ctm-tab-dn-im-se-wd-bk, var(--_ctm-dn-im-se-wd-bk)));
1245
+ font-size: var(--_ctm-mob-dn-im-se-ft-se,
1246
+ var(--_ctm-tab-dn-im-se-ft-se, var(--_ctm-dn-im-se-ft-se)));
1247
+ font-weight: var(--_ctm-mob-dn-im-se-ft-wt,
1248
+ var(--_ctm-tab-dn-im-se-ft-wt, var(--_ctm-dn-im-se-ft-wt)));
1249
+ font-style: var(--_ctm-mob-dn-im-se-ft-se-ic,
1250
+ var(--_ctm-tab-dn-im-se-ft-se-ic, var(--_ctm-dn-im-se-ft-se-ic)));
1251
+ text-align: var(--_ctm-mob-dn-im-se-tt-an,
1252
+ var(--_ctm-tab-dn-im-se-tt-an, var(--_ctm-dn-im-se-tt-an)));
1253
+ letter-spacing: var(--_ctm-mob-dn-im-se-lr-sg,
1254
+ var(--_ctm-tab-dn-im-se-lr-sg, var(--_ctm-dn-im-se-lr-sg)));
1255
+ line-height: var(--_ctm-mob-dn-im-se-le-ht,
1256
+ var(--_ctm-tab-dn-im-se-le-ht, var(--_ctm-dn-im-se-le-ht)));
1257
+ text-decoration: var(--_ctm-mob-dn-im-se-ue,
1258
+ var(--_ctm-tab-dn-im-se-ue, var(--_ctm-dn-im-se-ue)));
1619
1259
  }
1620
1260
 
1621
1261
  & p {
1622
- color: var(
1623
- --_ctm-mob-dn-im-se-cr-dc,
1624
- var(--_ctm-tab-dn-im-se-cr-dc, var(--_ctm-dn-im-se-cr-dc))
1625
- );
1626
- font-family: var(
1627
- --_ctm-mob-dn-im-se-ft-fy-dc,
1628
- var(--_ctm-tab-dn-im-se-ft-fy-dc, var(--_ctm-dn-im-se-ft-fy-dc))
1629
- );
1630
- text-transform: var(
1631
- --_ctm-mob-dn-im-se-tt-tm-dc,
1632
- var(--_ctm-tab-dn-im-se-tt-tm-dc, var(--_ctm-dn-im-se-tt-tm-dc))
1633
- );
1634
- word-wrap: var(
1635
- --_ctm-mob-dn-im-se-wd-wp-dc,
1636
- var(--_ctm-tab-dn-im-se-wd-wp-dc, var(--_ctm-dn-im-se-wd-wp-dc))
1637
- );
1638
- word-break: var(
1639
- --_ctm-mob-dn-im-se-wd-bk-dc,
1640
- var(--_ctm-tab-dn-im-se-wd-bk-dc, var(--_ctm-dn-im-se-wd-bk-dc))
1641
- );
1642
- font-size: var(
1643
- --_ctm-mob-dn-im-se-ft-se-dc,
1644
- var(--_ctm-tab-dn-im-se-ft-se-dc, var(--_ctm-dn-im-se-ft-se-dc))
1645
- );
1646
- font-weight: var(
1647
- --_ctm-mob-dn-im-se-ft-wt-dc,
1648
- var(--_ctm-tab-dn-im-se-ft-wt-dc, var(--_ctm-dn-im-se-ft-wt-dc))
1649
- );
1650
- font-style: var(
1651
- --_ctm-mob-dn-im-se-ft-se-ic-dc,
1652
- var(--_ctm-tab-dn-im-se-ft-se-ic-dc, var(--_ctm-dn-im-se-ft-se-ic-dc))
1653
- );
1654
- text-align: var(
1655
- --_ctm-mob-dn-im-se-tt-an-dc,
1656
- var(--_ctm-tab-dn-im-se-tt-an-dc, var(--_ctm-dn-im-se-tt-an-dc))
1657
- );
1658
- letter-spacing: var(
1659
- --_ctm-mob-dn-im-se-lr-sg-dc,
1660
- var(--_ctm-tab-dn-im-se-lr-sg-dc, var(--_ctm-dn-im-se-lr-sg-dc))
1661
- );
1662
- line-height: var(
1663
- --_ctm-mob-dn-im-se-le-ht-dc,
1664
- var(--_ctm-tab-dn-im-se-le-ht-dc, var(--_ctm-dn-im-se-le-ht-dc))
1665
- );
1666
- text-decoration: var(
1667
- --_ctm-mob-dn-im-se-ue-dc,
1668
- var(--_ctm-tab-dn-im-se-ue-dc, var(--_ctm-dn-im-se-ue-dc))
1669
- );
1262
+ color: var(--_ctm-mob-dn-im-se-cr-dc,
1263
+ var(--_ctm-tab-dn-im-se-cr-dc, var(--_ctm-dn-im-se-cr-dc)));
1264
+ font-family: var(--_ctm-mob-dn-im-se-ft-fy-dc,
1265
+ var(--_ctm-tab-dn-im-se-ft-fy-dc, var(--_ctm-dn-im-se-ft-fy-dc)));
1266
+ text-transform: var(--_ctm-mob-dn-im-se-tt-tm-dc,
1267
+ var(--_ctm-tab-dn-im-se-tt-tm-dc, var(--_ctm-dn-im-se-tt-tm-dc)));
1268
+ word-wrap: var(--_ctm-mob-dn-im-se-wd-wp-dc,
1269
+ var(--_ctm-tab-dn-im-se-wd-wp-dc, var(--_ctm-dn-im-se-wd-wp-dc)));
1270
+ word-break: var(--_ctm-mob-dn-im-se-wd-bk-dc,
1271
+ var(--_ctm-tab-dn-im-se-wd-bk-dc, var(--_ctm-dn-im-se-wd-bk-dc)));
1272
+ font-size: var(--_ctm-mob-dn-im-se-ft-se-dc,
1273
+ var(--_ctm-tab-dn-im-se-ft-se-dc, var(--_ctm-dn-im-se-ft-se-dc)));
1274
+ font-weight: var(--_ctm-mob-dn-im-se-ft-wt-dc,
1275
+ var(--_ctm-tab-dn-im-se-ft-wt-dc, var(--_ctm-dn-im-se-ft-wt-dc)));
1276
+ font-style: var(--_ctm-mob-dn-im-se-ft-se-ic-dc,
1277
+ var(--_ctm-tab-dn-im-se-ft-se-ic-dc, var(--_ctm-dn-im-se-ft-se-ic-dc)));
1278
+ text-align: var(--_ctm-mob-dn-im-se-tt-an-dc,
1279
+ var(--_ctm-tab-dn-im-se-tt-an-dc, var(--_ctm-dn-im-se-tt-an-dc)));
1280
+ letter-spacing: var(--_ctm-mob-dn-im-se-lr-sg-dc,
1281
+ var(--_ctm-tab-dn-im-se-lr-sg-dc, var(--_ctm-dn-im-se-lr-sg-dc)));
1282
+ line-height: var(--_ctm-mob-dn-im-se-le-ht-dc,
1283
+ var(--_ctm-tab-dn-im-se-le-ht-dc, var(--_ctm-dn-im-se-le-ht-dc)));
1284
+ text-decoration: var(--_ctm-mob-dn-im-se-ue-dc,
1285
+ var(--_ctm-tab-dn-im-se-ue-dc, var(--_ctm-dn-im-se-ue-dc)));
1670
1286
  }
1671
1287
  }
1672
1288
 
@@ -1706,6 +1322,7 @@ $defaultValues: (
1706
1322
  }
1707
1323
 
1708
1324
  &[data-widget-alignment="bottom"] {
1325
+
1709
1326
  // align-items: flex-end;
1710
1327
  .gallery-header {
1711
1328
  bottom: 0;
@@ -1837,7 +1454,7 @@ $defaultValues: (
1837
1454
  justify-content: center;
1838
1455
  margin-block: 12px;
1839
1456
 
1840
- & > button {
1457
+ &>button {
1841
1458
  padding-inline: 24px;
1842
1459
  border: 1px solid gray;
1843
1460
  padding-block: 12px;
@@ -1867,7 +1484,7 @@ body:has(.pim__main) {
1867
1484
  justify-content: center;
1868
1485
  @include prepareMediaQueries($defaultValues);
1869
1486
 
1870
- & > .pim__wrapper {
1487
+ &>.pim__wrapper {
1871
1488
  display: var(--_d-flex);
1872
1489
  align-items: center;
1873
1490
  justify-content: center;
@@ -1879,7 +1496,7 @@ body:has(.pim__main) {
1879
1496
  border: 1px solid #98a2b3;
1880
1497
  position: relative;
1881
1498
 
1882
- & > button {
1499
+ &>button {
1883
1500
  position: absolute;
1884
1501
  right: 20px;
1885
1502
  top: 20px;
@@ -1908,7 +1525,7 @@ body:has(.pim__main) {
1908
1525
  height: 100%;
1909
1526
  position: relative;
1910
1527
 
1911
- & > .pim__img__wrapper {
1528
+ &>.pim__img__wrapper {
1912
1529
  height: 100%;
1913
1530
  }
1914
1531
 
@@ -1965,4 +1582,4 @@ body:has(.pim__main) {
1965
1582
  }
1966
1583
  }
1967
1584
  }
1968
- }
1585
+ }