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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (135) hide show
  1. package/dist/add-existing-form.scss +5 -13
  2. package/dist/add-order.scss +236 -126
  3. package/dist/add-products-tab-details.scss +2097 -1048
  4. package/dist/add-products-tab.scss +1204 -666
  5. package/dist/allocation-header-quota-details.scss +407 -189
  6. package/dist/allocationDetails.scss +2143 -1661
  7. package/dist/allocations-quota-details.scss +323 -159
  8. package/dist/allocations.scss +793 -475
  9. package/dist/amount-estimator.scss +743 -405
  10. package/dist/badge.scss +18 -43
  11. package/dist/brand-basic-elements.scss +124 -76
  12. package/dist/brand.scss +55 -28
  13. package/dist/breadcrumbs.scss +718 -356
  14. package/dist/builder.js +1 -1
  15. package/dist/builderLite.js +1 -1
  16. package/dist/bulk-variant-picker.scss +2027 -1128
  17. package/dist/bundle.scss +1477 -841
  18. package/dist/bundleDetails.scss +5072 -3774
  19. package/dist/button.scss +103 -79
  20. package/dist/buy-for-tab-container.scss +106 -77
  21. package/dist/buyForHeaders.scss +2976 -1722
  22. package/dist/cart-details.scss +1012 -481
  23. package/dist/cart-summary.scss +1149 -557
  24. package/dist/cart-wrapper.scss +79 -37
  25. package/dist/cart.scss +225 -117
  26. package/dist/cartAttributes.scss +735 -416
  27. package/dist/category-groups-element.scss +108 -127
  28. package/dist/category-groups-product-grid.scss +147 -120
  29. package/dist/category-groups-product-image.scss +1457 -1162
  30. package/dist/category-groups-product-options.scss +680 -613
  31. package/dist/category-groups-product-price.scss +3244 -1966
  32. package/dist/category-groups-quota-details.scss +464 -210
  33. package/dist/category.scss +50 -26
  34. package/dist/checkout.scss +16 -24
  35. package/dist/confirm-modal.scss +2 -22
  36. package/dist/container.scss +54 -32
  37. package/dist/countdown.scss +443 -255
  38. package/dist/coupon.scss +710 -351
  39. package/dist/default-dropdown.scss +1 -12
  40. package/dist/embroider-template-1-v2.scss +172 -123
  41. package/dist/embroider-template-1.scss +104 -68
  42. package/dist/embroidery.scss +31 -30
  43. package/dist/employee-bulk-order.scss +142 -418
  44. package/dist/faq.scss +408 -228
  45. package/dist/filter-results.scss +265 -125
  46. package/dist/filters.scss +1797 -900
  47. package/dist/gallery-slider-temp.scss +750 -432
  48. package/dist/global-styles.scss +7 -23
  49. package/dist/grid.scss +33 -25
  50. package/dist/hotspot.scss +115 -68
  51. package/dist/image-temp.scss +20 -21
  52. package/dist/item-stock.scss +16 -9
  53. package/dist/kitDetails.scss +4301 -2721
  54. package/dist/kits.scss +19 -24
  55. package/dist/language-selector.scss +361 -211
  56. package/dist/last-x-orders.scss +174 -95
  57. package/dist/layouter-item.scss +103 -75
  58. package/dist/layouter-pro-item.scss +95 -89
  59. package/dist/layouter-pro.scss +92 -87
  60. package/dist/layouter.scss +445 -383
  61. package/dist/light-box-v2.scss +104 -89
  62. package/dist/login.scss +566 -287
  63. package/dist/map.scss +368 -221
  64. package/dist/marchandiserSets.scss +104 -95
  65. package/dist/mega-menu-container.scss +109 -96
  66. package/dist/mega-menu.scss +731 -624
  67. package/dist/menu-item.scss +2 -2
  68. package/dist/menu-v2.scss +619 -507
  69. package/dist/multi-select-dropdown.scss +3 -27
  70. package/dist/my-templates.scss +9 -38
  71. package/dist/option-bar.scss +375 -215
  72. package/dist/option-families.scss +252 -0
  73. package/dist/order-status.scss +1117 -646
  74. package/dist/overflow-module.scss +7 -6
  75. package/dist/past-orders.scss +149 -118
  76. package/dist/payment-methods.scss +30 -46
  77. package/dist/pickup-locations.scss +1118 -558
  78. package/dist/position-module.scss +17 -20
  79. package/dist/prefix-list.scss +10 -21
  80. package/dist/product-actions.scss +2316 -1610
  81. package/dist/product-basic-elements.scss +169 -108
  82. package/dist/product-highlights.scss +152 -107
  83. package/dist/product-image-bundles.scss +642 -337
  84. package/dist/product-inventory.scss +1357 -673
  85. package/dist/product-labels.scss +105 -84
  86. package/dist/product-options.scss +1274 -1117
  87. package/dist/product-price.scss +2561 -1283
  88. package/dist/product-promotions.scss +2830 -1388
  89. package/dist/product-sizechart.scss +905 -516
  90. package/dist/product.scss +61 -28
  91. package/dist/productDetails.scss +39 -19
  92. package/dist/profile.scss +447 -207
  93. package/dist/quantity-selector.scss +550 -313
  94. package/dist/quick-inventory-check.scss +174 -95
  95. package/dist/quick-links.scss +133 -55
  96. package/dist/quick-order-pad.scss +271 -218
  97. package/dist/quota-details.scss +282 -152
  98. package/dist/quotes.scss +122 -89
  99. package/dist/repeater-embla-controls.scss +15 -35
  100. package/dist/repeater-grid-toggle.scss +166 -156
  101. package/dist/repeater-item.scss +64 -41
  102. package/dist/repeater.scss +814 -671
  103. package/dist/request-for-quotes.scss +16 -66
  104. package/dist/responsive-behaviour.scss +1 -3
  105. package/dist/rfqs.scss +181 -118
  106. package/dist/scroll.scss +172 -93
  107. package/dist/search.scss +326 -179
  108. package/dist/section.scss +51 -27
  109. package/dist/shipping-payments.scss +58 -198
  110. package/dist/simple-list.scss +164 -74
  111. package/dist/social.scss +145 -80
  112. package/dist/sort.scss +19 -11
  113. package/dist/stack.scss +34 -23
  114. package/dist/static-global.scss +26 -44
  115. package/dist/stockStatus.scss +19 -11
  116. package/dist/store-locations.scss +1105 -577
  117. package/dist/tab-container.scss +108 -81
  118. package/dist/table-common.scss +408 -217
  119. package/dist/table.scss +502 -271
  120. package/dist/text-temp.scss +7 -8
  121. package/dist/theme-classes.scss +13 -17
  122. package/dist/types/builder/enums/data-connectors.d.ts +3 -1
  123. package/dist/types/builder/enums/index.d.ts +3 -1
  124. package/dist/types/builder/tools/element-edit/index.d.ts +2 -1
  125. package/dist/types/builder/tools/element-edit/optionFamilies.d.ts +20 -0
  126. package/dist/types/website/constants/data-connector-souces.d.ts +40 -8
  127. package/dist/types/website/constants/data-connectors.d.ts +12 -1
  128. package/dist/types/website/helper/ssr-functions.d.ts +8 -0
  129. package/dist/uom-selector.scss +949 -489
  130. package/dist/user-elements.scss +837 -529
  131. package/dist/variant-picker.scss +2555 -1281
  132. package/dist/volume-pricing.scss +1037 -541
  133. package/dist/website.js +1 -1
  134. package/dist/widget.scss +1 -0
  135. package/package.json +1 -1
@@ -4,15 +4,21 @@
4
4
 
5
5
  $resizerId: "[data-cms-tool='cms-element-resizer']";
6
6
  $resizeActive: '[data-cms-element-resizer="true"]';
7
-
8
7
  [data-div-type="element"] {
9
8
  &[data-element-type="allocations"] {
10
- width: var(--_sf-el-wh-st-mx,
11
- calc(1% * var(--_ctm-mob-ele-nw-wh-vl,
12
- var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))))));
9
+ width: var(
10
+ --_sf-el-wh-st-mx,
11
+ calc(
12
+ 1% *
13
+ var(
14
+ --_ctm-mob-ele-nw-wh-vl,
15
+ var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh)))
16
+ )
17
+ )
18
+ );
13
19
  margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
14
20
 
15
- &>div {
21
+ & > div {
16
22
  &.wrapper {
17
23
  width: 100%;
18
24
  // min-width: 400px;
@@ -31,43 +37,61 @@ $resizeActive: '[data-cms-element-resizer="true"]';
31
37
  }
32
38
 
33
39
  .allocations__element {
34
- background-color: var(--_ctm-mob-dn-wt-se-bd-cr,
35
- var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr)));
40
+ background-color: var(
41
+ --_ctm-mob-dn-wt-se-bd-cr,
42
+ var(--_ctm-tab-dn-wt-se-bd-cr, var(--_ctm-dn-wt-se-bd-cr))
43
+ );
36
44
  padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
37
45
  display: flex;
38
46
  flex-direction: column;
39
- --_sf-gp: var(--_ctm-mob-lt-im-sg,
40
- var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px)));
47
+ --_sf-gp: var(
48
+ --_ctm-mob-lt-im-sg,
49
+ var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
50
+ );
41
51
  --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
42
52
  row-gap: var(--_sf-gp);
43
53
  width: 100%;
44
54
  // height: 100%;
45
- border-color: var(--_ctm-mob-dn-wt-se-br-cr,
46
- var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr)));
47
- border-style: var(--_ctm-mob-dn-wt-se-br-se,
48
- var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se)));
49
- border-width: var(--_ctm-mob-dn-wt-se-br-wh,
50
- var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh)));
51
- border-radius: var(--_ctm-mob-dn-wt-se-br-rs,
52
- var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs)));
53
- box-shadow: var(--_show-shadow,
54
- 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))));
55
+ border-color: var(
56
+ --_ctm-mob-dn-wt-se-br-cr,
57
+ var(--_ctm-tab-dn-wt-se-br-cr, var(--_ctm-dn-wt-se-br-cr))
58
+ );
59
+ border-style: var(
60
+ --_ctm-mob-dn-wt-se-br-se,
61
+ var(--_ctm-tab-dn-wt-se-br-se, var(--_ctm-dn-wt-se-br-se))
62
+ );
63
+ border-width: var(
64
+ --_ctm-mob-dn-wt-se-br-wh,
65
+ var(--_ctm-tab-dn-wt-se-br-wh, var(--_ctm-dn-wt-se-br-wh))
66
+ );
67
+ border-radius: var(
68
+ --_ctm-mob-dn-wt-se-br-rs,
69
+ var(--_ctm-tab-dn-wt-se-br-rs, var(--_ctm-dn-wt-se-br-rs))
70
+ );
71
+ box-shadow: var(
72
+ --_show-shadow,
73
+ var(--_ctm-mob-dn-wt-se-sw-ae, var(--_ctm-tab-dn-wt-se-sw-ae, var(--_ctm-dn-wt-se-sw-ae)))
74
+ var(--_ctm-mob-dn-wt-se-sw-br, var(--_ctm-tab-dn-wt-se-sw-br, var(--_ctm-dn-wt-se-sw-br)))
75
+ var(--_ctm-mob-dn-wt-se-sw-sd, var(--_ctm-tab-dn-wt-se-sw-sd, var(--_ctm-dn-wt-se-sw-sd)))
76
+ var(--_ctm-mob-dn-wt-se-sw-cr, var(--_ctm-tab-dn-wt-se-sw-cr, var(--_ctm-dn-wt-se-sw-cr)))
77
+ );
55
78
 
56
79
  &[data-divider-show="true"] {
57
- --_sf-dvdr: var(--_ctm-mob-dn-dr-dr-wh,
58
- var(--_ctm-tab-dn-dr-dr-wh, var(--_ctm-dn-dr-dr-wh, 1px))) var(--_ctm-mob-dn-dr-br-se, var(--_ctm-tab-dn-dr-br-se, var(--_ctm-dn-dr-br-se, solid))) var(--_ctm-dn-dr-br-cr, var(--_tst-dn-dr-bd-cr));
80
+ --_sf-dvdr: var(
81
+ --_ctm-mob-dn-dr-dr-wh,
82
+ var(--_ctm-tab-dn-dr-dr-wh, var(--_ctm-dn-dr-dr-wh, 1px))
83
+ )
84
+ var(--_ctm-mob-dn-dr-br-se, var(--_ctm-tab-dn-dr-br-se, var(--_ctm-dn-dr-br-se, solid)))
85
+ var(--_ctm-dn-dr-br-cr, var(--_tst-dn-dr-bd-cr));
59
86
  --_sf-dvdr-gap: var(--_sf-gp);
60
87
  }
61
-
62
88
  &[data-icon-position="Left"] {
63
89
  --_sf-fd: row-reverse;
64
90
  --_sf-jc: flex-end;
65
91
  }
66
-
67
92
  &[data-show-icon="false"] {
68
93
  --_sf-show-icon-ff: none;
69
94
  }
70
-
71
95
  &[data-divider-show="true"] {
72
96
  // .accordion-item:not(:last-child) {
73
97
  // border-bottom: var(
@@ -83,10 +107,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
83
107
  display: flex;
84
108
  width: 100%;
85
109
  margin-top: 10px;
86
-
87
110
  &:hover {
88
- --_sf-hr-bn-at: var(--_ctm-mob-dn-ld-me-bn-hr-se-bn-at,
89
- var(--_ctm-tab-dn-ld-me-bn-hr-se-bn-at, var(--_ctm-dn-ld-me-bn-hr-se-bn-at)));
111
+ --_sf-hr-bn-at: var(
112
+ --_ctm-mob-dn-ld-me-bn-hr-se-bn-at,
113
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-bn-at, var(--_ctm-dn-ld-me-bn-hr-se-bn-at))
114
+ );
90
115
  }
91
116
 
92
117
  justify-content: var(--_sf-hr-at, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bn-at));
@@ -96,94 +121,145 @@ $resizeActive: '[data-cms-element-resizer="true"]';
96
121
  &[data-show-shadow="false"] {
97
122
  --_show-shadow: none;
98
123
  }
99
-
100
124
  &[data-icon-position="left"] {
101
125
  --_sf-fd-bn: row;
102
126
  }
103
-
104
127
  &[data-icon-position="right"] {
105
128
  --_sf-fd-bn: row-reverse;
106
129
  }
107
-
108
130
  &[data-icon-position="center"] {
109
131
  --_sf-fd-bn: row;
110
132
  }
111
133
 
112
134
  &:hover {
113
- --_sf-hr-bd-cr: var(--_ctm-mob-dn-rm-bn-hr-se-bd-cr,
114
- var(--_ctm-tab-dn-rm-bn-hr-se-bd-cr, var(--_ctm-dn-rm-bn-hr-se-bd-cr)));
115
- --_sf-hr-br-cr: var(--_ctm-mob-dn-rm-bn-hr-se-br-cr,
116
- var(--_ctm-tab-dn-rm-bn-hr-se-br-cr, var(--_ctm-dn-rm-bn-hr-se-br-cr)));
117
- --_sf-hr-br-se: var(--_ctm-mob-dn-rm-bn-hr-se-br-se,
118
- var(--_ctm-tab-dn-rm-bn-hr-se-br-se, var(--_ctm-dn-rm-bn-hr-se-br-se)));
119
- --_sf-hr-br-wh: var(--_ctm-mob-dn-rm-bn-hr-se-br-wh,
120
- var(--_ctm-tab-dn-rm-bn-hr-se-br-wh, var(--_ctm-dn-rm-bn-hr-se-br-wh)));
121
- --_sf-hr-br-rs: var(--_ctm-mob-dn-rm-bn-hr-se-br-rs,
122
- var(--_ctm-tab-dn-rm-bn-hr-se-br-rs, var(--_ctm-dn-rm-bn-hr-se-br-rs)));
123
- --_sf-hr-at: var(--_ctm-mob-dn-rm-bn-hr-se-at,
124
- var(--_ctm-tab-dn-rm-bn-hr-se-at, var(--_ctm-dn-rm-bn-hr-se-at)));
125
- --_sf-hr-gp: var(--_ctm-mob-dn-rm-bn-hr-se-gp,
126
- var(--_ctm-tab-dn-rm-bn-hr-se-gp, var(--_ctm-dn-rm-bn-hr-se-gp)));
135
+ --_sf-hr-bd-cr: var(
136
+ --_ctm-mob-dn-rm-bn-hr-se-bd-cr,
137
+ var(--_ctm-tab-dn-rm-bn-hr-se-bd-cr, var(--_ctm-dn-rm-bn-hr-se-bd-cr))
138
+ );
139
+ --_sf-hr-br-cr: var(
140
+ --_ctm-mob-dn-rm-bn-hr-se-br-cr,
141
+ var(--_ctm-tab-dn-rm-bn-hr-se-br-cr, var(--_ctm-dn-rm-bn-hr-se-br-cr))
142
+ );
143
+ --_sf-hr-br-se: var(
144
+ --_ctm-mob-dn-rm-bn-hr-se-br-se,
145
+ var(--_ctm-tab-dn-rm-bn-hr-se-br-se, var(--_ctm-dn-rm-bn-hr-se-br-se))
146
+ );
147
+ --_sf-hr-br-wh: var(
148
+ --_ctm-mob-dn-rm-bn-hr-se-br-wh,
149
+ var(--_ctm-tab-dn-rm-bn-hr-se-br-wh, var(--_ctm-dn-rm-bn-hr-se-br-wh))
150
+ );
151
+ --_sf-hr-br-rs: var(
152
+ --_ctm-mob-dn-rm-bn-hr-se-br-rs,
153
+ var(--_ctm-tab-dn-rm-bn-hr-se-br-rs, var(--_ctm-dn-rm-bn-hr-se-br-rs))
154
+ );
155
+ --_sf-hr-at: var(
156
+ --_ctm-mob-dn-rm-bn-hr-se-at,
157
+ var(--_ctm-tab-dn-rm-bn-hr-se-at, var(--_ctm-dn-rm-bn-hr-se-at))
158
+ );
159
+ --_sf-hr-gp: var(
160
+ --_ctm-mob-dn-rm-bn-hr-se-gp,
161
+ var(--_ctm-tab-dn-rm-bn-hr-se-gp, var(--_ctm-dn-rm-bn-hr-se-gp))
162
+ );
127
163
 
128
164
  // for shadow
129
- --_sf-hr-sw-ae: var(--_ctm-mob-dn-rm-bn-hr-se-sw-ae,
130
- var(--_ctm-tab-dn-rm-bn-hr-se-sw-ae, var(--_ctm-dn-rm-bn-hr-se-sw-ae)));
131
- --_sf-hr-sw-br: var(--_ctm-mob-dn-rm-bn-hr-se-sw-br,
132
- var(--_ctm-tab-dn-rm-bn-hr-se-sw-br, var(--_ctm-dn-rm-bn-hr-se-sw-br)));
133
- --_sf-hr-sw-hr: var(--_ctm-mob-dn-rm-bn-hr-se-sw-hr,
134
- var(--_ctm-tab-dn-rm-bn-hr-se-sw-hr, var(--_ctm-dn-rm-bn-hr-se-sw-hr)));
135
- --_sf-hr-sw-cr: var(--_ctm-mob-dn-rm-bn-hr-se-sw-cr,
136
- var(--_ctm-tab-dn-rm-bn-hr-se-sw-cr, var(--_ctm-dn-rm-bn-hr-se-sw-cr)));
165
+ --_sf-hr-sw-ae: var(
166
+ --_ctm-mob-dn-rm-bn-hr-se-sw-ae,
167
+ var(--_ctm-tab-dn-rm-bn-hr-se-sw-ae, var(--_ctm-dn-rm-bn-hr-se-sw-ae))
168
+ );
169
+ --_sf-hr-sw-br: var(
170
+ --_ctm-mob-dn-rm-bn-hr-se-sw-br,
171
+ var(--_ctm-tab-dn-rm-bn-hr-se-sw-br, var(--_ctm-dn-rm-bn-hr-se-sw-br))
172
+ );
173
+ --_sf-hr-sw-hr: var(
174
+ --_ctm-mob-dn-rm-bn-hr-se-sw-hr,
175
+ var(--_ctm-tab-dn-rm-bn-hr-se-sw-hr, var(--_ctm-dn-rm-bn-hr-se-sw-hr))
176
+ );
177
+ --_sf-hr-sw-cr: var(
178
+ --_ctm-mob-dn-rm-bn-hr-se-sw-cr,
179
+ var(--_ctm-tab-dn-rm-bn-hr-se-sw-cr, var(--_ctm-dn-rm-bn-hr-se-sw-cr))
180
+ );
137
181
 
138
182
  // for font
139
183
 
140
- --_sf-hr-cr: var(--_ctm-mob-dn-rm-bn-hr-se-cr,
141
- var(--_ctm-tab-dn-rm-bn-hr-se-cr, var(--_ctm-dn-rm-bn-hr-se-cr)));
142
- --_sf-hr-ft-fy: var(--_ctm-mob-dn-rm-bn-hr-se-ft-fy,
143
- var(--_ctm-tab-dn-rm-bn-hr-se-ft-fy, var(--_ctm-dn-rm-bn-hr-se-ft-fy)));
144
- --_sf-hr-tt-tm: var(--_ctm-mob-dn-rm-bn-hr-se-tt-tm,
145
- var(--_ctm-tab-dn-rm-bn-hr-se-tt-tm, var(--_ctm-dn-rm-bn-hr-se-tt-tm)));
146
- --_sf-hr-wd-wp: var(--_ctm-mob-dn-rm-bn-hr-se-wd-wp,
147
- var(--_ctm-tab-dn-rm-bn-hr-se-wd-wp, var(--_ctm-dn-rm-bn-hr-se-wd-wp)));
148
- --_sf-hr-wd-bk: var(--_ctm-mob-dn-rm-bn-hr-se-wd-bk,
149
- var(--_ctm-tab-dn-rm-bn-hr-se-wd-bk, var(--_ctm-dn-rm-bn-hr-se-wd-bk)));
150
- --_sf-hr-ft-se: var(--_ctm-mob-dn-rm-bn-hr-se-ft-se,
151
- var(--_ctm-tab-dn-rm-bn-hr-se-ft-se, var(--_ctm-dn-rm-bn-hr-se-ft-se)));
152
- --_sf-hr-ft-wt: var(--_ctm-mob-dn-rm-bn-hr-se-ft-wt,
153
- var(--_ctm-tab-dn-rm-bn-hr-se-ft-wt, var(--_ctm-dn-rm-bn-hr-se-ft-wt)));
154
- --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-rm-bn-hr-se-ft-se-ic,
155
- var(--_ctm-tab-dn-rm-bn-hr-se-ft-se-ic, var(--_ctm-dn-rm-bn-hr-se-ft-se-ic)));
156
- --_sf-hr-tt-an: var(--_ctm-mob-dn-rm-bn-hr-se-tt-an,
157
- var(--_ctm-tab-dn-rm-bn-hr-se-tt-an, var(--_ctm-dn-rm-bn-hr-se-tt-an)));
158
- --_sf-hr-lr-sg: var(--_ctm-mob-dn-rm-bn-hr-se-lr-sg,
159
- var(--_ctm-tab-dn-rm-bn-hr-se-lr-sg, var(--_ctm-dn-rm-bn-hr-se-lr-sg)));
160
- --_sf-hr-le-ht: var(--_ctm-mob-dn-rm-bn-hr-se-le-ht,
161
- var(--_ctm-tab-dn-rm-bn-hr-se-le-ht, var(--_ctm-dn-rm-bn-hr-se-le-ht)));
162
-
163
- --_sf-hr-in-se: var(--_ctm-mob-dn-rm-bn-hr-se-in-se,
164
- var(--_ctm-tab-dn-rm-bn-hr-se-in-se, var(--_ctm-dn-rm-bn-hr-se-in-se)));
165
- --_sf-hr-in-se: var(--_ctm-mob-dn-rm-bn-hr-se-in-se,
166
- var(--_ctm-tab-dn-rm-bn-hr-se-in-se, var(--_ctm-dn-rm-bn-hr-se-in-se)));
167
- --_sf-hr-in-c1: var(--_ctm-mob-dn-rm-bn-hr-se-in-c1,
168
- var(--_ctm-tab-dn-rm-bn-hr-se-in-c1, var(--_ctm-dn-rm-bn-hr-se-in-c1)));
169
- --_sf-hr-ue: var(--_ctm-mob-dn-rm-bn-hr-se-ue,
170
- var(--_ctm-tab-dn-rm-bn-hr-se-ue, var(--_ctm-dn-rm-bn-hr-se-ue)));
184
+ --_sf-hr-cr: var(
185
+ --_ctm-mob-dn-rm-bn-hr-se-cr,
186
+ var(--_ctm-tab-dn-rm-bn-hr-se-cr, var(--_ctm-dn-rm-bn-hr-se-cr))
187
+ );
188
+ --_sf-hr-ft-fy: var(
189
+ --_ctm-mob-dn-rm-bn-hr-se-ft-fy,
190
+ var(--_ctm-tab-dn-rm-bn-hr-se-ft-fy, var(--_ctm-dn-rm-bn-hr-se-ft-fy))
191
+ );
192
+ --_sf-hr-tt-tm: var(
193
+ --_ctm-mob-dn-rm-bn-hr-se-tt-tm,
194
+ var(--_ctm-tab-dn-rm-bn-hr-se-tt-tm, var(--_ctm-dn-rm-bn-hr-se-tt-tm))
195
+ );
196
+ --_sf-hr-wd-wp: var(
197
+ --_ctm-mob-dn-rm-bn-hr-se-wd-wp,
198
+ var(--_ctm-tab-dn-rm-bn-hr-se-wd-wp, var(--_ctm-dn-rm-bn-hr-se-wd-wp))
199
+ );
200
+ --_sf-hr-wd-bk: var(
201
+ --_ctm-mob-dn-rm-bn-hr-se-wd-bk,
202
+ var(--_ctm-tab-dn-rm-bn-hr-se-wd-bk, var(--_ctm-dn-rm-bn-hr-se-wd-bk))
203
+ );
204
+ --_sf-hr-ft-se: var(
205
+ --_ctm-mob-dn-rm-bn-hr-se-ft-se,
206
+ var(--_ctm-tab-dn-rm-bn-hr-se-ft-se, var(--_ctm-dn-rm-bn-hr-se-ft-se))
207
+ );
208
+ --_sf-hr-ft-wt: var(
209
+ --_ctm-mob-dn-rm-bn-hr-se-ft-wt,
210
+ var(--_ctm-tab-dn-rm-bn-hr-se-ft-wt, var(--_ctm-dn-rm-bn-hr-se-ft-wt))
211
+ );
212
+ --_sf-hr-ft-se-ic: var(
213
+ --_ctm-mob-dn-rm-bn-hr-se-ft-se-ic,
214
+ var(--_ctm-tab-dn-rm-bn-hr-se-ft-se-ic, var(--_ctm-dn-rm-bn-hr-se-ft-se-ic))
215
+ );
216
+ --_sf-hr-tt-an: var(
217
+ --_ctm-mob-dn-rm-bn-hr-se-tt-an,
218
+ var(--_ctm-tab-dn-rm-bn-hr-se-tt-an, var(--_ctm-dn-rm-bn-hr-se-tt-an))
219
+ );
220
+ --_sf-hr-lr-sg: var(
221
+ --_ctm-mob-dn-rm-bn-hr-se-lr-sg,
222
+ var(--_ctm-tab-dn-rm-bn-hr-se-lr-sg, var(--_ctm-dn-rm-bn-hr-se-lr-sg))
223
+ );
224
+ --_sf-hr-le-ht: var(
225
+ --_ctm-mob-dn-rm-bn-hr-se-le-ht,
226
+ var(--_ctm-tab-dn-rm-bn-hr-se-le-ht, var(--_ctm-dn-rm-bn-hr-se-le-ht))
227
+ );
228
+
229
+ --_sf-hr-in-se: var(
230
+ --_ctm-mob-dn-rm-bn-hr-se-in-se,
231
+ var(--_ctm-tab-dn-rm-bn-hr-se-in-se, var(--_ctm-dn-rm-bn-hr-se-in-se))
232
+ );
233
+ --_sf-hr-in-se: var(
234
+ --_ctm-mob-dn-rm-bn-hr-se-in-se,
235
+ var(--_ctm-tab-dn-rm-bn-hr-se-in-se, var(--_ctm-dn-rm-bn-hr-se-in-se))
236
+ );
237
+ --_sf-hr-in-c1: var(
238
+ --_ctm-mob-dn-rm-bn-hr-se-in-c1,
239
+ var(--_ctm-tab-dn-rm-bn-hr-se-in-c1, var(--_ctm-dn-rm-bn-hr-se-in-c1))
240
+ );
241
+ --_sf-hr-ue: var(
242
+ --_ctm-mob-dn-rm-bn-hr-se-ue,
243
+ var(--_ctm-tab-dn-rm-bn-hr-se-ue, var(--_ctm-dn-rm-bn-hr-se-ue))
244
+ );
171
245
 
172
246
  // for pading and width
173
- --_sf-hr-pg: var(--_ctm-mob-dn-rm-bn-hr-pg,
174
- var(--_ctm-tab-dn-rm-bn-hr-pg, var(--_ctm-dn-rm-bn-hr-pg)));
175
- --_sf-hr-wh: var(--_ctm-mob-dn-rm-bn-hr-wh,
176
- var(--_ctm-tab-dn-rm-bn-hr-wh, var(--_ctm-dn-rm-bn-hr-wh)));
247
+ --_sf-hr-pg: var(
248
+ --_ctm-mob-dn-rm-bn-hr-pg,
249
+ var(--_ctm-tab-dn-rm-bn-hr-pg, var(--_ctm-dn-rm-bn-hr-pg))
250
+ );
251
+ --_sf-hr-wh: var(
252
+ --_ctm-mob-dn-rm-bn-hr-wh,
253
+ var(--_ctm-tab-dn-rm-bn-hr-wh, var(--_ctm-dn-rm-bn-hr-wh))
254
+ );
177
255
 
178
256
  &[data-hover-show-shadow="false"] {
179
257
  --_hover-show-shadow: none;
180
258
  }
181
-
182
259
  &[data-hover-show-icon="false"] {
183
260
  --_hover-show-icon: none;
184
261
  }
185
262
  }
186
-
187
263
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-bd-cr));
188
264
 
189
265
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-pg));
@@ -197,7 +273,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
197
273
 
198
274
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-br-rs));
199
275
 
200
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-cr));
276
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-ae))
277
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-br))
278
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-sd))
279
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-sw-cr));
201
280
 
202
281
  &[data-show-border="true"] {
203
282
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-br-cr));
@@ -216,7 +295,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
216
295
  text-transform: var(--_sf-hr-tt-tm, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-tt-tm));
217
296
  word-wrap: var(--_sf-hr-wd-wp, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-wd-wp));
218
297
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-wd-bk));
219
-
220
298
  &.flex__overflow {
221
299
  white-space: normal;
222
300
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -239,7 +317,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
239
317
 
240
318
  .icon {
241
319
  display: var(--_hover-show-icon, var(--_show-icon, flex));
242
-
243
320
  svg {
244
321
  width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-in-se));
245
322
  height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-rm-bn-dt-se-in-se));
@@ -251,7 +328,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
251
328
  }
252
329
  }
253
330
  }
254
-
255
331
  [data-element-style="Text"] {
256
332
  display: inline-block;
257
333
  width: 100%;
@@ -283,23 +359,19 @@ $resizeActive: '[data-cms-element-resizer="true"]';
283
359
  align-self: stretch;
284
360
  align-items: center;
285
361
  width: 100%;
286
-
287
362
  .table__wrapper,
288
363
  .table__container {
289
364
  // overflow: visible !important;
290
365
  overflow-x: auto;
291
366
  scrollbar-width: none;
292
367
  }
293
-
294
368
  thead th {
295
369
  overflow: visible;
296
370
  position: relative;
297
371
  }
298
-
299
372
  .est__dropdown__main {
300
373
  z-index: var(--_higher-zIndex, 10);
301
374
  }
302
-
303
375
  .table__common_parent {
304
376
  // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
305
377
  width: 100%;
@@ -328,61 +400,75 @@ $resizeActive: '[data-cms-element-resizer="true"]';
328
400
  --_sf-hr-ls: var(--_ctm-dn-pn-hr-se-lr-sg, var(--_tst-dn-pn-hr-se-lr-sg));
329
401
  --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
330
402
  }
331
-
332
403
  &[data-widget-shadow="false"] {
333
404
  .table__wrapper {
334
405
  --_show-shadow: none;
335
406
  }
336
407
  }
337
-
338
408
  &[data-widget-border="true"] {
339
409
  .table__wrapper {
340
- border-color: var(--_ctm-mob-dn-te-wt-br-cr,
341
- var(--_ctm-tab-dn-te-wt-br-cr, var(--_ctm-dn-te-wt-br-cr)));
342
- border-style: var(--_ctm-mob-dn-te-wt-br-se,
343
- var(--_ctm-tab-dn-te-wt-br-se, var(--_ctm-dn-te-wt-br-se)));
344
- border-width: var(--_ctm-mob-dn-te-wt-br-wh,
345
- var(--_ctm-tab-dn-te-wt-br-wh, var(--_ctm-dn-te-wt-br-wh)));
410
+ border-color: var(
411
+ --_ctm-mob-dn-te-wt-br-cr,
412
+ var(--_ctm-tab-dn-te-wt-br-cr, var(--_ctm-dn-te-wt-br-cr))
413
+ );
414
+ border-style: var(
415
+ --_ctm-mob-dn-te-wt-br-se,
416
+ var(--_ctm-tab-dn-te-wt-br-se, var(--_ctm-dn-te-wt-br-se))
417
+ );
418
+ border-width: var(
419
+ --_ctm-mob-dn-te-wt-br-wh,
420
+ var(--_ctm-tab-dn-te-wt-br-wh, var(--_ctm-dn-te-wt-br-wh))
421
+ );
346
422
  }
347
423
  }
348
-
349
424
  &[data-table-shadow="false"] {
350
425
  .table__container {
351
426
  --_show-table-shadow: none;
352
427
  }
353
428
  }
354
-
355
429
  &[data-table-border="true"] {
356
430
  .table__container {
357
- border-color: var(--_ctm-mob-dn-te-br-cr,
358
- var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr)));
359
- border-style: var(--_ctm-mob-dn-te-br-se,
360
- var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se)));
361
- border-width: var(--_ctm-mob-dn-te-br-wh,
362
- var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh)));
431
+ border-color: var(
432
+ --_ctm-mob-dn-te-br-cr,
433
+ var(--_ctm-tab-dn-te-br-cr, var(--_ctm-dn-te-br-cr))
434
+ );
435
+ border-style: var(
436
+ --_ctm-mob-dn-te-br-se,
437
+ var(--_ctm-tab-dn-te-br-se, var(--_ctm-dn-te-br-se))
438
+ );
439
+ border-width: var(
440
+ --_ctm-mob-dn-te-br-wh,
441
+ var(--_ctm-tab-dn-te-br-wh, var(--_ctm-dn-te-br-wh))
442
+ );
363
443
  }
364
444
  }
365
445
 
366
446
  &[data-header-divider="true"] {
367
447
  thead tr th {
368
- border-bottom: 1px solid var(--_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
369
- var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr)));
448
+ border-bottom: 1px solid
449
+ var(
450
+ --_ctm-mob-dn-rw-ad-hr-ds-hr-dr,
451
+ var(--_ctm-tab-dn-rw-ad-hr-ds-hr-dr, var(--_ctm-dn-rw-ad-hr-ds-hr-dr))
452
+ );
370
453
  }
371
454
  }
372
-
373
455
  &[data-row-divider="true"] {
374
456
  tbody tr {
375
- border-bottom: 1px solid var(--_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
376
- var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr)));
457
+ border-bottom: 1px solid
458
+ var(
459
+ --_ctm-mob-dn-rw-ad-hr-ds-rw-dr,
460
+ var(--_ctm-tab-dn-rw-ad-hr-ds-rw-dr, var(--_ctm-dn-rw-ad-hr-ds-rw-dr))
461
+ );
377
462
  }
378
463
  }
379
-
380
464
  &[data-column-divider="true"] {
381
-
382
465
  tbody tr td,
383
466
  thead tr th {
384
- border-right: 1px solid var(--_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
385
- var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr)));
467
+ border-right: 1px solid
468
+ var(
469
+ --_ctm-mob-dn-rw-ad-hr-ds-cn-dr,
470
+ var(--_ctm-tab-dn-rw-ad-hr-ds-cn-dr, var(--_ctm-dn-rw-ad-hr-ds-cn-dr))
471
+ );
386
472
  }
387
473
 
388
474
  tbody tr td:last-child,
@@ -390,16 +476,19 @@ $resizeActive: '[data-cms-element-resizer="true"]';
390
476
  border-right: none;
391
477
  }
392
478
  }
393
-
394
479
  &[data-show-more-rows="onScroll"] {
395
480
  .table__container {
396
481
  overflow-y: scroll;
397
- height: var(--_ctm-mob-lt-te-ht,
398
- var(--_ctm-tab-lt-te-ht, var(--_ctm-lt-te-ht))) !important;
482
+ height: var(
483
+ --_ctm-mob-lt-te-ht,
484
+ var(--_ctm-tab-lt-te-ht, var(--_ctm-lt-te-ht))
485
+ ) !important;
399
486
 
400
487
  &::-webkit-scrollbar {
401
- width: var(--_ctm-mob-dn-sl-br-sl-br-wh,
402
- var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh)));
488
+ width: var(
489
+ --_ctm-mob-dn-sl-br-sl-br-wh,
490
+ var(--_ctm-tab-dn-sl-br-sl-br-wh, var(--_ctm-dn-sl-br-sl-br-wh))
491
+ );
403
492
  }
404
493
 
405
494
  &::-webkit-scrollbar-track {
@@ -407,8 +496,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
407
496
  }
408
497
 
409
498
  &::-webkit-scrollbar-thumb {
410
- background-color: var(--_ctm-mob-dn-sl-br-sl-br-cr,
411
- var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr)));
499
+ background-color: var(
500
+ --_ctm-mob-dn-sl-br-sl-br-cr,
501
+ var(--_ctm-tab-dn-sl-br-sl-br-cr, var(--_ctm-dn-sl-br-sl-br-cr))
502
+ );
412
503
  }
413
504
 
414
505
  // // Scrollbar thumb when hovered
@@ -427,38 +518,65 @@ $resizeActive: '[data-cms-element-resizer="true"]';
427
518
  background-color: prepareMediaVariable(--_ctm-dn-rw-ae-cr-bd-cr);
428
519
  }
429
520
  }
430
-
431
521
  .table__wrapper {
432
522
  flex: 1 1 auto;
433
523
  min-width: 0;
434
524
  overflow-x: auto;
435
- padding: var(--_ctm-mob-lt-pg,
436
- var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg, var(--_tst-lt-pg))));
437
-
438
- background-color: var(--_ctm-mob-dn-te-wt-bd-cr,
439
- var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr))));
440
-
441
- border-radius: var(--_ctm-mob-dn-te-wt-br-rs,
442
- var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs))));
443
-
444
- box-shadow: var(--_show-shadow,
445
- var(--_ctm-mob-dn-te-wt-sw-ae,
446
- var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae))) var(--_ctm-mob-dn-te-wt-sw-br,
447
- var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br))) var(--_ctm-mob-dn-te-wt-sw-sd,
448
- var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd))) var(--_ctm-mob-dn-te-wt-sw-cr,
449
- var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr))));
525
+ padding: var(
526
+ --_ctm-mob-lt-pg,
527
+ var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg, var(--_tst-lt-pg)))
528
+ );
529
+
530
+ background-color: var(
531
+ --_ctm-mob-dn-te-wt-bd-cr,
532
+ var(--_ctm-tab-dn-te-wt-bd-cr, var(--_ctm-dn-te-wt-bd-cr, var(--_tst-dn-te-wt-bd-cr)))
533
+ );
534
+
535
+ border-radius: var(
536
+ --_ctm-mob-dn-te-wt-br-rs,
537
+ var(--_ctm-tab-dn-te-wt-br-rs, var(--_ctm-dn-te-wt-br-rs, var(--_tst-dn-te-wt-br-rs)))
538
+ );
539
+
540
+ box-shadow: var(
541
+ --_show-shadow,
542
+ var(
543
+ --_ctm-mob-dn-te-wt-sw-ae,
544
+ var(--_ctm-tab-dn-te-wt-sw-ae, var(--_ctm-dn-te-wt-sw-ae))
545
+ )
546
+ var(
547
+ --_ctm-mob-dn-te-wt-sw-br,
548
+ var(--_ctm-tab-dn-te-wt-sw-br, var(--_ctm-dn-te-wt-sw-br))
549
+ )
550
+ var(
551
+ --_ctm-mob-dn-te-wt-sw-sd,
552
+ var(--_ctm-tab-dn-te-wt-sw-sd, var(--_ctm-dn-te-wt-sw-sd))
553
+ )
554
+ var(
555
+ --_ctm-mob-dn-te-wt-sw-cr,
556
+ var(--_ctm-tab-dn-te-wt-sw-cr, var(--_ctm-dn-te-wt-sw-cr))
557
+ )
558
+ );
450
559
 
451
560
  width: 100%;
452
561
 
453
562
  .table__container {
454
- background-color: var(--_ctm-mob-dn-te-bd-cr,
455
- var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr)));
456
-
457
- border-radius: var(--_ctm-mob-dn-te-br-rs,
458
- var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs)));
459
-
460
- box-shadow: var(--_show-table-shadow,
461
- var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae))) var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br))) var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd))) var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr))));
563
+ background-color: var(
564
+ --_ctm-mob-dn-te-bd-cr,
565
+ var(--_ctm-tab-dn-te-bd-cr, var(--_ctm-dn-te-bd-cr))
566
+ );
567
+
568
+ border-radius: var(
569
+ --_ctm-mob-dn-te-br-rs,
570
+ var(--_ctm-tab-dn-te-br-rs, var(--_ctm-dn-te-br-rs))
571
+ );
572
+
573
+ box-shadow: var(
574
+ --_show-table-shadow,
575
+ var(--_ctm-mob-dn-te-sw-ae, var(--_ctm-tab-dn-te-sw-ae, var(--_ctm-dn-te-sw-ae)))
576
+ var(--_ctm-mob-dn-te-sw-br, var(--_ctm-tab-dn-te-sw-br, var(--_ctm-dn-te-sw-br)))
577
+ var(--_ctm-mob-dn-te-sw-sd, var(--_ctm-tab-dn-te-sw-sd, var(--_ctm-dn-te-sw-sd)))
578
+ var(--_ctm-mob-dn-te-sw-cr, var(--_ctm-tab-dn-te-sw-cr, var(--_ctm-dn-te-sw-cr)))
579
+ );
462
580
  }
463
581
 
464
582
  h3 {
@@ -466,7 +584,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
466
584
  width: 100%;
467
585
  margin-bottom: 10px;
468
586
  }
469
-
470
587
  table {
471
588
  border-collapse: collapse;
472
589
  // border: none;
@@ -476,49 +593,69 @@ $resizeActive: '[data-cms-element-resizer="true"]';
476
593
  width: max-content;
477
594
  min-width: 100%;
478
595
  table-layout: auto;
479
-
480
596
  th,
481
597
  td {
482
598
  border: none;
483
599
  }
484
-
485
600
  thead {
486
- background-color: var(--_ctm-mob-dn-te-hr-bd-cr,
487
- var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr)));
601
+ background-color: var(
602
+ --_ctm-mob-dn-te-hr-bd-cr,
603
+ var(--_ctm-tab-dn-te-hr-bd-cr, var(--_ctm-dn-te-hr-bd-cr))
604
+ );
488
605
 
489
606
  .thead__row__divider {
490
607
  height: var(--_ctm-mob-lt-hr-ht, var(--_ctm-tab-lt-hr-ht, var(--_ctm-lt-hr-ht)));
491
608
 
492
609
  .th__col__divider {
493
- padding: var(--_ctm-mob-lt-hr-cl-pg,
494
- var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-lt-hr-cl-pg)));
495
-
496
- color: var(--_ctm-mob-dn-hr-tt-cr,
497
- var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr)));
498
-
499
- font-family: var(--_ctm-mob-dn-hr-tt-ft-fy,
500
- var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy)));
501
-
502
- font-size: var(--_ctm-mob-dn-hr-tt-ft-se,
503
- var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se)));
504
-
505
- font-weight: var(--_ctm-mob-dn-hr-tt-ft-wt,
506
- var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt)));
507
-
508
- text-decoration: var(--_ctm-mob-dn-hr-tt-ue,
509
- var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue)));
510
-
511
- font-style: var(--_ctm-mob-dn-hr-tt-ft-se-ic,
512
- var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic)));
513
-
514
- text-align: var(--_ctm-mob-dn-hr-tt-tt-an,
515
- var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an)));
516
-
517
- letter-spacing: var(--_ctm-mob-dn-hr-tt-lr-sg,
518
- var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg)));
519
-
520
- line-height: var(--_ctm-mob-dn-hr-tt-le-ht,
521
- var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht)));
610
+ padding: var(
611
+ --_ctm-mob-lt-hr-cl-pg,
612
+ var(--_ctm-tab-lt-hr-cl-pg, var(--_ctm-lt-hr-cl-pg))
613
+ );
614
+
615
+ color: var(
616
+ --_ctm-mob-dn-hr-tt-cr,
617
+ var(--_ctm-tab-dn-hr-tt-cr, var(--_ctm-dn-hr-tt-cr))
618
+ );
619
+
620
+ font-family: var(
621
+ --_ctm-mob-dn-hr-tt-ft-fy,
622
+ var(--_ctm-tab-dn-hr-tt-ft-fy, var(--_ctm-dn-hr-tt-ft-fy))
623
+ );
624
+
625
+ font-size: var(
626
+ --_ctm-mob-dn-hr-tt-ft-se,
627
+ var(--_ctm-tab-dn-hr-tt-ft-se, var(--_ctm-dn-hr-tt-ft-se))
628
+ );
629
+
630
+ font-weight: var(
631
+ --_ctm-mob-dn-hr-tt-ft-wt,
632
+ var(--_ctm-tab-dn-hr-tt-ft-wt, var(--_ctm-dn-hr-tt-ft-wt))
633
+ );
634
+
635
+ text-decoration: var(
636
+ --_ctm-mob-dn-hr-tt-ue,
637
+ var(--_ctm-tab-dn-hr-tt-ue, var(--_ctm-dn-hr-tt-ue))
638
+ );
639
+
640
+ font-style: var(
641
+ --_ctm-mob-dn-hr-tt-ft-se-ic,
642
+ var(--_ctm-tab-dn-hr-tt-ft-se-ic, var(--_ctm-dn-hr-tt-ft-se-ic))
643
+ );
644
+
645
+ text-align: var(
646
+ --_ctm-mob-dn-hr-tt-tt-an,
647
+ var(--_ctm-tab-dn-hr-tt-tt-an, var(--_ctm-dn-hr-tt-tt-an))
648
+ );
649
+
650
+ letter-spacing: var(
651
+ --_ctm-mob-dn-hr-tt-lr-sg,
652
+ var(--_ctm-tab-dn-hr-tt-lr-sg, var(--_ctm-dn-hr-tt-lr-sg))
653
+ );
654
+
655
+ line-height: var(
656
+ --_ctm-mob-dn-hr-tt-le-ht,
657
+ var(--_ctm-tab-dn-hr-tt-le-ht, var(--_ctm-dn-hr-tt-le-ht))
658
+ );
522
659
 
523
660
  // Header Text > Text Transform and the word wrap/break pair that the
524
661
  // typography panel renders alongside it.
@@ -542,10 +679,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
542
679
  }
543
680
  }
544
681
  }
545
-
546
682
  tbody {
547
683
  .tbody__row__divider {
548
-
549
684
  // Set by CommonTable only when the caller passed onRowClick.
550
685
  // The cells carry it too: a <td> establishes its own cursor context,
551
686
  // so the pointer would stop at the row padding otherwise.
@@ -558,68 +693,126 @@ $resizeActive: '[data-cms-element-resizer="true"]';
558
693
  }
559
694
  }
560
695
 
561
- background-color: var(--_ctm-mob-dn-te-rw-bd-cr,
562
- var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr)));
696
+ background-color: var(
697
+ --_ctm-mob-dn-te-rw-bd-cr,
698
+ var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
699
+ );
563
700
 
564
701
  // Table Row > Hover Background. Falls back to the default background
565
702
  // so a row that has no hover colour set does not go transparent.
566
703
  &:hover {
567
- background-color: var(--_ctm-mob-dn-te-rw-bd-cr-hr,
568
- var(--_ctm-tab-dn-te-rw-bd-cr-hr,
569
- var(--_ctm-dn-te-rw-bd-cr-hr,
570
- var(--_ctm-mob-dn-te-rw-bd-cr,
571
- var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))))));
704
+ background-color: var(
705
+ --_ctm-mob-dn-te-rw-bd-cr-hr,
706
+ var(
707
+ --_ctm-tab-dn-te-rw-bd-cr-hr,
708
+ var(
709
+ --_ctm-dn-te-rw-bd-cr-hr,
710
+ var(
711
+ --_ctm-mob-dn-te-rw-bd-cr,
712
+ var(--_ctm-tab-dn-te-rw-bd-cr, var(--_ctm-dn-te-rw-bd-cr))
713
+ )
714
+ )
715
+ )
716
+ );
572
717
  }
573
718
 
574
719
  height: var(--_ctm-mob-lt-rw-ht, var(--_ctm-tab-lt-rw-ht, var(--_ctm-lt-rw-ht)));
575
720
 
576
721
  .td__col__divider {
577
- padding: var(--_ctm-mob-lt-rw-cl-pg,
578
- var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-lt-rw-cl-pg)));
579
-
580
- color: var(--_sf-hr-fc,
581
- var(--_ctm-mob-dn-rw-tt-cr,
582
- var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr))));
583
-
584
- font-family: var(--_sf-hr-ff,
585
- var(--_ctm-mob-dn-rw-tt-ft-fy,
586
- var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))));
587
- text-transform: var(--_sf-hr-tt-tm,
588
- var(--_ctm-mob-dn-rw-tt-tt-tm,
589
- var(--_ctm-tab-dn-rw-tt-tt-tm, var(--_ctm-dn-rw-tt-tt-tm))));
590
- word-wrap: var(--_sf-hr-wd-wp,
591
- var(--_ctm-mob-dn-rw-tt-wd-wp,
592
- var(--_ctm-tab-dn-rw-tt-wd-wp, var(--_ctm-dn-rw-tt-wd-wp))));
593
- word-break: var(--_sf-hr-wd-bk,
594
- var(--_ctm-mob-dn-rw-tt-wd-bk,
595
- var(--_ctm-tab-dn-rw-tt-wd-bk, var(--_ctm-dn-rw-tt-wd-bk))));
596
-
597
- font-size: var(--_sf-hr-fs,
598
- var(--_ctm-mob-dn-rw-tt-ft-se,
599
- var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))));
600
-
601
- text-decoration: var(--_ctm-mob-dn-rw-tt-ue,
602
- var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue)));
603
-
604
- font-weight: var(--_sf-hr-fw,
605
- var(--_ctm-mob-dn-rw-tt-ft-wt,
606
- var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))));
607
-
608
- font-style: var(--_sf-hr-ft,
609
- var(--_ctm-mob-dn-rw-tt-ft-se-ic,
610
- var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))));
611
-
612
- text-align: var(--_sf-hr-ta,
613
- var(--_ctm-mob-dn-rw-tt-tt-an,
614
- var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))));
615
-
616
- letter-spacing: var(--_sf-hr-ls,
617
- var(--_ctm-mob-dn-rw-tt-lr-sg,
618
- var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))));
619
-
620
- line-height: var(--_sf-hr-lh,
621
- var(--_ctm-mob-dn-rw-tt-le-ht,
622
- var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))));
722
+ padding: var(
723
+ --_ctm-mob-lt-rw-cl-pg,
724
+ var(--_ctm-tab-lt-rw-cl-pg, var(--_ctm-lt-rw-cl-pg))
725
+ );
726
+
727
+ color: var(
728
+ --_sf-hr-fc,
729
+ var(
730
+ --_ctm-mob-dn-rw-tt-cr,
731
+ var(--_ctm-tab-dn-rw-tt-cr, var(--_ctm-dn-rw-tt-cr))
732
+ )
733
+ );
734
+
735
+ font-family: var(
736
+ --_sf-hr-ff,
737
+ var(
738
+ --_ctm-mob-dn-rw-tt-ft-fy,
739
+ var(--_ctm-tab-dn-rw-tt-ft-fy, var(--_ctm-dn-rw-tt-ft-fy))
740
+ )
741
+ );
742
+ text-transform: var(
743
+ --_sf-hr-tt-tm,
744
+ var(
745
+ --_ctm-mob-dn-rw-tt-tt-tm,
746
+ var(--_ctm-tab-dn-rw-tt-tt-tm, var(--_ctm-dn-rw-tt-tt-tm))
747
+ )
748
+ );
749
+ word-wrap: var(
750
+ --_sf-hr-wd-wp,
751
+ var(
752
+ --_ctm-mob-dn-rw-tt-wd-wp,
753
+ var(--_ctm-tab-dn-rw-tt-wd-wp, var(--_ctm-dn-rw-tt-wd-wp))
754
+ )
755
+ );
756
+ word-break: var(
757
+ --_sf-hr-wd-bk,
758
+ var(
759
+ --_ctm-mob-dn-rw-tt-wd-bk,
760
+ var(--_ctm-tab-dn-rw-tt-wd-bk, var(--_ctm-dn-rw-tt-wd-bk))
761
+ )
762
+ );
763
+
764
+ font-size: var(
765
+ --_sf-hr-fs,
766
+ var(
767
+ --_ctm-mob-dn-rw-tt-ft-se,
768
+ var(--_ctm-tab-dn-rw-tt-ft-se, var(--_ctm-dn-rw-tt-ft-se))
769
+ )
770
+ );
771
+
772
+ text-decoration: var(
773
+ --_ctm-mob-dn-rw-tt-ue,
774
+ var(--_ctm-tab-dn-rw-tt-ue, var(--_ctm-dn-rw-tt-ue))
775
+ );
776
+
777
+ font-weight: var(
778
+ --_sf-hr-fw,
779
+ var(
780
+ --_ctm-mob-dn-rw-tt-ft-wt,
781
+ var(--_ctm-tab-dn-rw-tt-ft-wt, var(--_ctm-dn-rw-tt-ft-wt))
782
+ )
783
+ );
784
+
785
+ font-style: var(
786
+ --_sf-hr-ft,
787
+ var(
788
+ --_ctm-mob-dn-rw-tt-ft-se-ic,
789
+ var(--_ctm-tab-dn-rw-tt-ft-se-ic, var(--_ctm-dn-rw-tt-ft-se-ic))
790
+ )
791
+ );
792
+
793
+ text-align: var(
794
+ --_sf-hr-ta,
795
+ var(
796
+ --_ctm-mob-dn-rw-tt-tt-an,
797
+ var(--_ctm-tab-dn-rw-tt-tt-an, var(--_ctm-dn-rw-tt-tt-an))
798
+ )
799
+ );
800
+
801
+ letter-spacing: var(
802
+ --_sf-hr-ls,
803
+ var(
804
+ --_ctm-mob-dn-rw-tt-lr-sg,
805
+ var(--_ctm-tab-dn-rw-tt-lr-sg, var(--_ctm-dn-rw-tt-lr-sg))
806
+ )
807
+ );
808
+
809
+ line-height: var(
810
+ --_sf-hr-lh,
811
+ var(
812
+ --_ctm-mob-dn-rw-tt-le-ht,
813
+ var(--_ctm-tab-dn-rw-tt-le-ht, var(--_ctm-dn-rw-tt-le-ht))
814
+ )
815
+ );
623
816
  }
624
817
  }
625
818
  }
@@ -628,13 +821,18 @@ $resizeActive: '[data-cms-element-resizer="true"]';
628
821
  .pagination {
629
822
  display: var(--_d-flex);
630
823
  align-items: var(--_align-center);
631
- justify-content: var(--_ctm-mob-lt-pn-at,
632
- var(--_ctm-tab-lt-pn-at, var(--_ctm-lt-pn-at)));
824
+ justify-content: var(
825
+ --_ctm-mob-lt-pn-at,
826
+ var(--_ctm-tab-lt-pn-at, var(--_ctm-lt-pn-at))
827
+ );
633
828
  margin-top: 10px;
634
- background-color: var(--_sf-bd-cr,
635
- var(--_ctm-mob-dn-pn-dt-se-bd-cr,
636
- var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))));
637
-
829
+ background-color: var(
830
+ --_sf-bd-cr,
831
+ var(
832
+ --_ctm-mob-dn-pn-dt-se-bd-cr,
833
+ var(--_ctm-tab-dn-pn-dt-se-bd-cr, var(--_ctm-dn-pn-dt-se-bd-cr))
834
+ )
835
+ );
638
836
  &.pagination__center {
639
837
  justify-content: var(justify-center);
640
838
  }
@@ -645,27 +843,48 @@ $resizeActive: '[data-cms-element-resizer="true"]';
645
843
  border-style: prepareMediaVariable(--_ctm-dn-pn-dt-se-br-se, none);
646
844
  border-width: prepareMediaVariable(--_ctm-dn-pn-dt-se-br-wh, 0);
647
845
  border-radius: prepareMediaVariable(--_ctm-dn-pn-dt-se-br-rs, 0);
648
- box-shadow: var(--_show-shadow,
649
- prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-ae, 0) prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-br, 0) prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-sd, 0) prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-cr, transparent));
846
+ box-shadow: var(
847
+ --_show-shadow,
848
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-ae, 0)
849
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-br, 0)
850
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-sd, 0)
851
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-sw-cr, transparent)
852
+ );
650
853
 
651
854
  &:hover {
652
- background-color: var(--_sf-bd-cr,
653
- prepareMediaVariable(--_ctm-dn-pn-hr-se-bd-cr,
654
- prepareMediaVariable(--_ctm-dn-pn-dt-se-bd-cr)));
655
- border-color: prepareMediaVariable(--_ctm-dn-pn-hr-se-br-cr,
656
- prepareMediaVariable(--_ctm-dn-pn-dt-se-br-cr));
657
- border-style: prepareMediaVariable(--_ctm-dn-pn-hr-se-br-se,
658
- prepareMediaVariable(--_ctm-dn-pn-dt-se-br-se, none));
659
- border-width: prepareMediaVariable(--_ctm-dn-pn-hr-se-br-wh,
660
- prepareMediaVariable(--_ctm-dn-pn-dt-se-br-wh, 0));
661
- border-radius: prepareMediaVariable(--_ctm-dn-pn-hr-se-br-rs,
662
- prepareMediaVariable(--_ctm-dn-pn-dt-se-br-rs, 0));
663
- box-shadow: var(--_show-shadow,
664
- prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-ae, 0) prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-br, 0) prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-sd, 0) prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-cr, transparent));
855
+ background-color: var(
856
+ --_sf-bd-cr,
857
+ prepareMediaVariable(
858
+ --_ctm-dn-pn-hr-se-bd-cr,
859
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-bd-cr)
860
+ )
861
+ );
862
+ border-color: prepareMediaVariable(
863
+ --_ctm-dn-pn-hr-se-br-cr,
864
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-br-cr)
865
+ );
866
+ border-style: prepareMediaVariable(
867
+ --_ctm-dn-pn-hr-se-br-se,
868
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-br-se, none)
869
+ );
870
+ border-width: prepareMediaVariable(
871
+ --_ctm-dn-pn-hr-se-br-wh,
872
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-br-wh, 0)
873
+ );
874
+ border-radius: prepareMediaVariable(
875
+ --_ctm-dn-pn-hr-se-br-rs,
876
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-br-rs, 0)
877
+ );
878
+ box-shadow: var(
879
+ --_show-shadow,
880
+ prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-ae, 0)
881
+ prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-br, 0)
882
+ prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-sd, 0)
883
+ prepareMediaVariable(--_ctm-dn-pn-hr-se-sw-cr, transparent)
884
+ );
665
885
  }
666
886
 
667
887
  button {
668
-
669
888
  // Default glyph shows, hover glyph waits. Both are in the DOM so the
670
889
  // swap costs no re-render; when no hover icon is picked the renderer
671
890
  // falls back to the default one, so the pair looks identical.
@@ -694,7 +913,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
694
913
  // pinned to a hardcoded 18px and grey, so neither control did anything.
695
914
  width: prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se, 18px);
696
915
  height: prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se, 18px);
697
-
698
916
  path {
699
917
  stroke: prepareMediaVariable(--_ctm-dn-pn-dt-se-in-c1, var(--_gray-500));
700
918
  // Overrides the stroke-width presentation attribute baked into the icon markup.
@@ -703,23 +921,26 @@ $resizeActive: '[data-cms-element-resizer="true"]';
703
921
  }
704
922
 
705
923
  &:hover svg {
706
- width: prepareMediaVariable(--_ctm-dn-pn-hr-se-in-se,
707
- prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se, 18px));
708
- height: prepareMediaVariable(--_ctm-dn-pn-hr-se-in-se,
709
- prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se, 18px));
710
-
924
+ width: prepareMediaVariable(
925
+ --_ctm-dn-pn-hr-se-in-se,
926
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se, 18px)
927
+ );
928
+ height: prepareMediaVariable(
929
+ --_ctm-dn-pn-hr-se-in-se,
930
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se, 18px)
931
+ );
711
932
  path {
712
- stroke: prepareMediaVariable(--_ctm-dn-pn-hr-se-in-c1,
713
- prepareMediaVariable(--_ctm-dn-pn-dt-se-in-c1, var(--_gray-500)));
933
+ stroke: prepareMediaVariable(
934
+ --_ctm-dn-pn-hr-se-in-c1,
935
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-in-c1, var(--_gray-500))
936
+ );
714
937
  }
715
938
  }
716
939
  }
717
-
718
940
  span {
719
941
  float: left;
720
942
  padding: var(--_pd-8) var(--_pd-16);
721
943
  text-decoration: none;
722
-
723
944
  span {
724
945
  // color: var(--_sf-hr-fc, var(--_ctm-dn-pn-bn-cr, var(--_tst-dn-pn-bn-cr)));
725
946
  // font-size: var(--_sf-hr-fs, var(--_ctm-dn-pn-ft-se, var(--_tst-dn-pn-ft-se)));
@@ -731,7 +952,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
731
952
  // letter-spacing: var(--_sf-hr-ls, var(--_ctm-dn-pn-lr-sg, var(--_tst-dn-pn-lr-sg)));
732
953
  // line-height: var(--_sf-hr-lh, var(--_ctm-dn-pn-le-ht, var(--_tst-dn-pn-le-ht)));
733
954
  }
734
-
735
955
  &.active:hover {
736
956
  &hover {
737
957
  --_sf-hr-fc: var(--_ctm-dn-pn-hr-se-cr, var(--_tst-dn-pn-hr-se-cr));
@@ -747,55 +967,101 @@ $resizeActive: '[data-cms-element-resizer="true"]';
747
967
  --_sf-hr-lh: var(--_ctm-dn-pn-hr-se-le-ht, var(--_tst-dn-pn-hr-se-le-ht));
748
968
  }
749
969
  }
750
-
751
970
  &.active {
752
- color: var(--_sf-hr-fc,
753
- var(--_ctm-mob-dn-pn-dt-se-cr,
754
- var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr))));
755
-
756
- font-family: var(--_sf-hr-ff,
757
- var(--_ctm-mob-dn-pn-dt-se-ft-fy,
758
- var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))));
759
- text-transform: var(--_sf-hr-tt-tm,
760
- var(--_ctm-mob-dn-pn-dt-se-tt-tm,
761
- var(--_ctm-tab-dn-pn-dt-se-tt-tm, var(--_ctm-dn-pn-dt-se-tt-tm))));
762
- word-wrap: var(--_sf-hr-wd-wp,
763
- var(--_ctm-mob-dn-pn-dt-se-wd-wp,
764
- var(--_ctm-tab-dn-pn-dt-se-wd-wp, var(--_ctm-dn-pn-dt-se-wd-wp))));
765
- word-break: var(--_sf-hr-wd-bk,
766
- var(--_ctm-mob-dn-pn-dt-se-wd-bk,
767
- var(--_ctm-tab-dn-pn-dt-se-wd-bk, var(--_ctm-dn-pn-dt-se-wd-bk))));
768
-
769
- font-size: var(--_sf-hr-fs,
770
- var(--_ctm-mob-dn-pn-dt-se-ft-se,
771
- var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))));
772
-
773
- text-decoration: var(--_sf-hr-td,
774
- var(--_ctm-mob-dn-pn-dt-se-ue,
775
- var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue))));
776
-
777
- font-weight: var(--_sf-hr-fw,
778
- var(--_ctm-mob-dn-pn-dt-se-ft-wt,
779
- var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))));
780
-
781
- font-style: var(--_sf-hr-ft,
782
- var(--_ctm-mob-dn-pn-dt-se-ft-se-ic,
783
- var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))));
784
-
785
- text-align: var(--_sf-hr-ta,
786
- var(--_ctm-mob-dn-pn-dt-se-tt-an,
787
- var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))));
788
-
789
- letter-spacing: var(--_sf-hr-ls,
790
- var(--_ctm-mob-dn-pn-dt-se-lr-sg,
791
- var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))));
792
-
793
- line-height: var(--_sf-hr-lh,
794
- var(--_ctm-mob-dn-pn-dt-se-le-ht,
795
- var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))));
971
+ color: var(
972
+ --_sf-hr-fc,
973
+ var(
974
+ --_ctm-mob-dn-pn-dt-se-cr,
975
+ var(--_ctm-tab-dn-pn-dt-se-cr, var(--_ctm-dn-pn-dt-se-cr))
976
+ )
977
+ );
978
+
979
+ font-family: var(
980
+ --_sf-hr-ff,
981
+ var(
982
+ --_ctm-mob-dn-pn-dt-se-ft-fy,
983
+ var(--_ctm-tab-dn-pn-dt-se-ft-fy, var(--_ctm-dn-pn-dt-se-ft-fy))
984
+ )
985
+ );
986
+ text-transform: var(
987
+ --_sf-hr-tt-tm,
988
+ var(
989
+ --_ctm-mob-dn-pn-dt-se-tt-tm,
990
+ var(--_ctm-tab-dn-pn-dt-se-tt-tm, var(--_ctm-dn-pn-dt-se-tt-tm))
991
+ )
992
+ );
993
+ word-wrap: var(
994
+ --_sf-hr-wd-wp,
995
+ var(
996
+ --_ctm-mob-dn-pn-dt-se-wd-wp,
997
+ var(--_ctm-tab-dn-pn-dt-se-wd-wp, var(--_ctm-dn-pn-dt-se-wd-wp))
998
+ )
999
+ );
1000
+ word-break: var(
1001
+ --_sf-hr-wd-bk,
1002
+ var(
1003
+ --_ctm-mob-dn-pn-dt-se-wd-bk,
1004
+ var(--_ctm-tab-dn-pn-dt-se-wd-bk, var(--_ctm-dn-pn-dt-se-wd-bk))
1005
+ )
1006
+ );
1007
+
1008
+ font-size: var(
1009
+ --_sf-hr-fs,
1010
+ var(
1011
+ --_ctm-mob-dn-pn-dt-se-ft-se,
1012
+ var(--_ctm-tab-dn-pn-dt-se-ft-se, var(--_ctm-dn-pn-dt-se-ft-se))
1013
+ )
1014
+ );
1015
+
1016
+ text-decoration: var(
1017
+ --_sf-hr-td,
1018
+ var(
1019
+ --_ctm-mob-dn-pn-dt-se-ue,
1020
+ var(--_ctm-tab-dn-pn-dt-se-ue, var(--_ctm-dn-pn-dt-se-ue))
1021
+ )
1022
+ );
1023
+
1024
+ font-weight: var(
1025
+ --_sf-hr-fw,
1026
+ var(
1027
+ --_ctm-mob-dn-pn-dt-se-ft-wt,
1028
+ var(--_ctm-tab-dn-pn-dt-se-ft-wt, var(--_ctm-dn-pn-dt-se-ft-wt))
1029
+ )
1030
+ );
1031
+
1032
+ font-style: var(
1033
+ --_sf-hr-ft,
1034
+ var(
1035
+ --_ctm-mob-dn-pn-dt-se-ft-se-ic,
1036
+ var(--_ctm-tab-dn-pn-dt-se-ft-se-ic, var(--_ctm-dn-pn-dt-se-ft-se-ic))
1037
+ )
1038
+ );
1039
+
1040
+ text-align: var(
1041
+ --_sf-hr-ta,
1042
+ var(
1043
+ --_ctm-mob-dn-pn-dt-se-tt-an,
1044
+ var(--_ctm-tab-dn-pn-dt-se-tt-an, var(--_ctm-dn-pn-dt-se-tt-an))
1045
+ )
1046
+ );
1047
+
1048
+ letter-spacing: var(
1049
+ --_sf-hr-ls,
1050
+ var(
1051
+ --_ctm-mob-dn-pn-dt-se-lr-sg,
1052
+ var(--_ctm-tab-dn-pn-dt-se-lr-sg, var(--_ctm-dn-pn-dt-se-lr-sg))
1053
+ )
1054
+ );
1055
+
1056
+ line-height: var(
1057
+ --_sf-hr-lh,
1058
+ var(
1059
+ --_ctm-mob-dn-pn-dt-se-le-ht,
1060
+ var(--_ctm-tab-dn-pn-dt-se-le-ht, var(--_ctm-dn-pn-dt-se-le-ht))
1061
+ )
1062
+ );
796
1063
  }
797
1064
  }
798
-
799
1065
  // Same wrong path as the svg rule above: the icon variables carry the
800
1066
  // section's state segment. Only the "next" button has this class in the
801
1067
  // markup, so the svg rules are what actually style both arrows — these are
@@ -805,10 +1071,14 @@ $resizeActive: '[data-cms-element-resizer="true"]';
805
1071
  font-size: prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se);
806
1072
 
807
1073
  &:hover {
808
- color: prepareMediaVariable(--_ctm-dn-pn-hr-se-in-c1,
809
- prepareMediaVariable(--_ctm-dn-pn-dt-se-in-c1));
810
- font-size: prepareMediaVariable(--_ctm-dn-pn-hr-se-in-se,
811
- prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se));
1074
+ color: prepareMediaVariable(
1075
+ --_ctm-dn-pn-hr-se-in-c1,
1076
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-in-c1)
1077
+ );
1078
+ font-size: prepareMediaVariable(
1079
+ --_ctm-dn-pn-hr-se-in-se,
1080
+ prepareMediaVariable(--_ctm-dn-pn-dt-se-in-se)
1081
+ );
812
1082
  }
813
1083
  }
814
1084
  }
@@ -840,7 +1110,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
840
1110
  // font-weight: 400;
841
1111
  // line-height: 24px;
842
1112
  width: 100%;
843
-
844
1113
  &:nth-of-type(1) {
845
1114
  color: prepareMediaVariable(--_ctm-dn-te-cr);
846
1115
  font-family: prepareMediaVariable(--_ctm-dn-te-ft-fy);
@@ -855,7 +1124,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
855
1124
  line-height: prepareMediaVariable(--_ctm-dn-te-le-ht);
856
1125
  text-decoration: prepareMediaVariable(--_ctm-dn-te-ue);
857
1126
  }
858
-
859
1127
  &:nth-of-type(2) {
860
1128
  color: prepareMediaVariable(--_ctm-dn-dn-cr);
861
1129
  font-family: prepareMediaVariable(--_ctm-dn-dn-ft-fy);
@@ -906,99 +1174,149 @@ $resizeActive: '[data-cms-element-resizer="true"]';
906
1174
  }
907
1175
  }
908
1176
  }
909
-
910
1177
  .btn__with__text[data-btn-name="loadMore"] {
911
1178
  &[data-show-shadow="false"] {
912
1179
  --_show-shadow: none;
913
1180
  }
914
-
915
1181
  &[data-icon-position="left"] {
916
1182
  --_sf-fd-bn: row;
917
1183
  }
918
-
919
1184
  &[data-icon-position="right"] {
920
1185
  --_sf-fd-bn: row-reverse;
921
1186
  }
922
-
923
1187
  &[data-icon-position="center"] {
924
1188
  --_sf-fd-bn: row;
925
1189
  }
926
1190
 
927
1191
  &:hover {
928
- --_sf-hr-bd-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-bd-cr,
929
- var(--_ctm-tab-dn-ld-me-bn-hr-se-bd-cr, var(--_ctm-dn-ld-me-bn-hr-se-bd-cr)));
930
- --_sf-hr-br-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-cr,
931
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-cr, var(--_ctm-dn-ld-me-bn-hr-se-br-cr)));
932
- --_sf-hr-br-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-se,
933
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-se, var(--_ctm-dn-ld-me-bn-hr-se-br-se)));
934
- --_sf-hr-br-wh: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-wh,
935
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-wh, var(--_ctm-dn-ld-me-bn-hr-se-br-wh)));
936
- --_sf-hr-br-rs: var(--_ctm-mob-dn-ld-me-bn-hr-se-br-rs,
937
- var(--_ctm-tab-dn-ld-me-bn-hr-se-br-rs, var(--_ctm-dn-ld-me-bn-hr-se-br-rs)));
938
- --_sf-hr-at: var(--_ctm-mob-dn-ld-me-bn-hr-se-at,
939
- var(--_ctm-tab-dn-ld-me-bn-hr-se-at, var(--_ctm-dn-ld-me-bn-hr-se-at)));
940
- --_sf-hr-gp: var(--_ctm-mob-dn-ld-me-bn-hr-se-gp,
941
- var(--_ctm-tab-dn-ld-me-bn-hr-se-gp, var(--_ctm-dn-ld-me-bn-hr-se-gp)));
1192
+ --_sf-hr-bd-cr: var(
1193
+ --_ctm-mob-dn-ld-me-bn-hr-se-bd-cr,
1194
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-bd-cr, var(--_ctm-dn-ld-me-bn-hr-se-bd-cr))
1195
+ );
1196
+ --_sf-hr-br-cr: var(
1197
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-cr,
1198
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-cr, var(--_ctm-dn-ld-me-bn-hr-se-br-cr))
1199
+ );
1200
+ --_sf-hr-br-se: var(
1201
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-se,
1202
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-se, var(--_ctm-dn-ld-me-bn-hr-se-br-se))
1203
+ );
1204
+ --_sf-hr-br-wh: var(
1205
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-wh,
1206
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-wh, var(--_ctm-dn-ld-me-bn-hr-se-br-wh))
1207
+ );
1208
+ --_sf-hr-br-rs: var(
1209
+ --_ctm-mob-dn-ld-me-bn-hr-se-br-rs,
1210
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-br-rs, var(--_ctm-dn-ld-me-bn-hr-se-br-rs))
1211
+ );
1212
+ --_sf-hr-at: var(
1213
+ --_ctm-mob-dn-ld-me-bn-hr-se-at,
1214
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-at, var(--_ctm-dn-ld-me-bn-hr-se-at))
1215
+ );
1216
+ --_sf-hr-gp: var(
1217
+ --_ctm-mob-dn-ld-me-bn-hr-se-gp,
1218
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-gp, var(--_ctm-dn-ld-me-bn-hr-se-gp))
1219
+ );
942
1220
 
943
1221
  // for shadow
944
- --_sf-hr-sw-ae: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-ae,
945
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-ae, var(--_ctm-dn-ld-me-bn-hr-se-sw-ae)));
946
- --_sf-hr-sw-br: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-br,
947
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-br, var(--_ctm-dn-ld-me-bn-hr-se-sw-br)));
948
- --_sf-hr-sw-hr: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-hr,
949
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-hr, var(--_ctm-dn-ld-me-bn-hr-se-sw-hr)));
950
- --_sf-hr-sw-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-sw-cr,
951
- var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-cr, var(--_ctm-dn-ld-me-bn-hr-se-sw-cr)));
1222
+ --_sf-hr-sw-ae: var(
1223
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-ae,
1224
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-ae, var(--_ctm-dn-ld-me-bn-hr-se-sw-ae))
1225
+ );
1226
+ --_sf-hr-sw-br: var(
1227
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-br,
1228
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-br, var(--_ctm-dn-ld-me-bn-hr-se-sw-br))
1229
+ );
1230
+ --_sf-hr-sw-hr: var(
1231
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-hr,
1232
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-hr, var(--_ctm-dn-ld-me-bn-hr-se-sw-hr))
1233
+ );
1234
+ --_sf-hr-sw-cr: var(
1235
+ --_ctm-mob-dn-ld-me-bn-hr-se-sw-cr,
1236
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-sw-cr, var(--_ctm-dn-ld-me-bn-hr-se-sw-cr))
1237
+ );
952
1238
 
953
1239
  // for font
954
1240
 
955
- --_sf-hr-cr: var(--_ctm-mob-dn-ld-me-bn-hr-se-cr,
956
- var(--_ctm-tab-dn-ld-me-bn-hr-se-cr, var(--_ctm-dn-ld-me-bn-hr-se-cr)));
957
- --_sf-hr-ft-fy: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-fy,
958
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-fy, var(--_ctm-dn-ld-me-bn-hr-se-ft-fy)));
959
- --_sf-hr-tt-tm: var(--_ctm-mob-dn-ld-me-bn-hr-se-tt-tm,
960
- var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-tm, var(--_ctm-dn-ld-me-bn-hr-se-tt-tm)));
961
- --_sf-hr-wd-wp: var(--_ctm-mob-dn-ld-me-bn-hr-se-wd-wp,
962
- var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-wp, var(--_ctm-dn-ld-me-bn-hr-se-wd-wp)));
963
- --_sf-hr-wd-bk: var(--_ctm-mob-dn-ld-me-bn-hr-se-wd-bk,
964
- var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-bk, var(--_ctm-dn-ld-me-bn-hr-se-wd-bk)));
965
- --_sf-hr-ft-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-se,
966
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se, var(--_ctm-dn-ld-me-bn-hr-se-ft-se)));
967
- --_sf-hr-ft-wt: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-wt,
968
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-wt, var(--_ctm-dn-ld-me-bn-hr-se-ft-wt)));
969
- --_sf-hr-ft-se-ic: var(--_ctm-mob-dn-ld-me-bn-hr-se-ft-se-ic,
970
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se-ic, var(--_ctm-dn-ld-me-bn-hr-se-ft-se-ic)));
971
- --_sf-hr-tt-an: var(--_ctm-mob-dn-ld-me-bn-hr-se-tt-an,
972
- var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-an, var(--_ctm-dn-ld-me-bn-hr-se-tt-an)));
973
- --_sf-hr-lr-sg: var(--_ctm-mob-dn-ld-me-bn-hr-se-lr-sg,
974
- var(--_ctm-tab-dn-ld-me-bn-hr-se-lr-sg, var(--_ctm-dn-ld-me-bn-hr-se-lr-sg)));
975
- --_sf-hr-le-ht: var(--_ctm-mob-dn-ld-me-bn-hr-se-le-ht,
976
- var(--_ctm-tab-dn-ld-me-bn-hr-se-le-ht, var(--_ctm-dn-ld-me-bn-hr-se-le-ht)));
977
-
978
- --_sf-hr-in-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-in-se,
979
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se)));
980
- --_sf-hr-in-se: var(--_ctm-mob-dn-ld-me-bn-hr-se-in-se,
981
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se)));
982
- --_sf-hr-in-c1: var(--_ctm-mob-dn-ld-me-bn-hr-se-in-c1,
983
- var(--_ctm-tab-dn-ld-me-bn-hr-se-in-c1, var(--_ctm-dn-ld-me-bn-hr-se-in-c1)));
984
- --_sf-hr-ue: var(--_ctm-mob-dn-ld-me-bn-hr-se-ue,
985
- var(--_ctm-tab-dn-ld-me-bn-hr-se-ue, var(--_ctm-dn-ld-me-bn-hr-se-ue)));
1241
+ --_sf-hr-cr: var(
1242
+ --_ctm-mob-dn-ld-me-bn-hr-se-cr,
1243
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-cr, var(--_ctm-dn-ld-me-bn-hr-se-cr))
1244
+ );
1245
+ --_sf-hr-ft-fy: var(
1246
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-fy,
1247
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-fy, var(--_ctm-dn-ld-me-bn-hr-se-ft-fy))
1248
+ );
1249
+ --_sf-hr-tt-tm: var(
1250
+ --_ctm-mob-dn-ld-me-bn-hr-se-tt-tm,
1251
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-tm, var(--_ctm-dn-ld-me-bn-hr-se-tt-tm))
1252
+ );
1253
+ --_sf-hr-wd-wp: var(
1254
+ --_ctm-mob-dn-ld-me-bn-hr-se-wd-wp,
1255
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-wp, var(--_ctm-dn-ld-me-bn-hr-se-wd-wp))
1256
+ );
1257
+ --_sf-hr-wd-bk: var(
1258
+ --_ctm-mob-dn-ld-me-bn-hr-se-wd-bk,
1259
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-wd-bk, var(--_ctm-dn-ld-me-bn-hr-se-wd-bk))
1260
+ );
1261
+ --_sf-hr-ft-se: var(
1262
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-se,
1263
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se, var(--_ctm-dn-ld-me-bn-hr-se-ft-se))
1264
+ );
1265
+ --_sf-hr-ft-wt: var(
1266
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-wt,
1267
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-wt, var(--_ctm-dn-ld-me-bn-hr-se-ft-wt))
1268
+ );
1269
+ --_sf-hr-ft-se-ic: var(
1270
+ --_ctm-mob-dn-ld-me-bn-hr-se-ft-se-ic,
1271
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ft-se-ic, var(--_ctm-dn-ld-me-bn-hr-se-ft-se-ic))
1272
+ );
1273
+ --_sf-hr-tt-an: var(
1274
+ --_ctm-mob-dn-ld-me-bn-hr-se-tt-an,
1275
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-tt-an, var(--_ctm-dn-ld-me-bn-hr-se-tt-an))
1276
+ );
1277
+ --_sf-hr-lr-sg: var(
1278
+ --_ctm-mob-dn-ld-me-bn-hr-se-lr-sg,
1279
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-lr-sg, var(--_ctm-dn-ld-me-bn-hr-se-lr-sg))
1280
+ );
1281
+ --_sf-hr-le-ht: var(
1282
+ --_ctm-mob-dn-ld-me-bn-hr-se-le-ht,
1283
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-le-ht, var(--_ctm-dn-ld-me-bn-hr-se-le-ht))
1284
+ );
1285
+
1286
+ --_sf-hr-in-se: var(
1287
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
1288
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
1289
+ );
1290
+ --_sf-hr-in-se: var(
1291
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-se,
1292
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-se, var(--_ctm-dn-ld-me-bn-hr-se-in-se))
1293
+ );
1294
+ --_sf-hr-in-c1: var(
1295
+ --_ctm-mob-dn-ld-me-bn-hr-se-in-c1,
1296
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-in-c1, var(--_ctm-dn-ld-me-bn-hr-se-in-c1))
1297
+ );
1298
+ --_sf-hr-ue: var(
1299
+ --_ctm-mob-dn-ld-me-bn-hr-se-ue,
1300
+ var(--_ctm-tab-dn-ld-me-bn-hr-se-ue, var(--_ctm-dn-ld-me-bn-hr-se-ue))
1301
+ );
986
1302
 
987
1303
  // for pading and width
988
- --_sf-hr-pg: var(--_ctm-mob-dn-ld-me-bn-hr-pg,
989
- var(--_ctm-tab-dn-ld-me-bn-hr-pg, var(--_ctm-dn-ld-me-bn-hr-pg)));
990
- --_sf-hr-wh: var(--_ctm-mob-dn-ld-me-bn-hr-wh,
991
- var(--_ctm-tab-dn-ld-me-bn-hr-wh, var(--_ctm-dn-ld-me-bn-hr-wh)));
1304
+ --_sf-hr-pg: var(
1305
+ --_ctm-mob-dn-ld-me-bn-hr-pg,
1306
+ var(--_ctm-tab-dn-ld-me-bn-hr-pg, var(--_ctm-dn-ld-me-bn-hr-pg))
1307
+ );
1308
+ --_sf-hr-wh: var(
1309
+ --_ctm-mob-dn-ld-me-bn-hr-wh,
1310
+ var(--_ctm-tab-dn-ld-me-bn-hr-wh, var(--_ctm-dn-ld-me-bn-hr-wh))
1311
+ );
992
1312
 
993
1313
  &[data-hover-show-shadow="false"] {
994
1314
  --_hover-show-shadow: none;
995
1315
  }
996
-
997
1316
  &[data-hover-show-icon="false"] {
998
1317
  --_hover-show-icon: none;
999
1318
  }
1000
1319
  }
1001
-
1002
1320
  background-color: var(--_sf-hr-bd-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-bd-cr));
1003
1321
 
1004
1322
  padding: var(--_sf-hr-pg, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-pg));
@@ -1012,7 +1330,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1012
1330
 
1013
1331
  border-radius: var(--_sf-hr-br-rs, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-rs));
1014
1332
 
1015
- box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-ae)) var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-br)) var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-sd)) var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-cr));
1333
+ box-shadow: var(--_sf-hr-sw-ae, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-ae))
1334
+ var(--_sf-hr-sw-br, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-br))
1335
+ var(--_sf-hr-sw-sd, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-sd))
1336
+ var(--_sf-hr-sw-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-sw-cr));
1016
1337
 
1017
1338
  &[data-show-border="true"] {
1018
1339
  border-color: var(--_sf-hr-br-cr, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-br-cr));
@@ -1031,7 +1352,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1031
1352
  text-transform: var(--_sf-hr-tt-tm, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-tt-tm));
1032
1353
  word-wrap: var(--_sf-hr-wd-wp, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wd-wp));
1033
1354
  word-break: var(--_sf-hr-wd-bk, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-wd-bk));
1034
-
1035
1355
  &.flex__overflow {
1036
1356
  white-space: normal;
1037
1357
  @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
@@ -1041,8 +1361,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1041
1361
 
1042
1362
  font-weight: var(--_sf-hr-ft-wt, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-wt));
1043
1363
 
1044
- font-style: var(--_sf-hr-ft-se-ic,
1045
- prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se-ic));
1364
+ font-style: var(
1365
+ --_sf-hr-ft-se-ic,
1366
+ prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-ft-se-ic)
1367
+ );
1046
1368
 
1047
1369
  text-align: var(--_sf-hr-tt-an, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-tt-an));
1048
1370
 
@@ -1055,7 +1377,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1055
1377
 
1056
1378
  .icon {
1057
1379
  display: var(--_hover-show-icon, var(--_show-icon, flex));
1058
-
1059
1380
  svg {
1060
1381
  width: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
1061
1382
  height: var(--_sf-hr-in-se, prepareMediaVariable(--_ctm-dn-ld-me-bn-dt-se-in-se));
@@ -1067,7 +1388,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1067
1388
  }
1068
1389
  }
1069
1390
  }
1070
-
1071
1391
  [data-element-style="Text"] {
1072
1392
  display: inline-block;
1073
1393
  width: 100%;
@@ -1102,19 +1422,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1102
1422
  width: 100%;
1103
1423
  flex-direction: column;
1104
1424
  height: auto;
1105
-
1106
1425
  .slider_header_wrapper {
1107
1426
  display: flex;
1108
1427
  align-items: center;
1109
1428
  gap: 12px;
1110
1429
  justify-content: space-between;
1111
1430
  width: 100%;
1112
-
1113
1431
  .slider_header_wrapper_left {
1114
1432
  display: flex;
1115
1433
  align-items: center;
1116
1434
  gap: 12px;
1117
-
1118
1435
  // Stands in for the profile dropdown when there is only one
1119
1436
  // profile. Matches the heading beside it so the row reads as one line.
1120
1437
  .allocation_single_profile_name {
@@ -1141,7 +1458,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1141
1458
  display: flex;
1142
1459
  }
1143
1460
  }
1144
-
1145
1461
  .redeem_now_wrapper {
1146
1462
  .redeem_now_btn {
1147
1463
  display: flex;
@@ -1169,7 +1485,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1169
1485
  }
1170
1486
 
1171
1487
  .allocations_slider_slide_wrapper {
1172
-
1173
1488
  // Clicking an allocation selects it and its profile (it replaced the
1174
1489
  // Redeem button), so the whole slide is the hit area.
1175
1490
  &[data-is-clickable="true"] {
@@ -1223,7 +1538,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1223
1538
  }
1224
1539
  }
1225
1540
  }
1226
-
1227
1541
  .est__dropdown__main {
1228
1542
  position: relative;
1229
1543
  min-width: 150px;
@@ -1238,7 +1552,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1238
1552
 
1239
1553
  .est__dropdown {
1240
1554
  position: relative;
1241
-
1242
1555
  .est__dropdown__button {
1243
1556
  display: flex;
1244
1557
  align-items: center;
@@ -1279,7 +1592,7 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1279
1592
  --_sf-bmm-cr: #{prepareMediaVariable(--_ctm-dn-dn-st-hr-se-cr)};
1280
1593
  }
1281
1594
 
1282
- &>span {
1595
+ & > span {
1283
1596
  display: var(--_d-flex);
1284
1597
 
1285
1598
  &:nth-of-type(1) {
@@ -1294,11 +1607,15 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1294
1607
  word-break: var(--_sf-bmm-wd-bk, prepareMediaVariable(--_ctm-dn-dn-st-dt-se-wd-bk));
1295
1608
  font-size: var(--_sf-bmm-ft-se, prepareMediaVariable(--_ctm-dn-dn-st-dt-se-ft-se));
1296
1609
  font-weight: var(--_sf-bmm-ft-wt, (--_ctm-dn-dn-st-dt-se-ft-wt));
1297
- font-style: var(--_sf-bmm-ft-se-ic,
1298
- prepareMediaVariable(--_ctm-dn-dn-st-dt-se-ft-se-ic));
1610
+ font-style: var(
1611
+ --_sf-bmm-ft-se-ic,
1612
+ prepareMediaVariable(--_ctm-dn-dn-st-dt-se-ft-se-ic)
1613
+ );
1299
1614
  text-align: var(--_sf-bmm-tt-an, prepareMediaVariable(--_ctm-dn-dn-st-dt-se-tt-an));
1300
- letter-spacing: var(--_sf-bmm-lr-sg,
1301
- prepareMediaVariable(--_ctm-dn-dn-st-dt-se-lr-sg));
1615
+ letter-spacing: var(
1616
+ --_sf-bmm-lr-sg,
1617
+ prepareMediaVariable(--_ctm-dn-dn-st-dt-se-lr-sg)
1618
+ );
1302
1619
  line-height: var(--_sf-bmm-le-ht, prepareMediaVariable(--_ctm-dn-dn-st-dt-se-le-ht));
1303
1620
  text-decoration: var(--_sf-bmm-ue, prepareMediaVariable(--_ctm-dn-dn-st-dt-se-ue));
1304
1621
 
@@ -1360,44 +1677,75 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1360
1677
  // padding: 12px;
1361
1678
  cursor: pointer;
1362
1679
  // text-align: left;
1363
- border-color: var(--_sf-bmm-v1-br-clr,
1364
- #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-cr)});
1365
- border-width: var(--_sf-bmm-v1-br-wh,
1366
- #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-wh)});
1367
- border-style: var(--_sf-bmm-v1-br-se,
1368
- #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-se)});
1369
- border-radius: var(--_sf-bmm-v1-br-rs,
1370
- #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-rs)});
1371
-
1372
- background: var(--_sf-bmm-v1-bd-cr,
1373
- #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-bd-cr)});
1374
-
1375
- padding: var(--_sf-bmm-v1-pg,
1376
- #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-pg, 12px)});
1377
-
1378
- font-family: var(--_sf-bmm-v1-ft-fy,
1379
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ft-fy));
1380
- text-transform: var(--_sf-bmm-v1-tt-tm,
1381
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-tt-tm));
1382
- word-wrap: var(--_sf-bmm-v1-wd-wp,
1383
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-wd-wp));
1384
- word-break: var(--_sf-bmm-v1-wd-bk,
1385
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-wd-bk));
1680
+ border-color: var(
1681
+ --_sf-bmm-v1-br-clr,
1682
+ #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-cr)}
1683
+ );
1684
+ border-width: var(
1685
+ --_sf-bmm-v1-br-wh,
1686
+ #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-wh)}
1687
+ );
1688
+ border-style: var(
1689
+ --_sf-bmm-v1-br-se,
1690
+ #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-se)}
1691
+ );
1692
+ border-radius: var(
1693
+ --_sf-bmm-v1-br-rs,
1694
+ #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-br-rs)}
1695
+ );
1696
+
1697
+ background: var(
1698
+ --_sf-bmm-v1-bd-cr,
1699
+ #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-bd-cr)}
1700
+ );
1701
+
1702
+ padding: var(
1703
+ --_sf-bmm-v1-pg,
1704
+ #{prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-pg, 12px)}
1705
+ );
1706
+
1707
+ font-family: var(
1708
+ --_sf-bmm-v1-ft-fy,
1709
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ft-fy)
1710
+ );
1711
+ text-transform: var(
1712
+ --_sf-bmm-v1-tt-tm,
1713
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-tt-tm)
1714
+ );
1715
+ word-wrap: var(
1716
+ --_sf-bmm-v1-wd-wp,
1717
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-wd-wp)
1718
+ );
1719
+ word-break: var(
1720
+ --_sf-bmm-v1-wd-bk,
1721
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-wd-bk)
1722
+ );
1386
1723
  color: var(--_sf-bmm-v1-cr, prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-cr));
1387
- font-size: var(--_sf-bmm-v1-ft-se,
1388
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ft-se));
1724
+ font-size: var(
1725
+ --_sf-bmm-v1-ft-se,
1726
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ft-se)
1727
+ );
1389
1728
  font-weight: var(--_sf-bmm-v1-ft-wt, (--_ctm-dn-dn-lt-im-dt-se-ft-wt));
1390
- font-style: var(--_sf-bmm-v1-ft-se-ic,
1391
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ft-se-ic));
1392
- text-align: var(--_sf-bmm-v1-tt-an,
1393
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-tt-an));
1394
- letter-spacing: var(--_sf-bmm-v1-lr-sg,
1395
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-lr-sg));
1396
- line-height: var(--_sf-bmm-v1-le-ht,
1397
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-le-ht));
1398
- text-decoration: var(--_sf-bmm-v1-ue,
1399
- prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ue));
1400
-
1729
+ font-style: var(
1730
+ --_sf-bmm-v1-ft-se-ic,
1731
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ft-se-ic)
1732
+ );
1733
+ text-align: var(
1734
+ --_sf-bmm-v1-tt-an,
1735
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-tt-an)
1736
+ );
1737
+ letter-spacing: var(
1738
+ --_sf-bmm-v1-lr-sg,
1739
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-lr-sg)
1740
+ );
1741
+ line-height: var(
1742
+ --_sf-bmm-v1-le-ht,
1743
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-le-ht)
1744
+ );
1745
+ text-decoration: var(
1746
+ --_sf-bmm-v1-ue,
1747
+ prepareMediaVariable(--_ctm-dn-dn-lt-im-dt-se-ue)
1748
+ );
1401
1749
  &.selected {
1402
1750
  // background-color: var(--_primary-25);
1403
1751
  // color: var(--_primary-400);
@@ -1421,7 +1769,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1421
1769
 
1422
1770
  --_sf-bmm-v1-cr: #{prepareMediaVariable(--_ctm-dn-dn-lt-im-sd-se-cr)};
1423
1771
  }
1424
-
1425
1772
  &:hover {
1426
1773
  // background-color: var(--_primary-25);
1427
1774
  // color: var(--_primary-400);
@@ -1451,7 +1798,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1451
1798
  }
1452
1799
  }
1453
1800
  }
1454
-
1455
1801
  .embla {
1456
1802
  width: 100%;
1457
1803
  height: 100%;
@@ -1486,11 +1832,9 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1486
1832
  &[data-control-type="Bottom"][data-slider-control="Arrows"] {
1487
1833
  height: calc(100% - calc(var(--_ctm-dn-pn-as-aw-se) + 8px));
1488
1834
  }
1489
-
1490
1835
  &[data-control-type="Bottom"][data-slider-control="Pagination Line"] {
1491
1836
  height: calc(100% - calc(var(--_ctm-dn-pn-le-le-ht) + 20px));
1492
1837
  }
1493
-
1494
1838
  &[data-control-type="Bottom"][data-slider-control="Dots"] {
1495
1839
  height: calc(100% - calc(var(--_ctm-dn-pn-ds-dt-se) + 20px));
1496
1840
  }
@@ -1510,25 +1854,20 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1510
1854
  width: 100%;
1511
1855
  justify-content: space-between;
1512
1856
  transform: translate(-50%, -50%);
1513
-
1514
1857
  // padding-left: 20px;
1515
1858
  &[data-control-type="Side"] {
1516
-
1517
1859
  .left-button,
1518
1860
  .right-button {
1519
1861
  background-color: transparent;
1520
1862
  }
1521
1863
  }
1522
-
1523
1864
  &[data-background-shape="Round"] {
1524
-
1525
1865
  .left-button,
1526
1866
  .right-button {
1527
1867
  background-color: #f2f5f5;
1528
1868
  box-sizing: 0 4px 8px rgba(0, 0, 0, 0.1);
1529
1869
  }
1530
1870
  }
1531
-
1532
1871
  &[data-control-type="Bottom-Overflow"] {
1533
1872
  transform: translateX(-50%);
1534
1873
  width: 100%;
@@ -1537,7 +1876,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1537
1876
  top: unset;
1538
1877
  bottom: 6px;
1539
1878
  }
1540
-
1541
1879
  &[data-control-type="Bottom"] {
1542
1880
  transform: unset;
1543
1881
  position: static;
@@ -1546,7 +1884,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1546
1884
  gap: 12px;
1547
1885
  margin-top: 10px;
1548
1886
  }
1549
-
1550
1887
  .left-button {
1551
1888
  padding: 10px;
1552
1889
  border-radius: 50%;
@@ -1559,7 +1896,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1559
1896
  cursor: pointer;
1560
1897
  outline: none;
1561
1898
  margin-left: 12px;
1562
-
1563
1899
  &:disabled {
1564
1900
  & svg {
1565
1901
  path {
@@ -1568,7 +1904,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1568
1904
  }
1569
1905
  }
1570
1906
  }
1571
-
1572
1907
  .right-button {
1573
1908
  border-radius: 50%;
1574
1909
  border: none;
@@ -1590,14 +1925,11 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1590
1925
  }
1591
1926
  }
1592
1927
  }
1593
-
1594
1928
  .icon {
1595
1929
  display: flex;
1596
-
1597
1930
  svg {
1598
1931
  width: calc(var(--_ctm-dn-pn-as-aw-se) * 0.5);
1599
1932
  height: calc(var(--_ctm-dn-pn-as-aw-se) * 0.5);
1600
-
1601
1933
  path {
1602
1934
  stroke: var(--_ctm-dn-pn-as-aw-cr, var(--_tst-dn-pn-as-aw-cr));
1603
1935
  }
@@ -1608,11 +1940,9 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1608
1940
  &[data-thumbnail-placement="top"] {
1609
1941
  flex-direction: column-reverse;
1610
1942
  }
1611
-
1612
1943
  &[data-thumbnail-placement="bottom"] {
1613
1944
  flex-direction: column;
1614
1945
  }
1615
-
1616
1946
  &[data-thumbnail-placement="left"] {
1617
1947
  flex-direction: row-reverse;
1618
1948
 
@@ -1626,10 +1956,8 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1626
1956
  }
1627
1957
  }
1628
1958
  }
1629
-
1630
1959
  &[data-thumbnail-placement="right"] {
1631
1960
  flex-direction: row;
1632
-
1633
1961
  .embla__thumbs {
1634
1962
  width: var(--_ctm-lt-tl-se);
1635
1963
  height: 100%;
@@ -1640,19 +1968,16 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1640
1968
  }
1641
1969
  }
1642
1970
  }
1643
-
1644
1971
  &[data-control-type="Side"] {
1645
1972
  display: flex;
1646
1973
  align-self: center;
1647
1974
  gap: 16px;
1648
1975
  flex-direction: row;
1649
-
1650
1976
  .left-button:disabled,
1651
1977
  .right-button:disabled {
1652
1978
  display: none;
1653
1979
  }
1654
1980
  }
1655
-
1656
1981
  .embla__dots {
1657
1982
  display: flex;
1658
1983
  flex-wrap: wrap;
@@ -1669,7 +1994,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1669
1994
  transform: translateX(-50%);
1670
1995
  width: 75%;
1671
1996
  }
1672
-
1673
1997
  .embla__dot {
1674
1998
  -webkit-tap-highlight-color: rgba(var(--text-high-contrast-rgb-value), 0.5);
1675
1999
  -webkit-appearance: none;
@@ -1691,7 +2015,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1691
2015
  justify-content: center;
1692
2016
  border-radius: 50%;
1693
2017
  }
1694
-
1695
2018
  .embla__dot:after {
1696
2019
  // box-shadow: inset 0 0 0 0.2rem var(--detail-medium-contrast);
1697
2020
  width: var(--_ctm-dn-pn-ds-dt-se, var(--_tst-dn-pn-ds-dt-se));
@@ -1701,12 +2024,10 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1701
2024
  align-items: center;
1702
2025
  content: "";
1703
2026
  }
1704
-
1705
2027
  .embla__dot--selected:after {
1706
2028
  box-shadow: inset 0 0 0 1px var(--text-body);
1707
2029
  background-color: var(--_ctm-dn-pn-ds-ct-dt-cr, var(--_tst-dn-pn-ds-ct-dt-cr));
1708
2030
  }
1709
-
1710
2031
  &[data-slider-control="Pagination Line"] {
1711
2032
  .embla__dot {
1712
2033
  width: var(--_ctm-dn-pn-le-le-wh, var(--_ctm-dn-pn-le-le-wh));
@@ -1715,7 +2036,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1715
2036
 
1716
2037
  border-radius: 6px;
1717
2038
  }
1718
-
1719
2039
  .embla__dot--selected:after {
1720
2040
  box-shadow: inset 0 0 0 1px var(--text-body);
1721
2041
  border-radius: 6px;
@@ -1746,7 +2066,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1746
2066
 
1747
2067
  overflow: hidden;
1748
2068
  }
1749
-
1750
2069
  .embla__thumbs__container {
1751
2070
  display: flex;
1752
2071
  flex-direction: row;
@@ -1760,7 +2079,6 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1760
2079
  min-width: var(--_ctm-lt-tl-se);
1761
2080
  max-width: var(--_ctm-lt-tl-se);
1762
2081
  height: var(--_ctm-lt-tl-se);
1763
-
1764
2082
  & img {
1765
2083
  width: 100%;
1766
2084
  height: 100%;
@@ -1770,4 +2088,4 @@ $resizeActive: '[data-cms-element-resizer="true"]';
1770
2088
  }
1771
2089
  }
1772
2090
  }
1773
- }
2091
+ }