@sc-360-v2/storefront-cms-library 0.4.56 → 0.4.57

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 (150) hide show
  1. package/dist/add-existing-form.scss +66 -66
  2. package/dist/add-order.scss +377 -377
  3. package/dist/add-products-tab copy.scss +1132 -1132
  4. package/dist/allocations.scss +1603 -1603
  5. package/dist/amount-estimator.scss +1083 -1083
  6. package/dist/animation-control.scss +23 -23
  7. package/dist/badge.scss +388 -388
  8. package/dist/brand-basic-elements.scss +292 -292
  9. package/dist/brand.scss +93 -93
  10. package/dist/breadcrumbs.scss +802 -802
  11. package/dist/builder.js +1 -1
  12. package/dist/bulk-order-pad.scss +677 -677
  13. package/dist/bulk-variant-picker copy.scss +1121 -1121
  14. package/dist/bulk-variant-picker.scss +3294 -3294
  15. package/dist/bundle copy.scss +2805 -2805
  16. package/dist/bundle.scss +2383 -2383
  17. package/dist/bundleDetails copy.scss +1431 -1431
  18. package/dist/button copy.scss +271 -271
  19. package/dist/button.scss +292 -292
  20. package/dist/buy-for-tab-container.scss +90 -90
  21. package/dist/buy-for-tabs-container-item.scss +80 -80
  22. package/dist/buyForHeaders.scss +6718 -6718
  23. package/dist/cart-products-sidebar.scss +211 -211
  24. package/dist/cart-summary.scss +2728 -2728
  25. package/dist/cart-wrapper.scss +127 -127
  26. package/dist/cartGrouping.scss +89 -89
  27. package/dist/category-groups-element.scss +138 -138
  28. package/dist/category.scss +73 -73
  29. package/dist/categoryDetails.scss +61 -61
  30. package/dist/categoryWidget.scss +34 -34
  31. package/dist/checkbox-radio.scss +124 -124
  32. package/dist/code-temp.scss +58 -58
  33. package/dist/colorpicker_v2.scss +52 -52
  34. package/dist/common-element.scss +35 -35
  35. package/dist/confirm-modal.scss +351 -351
  36. package/dist/confirmationModal.scss +139 -139
  37. package/dist/contact-us.scss +105 -105
  38. package/dist/container.scss +114 -114
  39. package/dist/countdown.scss +751 -751
  40. package/dist/coupon.scss +1254 -1254
  41. package/dist/custom-fonts.scss +100 -100
  42. package/dist/customization-tree.scss +160 -160
  43. package/dist/default-dropdown.scss +240 -240
  44. package/dist/editCartItem.scss +111 -111
  45. package/dist/embed-temp.scss +72 -72
  46. package/dist/embroider-preview-element.scss +94 -94
  47. package/dist/embroider-template-1-v2.scss +937 -937
  48. package/dist/embroider-template-1.scss +482 -482
  49. package/dist/embroidery.scss +213 -213
  50. package/dist/employee-bulk-order.scss +4057 -4057
  51. package/dist/emtpy-templates.scss +165 -165
  52. package/dist/faq.scss +564 -564
  53. package/dist/fb-dropdown.scss +125 -125
  54. package/dist/filter-results.scss +323 -323
  55. package/dist/flex-text-editor.scss +271 -271
  56. package/dist/form-preview.scss +290 -290
  57. package/dist/form-zindex-module.scss +24 -24
  58. package/dist/gallery-slider-temp.scss +1234 -1234
  59. package/dist/global-styles.scss +86 -86
  60. package/dist/grid.scss +119 -119
  61. package/dist/hotspot.scss +397 -397
  62. package/dist/icon-library.scss +74 -74
  63. package/dist/image-for-product.scss +21 -21
  64. package/dist/image-temp.scss +168 -168
  65. package/dist/item-stock.scss +87 -87
  66. package/dist/layouter-item.scss +89 -89
  67. package/dist/layouter-pro-item.scss +80 -80
  68. package/dist/layouter-pro.scss +88 -88
  69. package/dist/light-box-v2.scss +105 -105
  70. package/dist/lightbox.scss +78 -78
  71. package/dist/line.scss +166 -166
  72. package/dist/loader.scss +37 -37
  73. package/dist/map.scss +962 -962
  74. package/dist/marchandiserSets.scss +60 -60
  75. package/dist/mega-menu-container.scss +99 -99
  76. package/dist/mega-menu.scss +838 -838
  77. package/dist/menu-item.scss +19 -19
  78. package/dist/menu.scss +162 -162
  79. package/dist/modal.scss +2267 -2267
  80. package/dist/multi-select-dropdown.scss +282 -282
  81. package/dist/my-wishlist.scss +17 -17
  82. package/dist/option-bar.scss +845 -845
  83. package/dist/order-processing.scss +61 -61
  84. package/dist/overflow-module.scss +63 -63
  85. package/dist/past-orders.scss +975 -975
  86. package/dist/payment-methods.scss +289 -289
  87. package/dist/pickup-locations.scss +1167 -1167
  88. package/dist/position-module.scss +95 -95
  89. package/dist/prefix-list.scss +86 -86
  90. package/dist/product-actions copy.scss +2765 -2765
  91. package/dist/product-actions.scss +2286 -2286
  92. package/dist/product-basic-elements.scss +770 -770
  93. package/dist/product-customizations.scss +149 -149
  94. package/dist/product-highlights copy.scss +217 -217
  95. package/dist/product-highlights.scss +311 -311
  96. package/dist/product-image copy.scss +787 -787
  97. package/dist/product-inventory.scss +1378 -1378
  98. package/dist/product-options.scss +1144 -1144
  99. package/dist/product-price.scss +2598 -2598
  100. package/dist/product-promotions.scss +2759 -2759
  101. package/dist/product.scss +97 -97
  102. package/dist/productDetails.scss +70 -70
  103. package/dist/quick-links.scss +552 -552
  104. package/dist/quick-order-pad.scss +237 -237
  105. package/dist/quota-details.scss +263 -263
  106. package/dist/quotes.scss +737 -737
  107. package/dist/repeater copy.scss +635 -635
  108. package/dist/repeater-grid-toggle.scss +58 -58
  109. package/dist/repeater-item.scss +90 -90
  110. package/dist/request-for-quotes.scss +746 -746
  111. package/dist/responsive-behaviour.scss +29 -29
  112. package/dist/rfqs.scss +736 -736
  113. package/dist/scroll.scss +222 -222
  114. package/dist/search-results-heading.scss +279 -279
  115. package/dist/shareCartSideBar.scss +254 -254
  116. package/dist/shipping-estimator.scss +41 -41
  117. package/dist/shipping-payments.scss +2467 -2467
  118. package/dist/simple-list.scss +259 -259
  119. package/dist/skeleton.scss +74 -74
  120. package/dist/social.scss +276 -276
  121. package/dist/sort.scss +89 -89
  122. package/dist/spotlight.scss +1663 -1663
  123. package/dist/stack.scss +129 -129
  124. package/dist/static-text.scss +52 -52
  125. package/dist/stockStatus.scss +64 -64
  126. package/dist/store-locations.scss +1398 -1398
  127. package/dist/sub-category.scss +74 -74
  128. package/dist/submit-quote.scss +275 -275
  129. package/dist/tab-container-item.scss +80 -80
  130. package/dist/tab-container.scss +89 -89
  131. package/dist/tab-v2.scss +583 -583
  132. package/dist/table-common.scss +506 -506
  133. package/dist/table.scss +685 -685
  134. package/dist/tabs.scss +395 -395
  135. package/dist/text-temp-v2.scss +139 -139
  136. package/dist/text-temp.scss +109 -109
  137. package/dist/toaster.scss +350 -350
  138. package/dist/toggle-button.scss +32 -32
  139. package/dist/transform-properties-module.scss +20 -20
  140. package/dist/types/builder/tools/element-edit/layouter.d.ts +2 -0
  141. package/dist/uom-selector.scss +1169 -1169
  142. package/dist/user-elements copy.scss +1437 -1437
  143. package/dist/variant-picker.scss +2384 -2384
  144. package/dist/video.scss +476 -476
  145. package/dist/volume-pricing copy 2.scss +1468 -1468
  146. package/dist/volume-pricing copy.scss +1077 -1077
  147. package/dist/volume-pricing.scss +1175 -1175
  148. package/dist/widget.scss +148 -148
  149. package/dist/wishlist-overlay.scss +48 -48
  150. package/package.json +1 -1
package/dist/faq.scss CHANGED
@@ -1,564 +1,564 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
-
4
- [data-div-type="element"] {
5
- &[data-element-type="faq"] {
6
- // width: var(--_lt-wh);
7
- // height: var(--_lt-ht);
8
- // margin: var(--_lt-mn);
9
- // padding: var(--_lt-pg);
10
- // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
11
- // width: 50%;
12
- // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
- width: var(
14
- --_sf-el-wh-st-mx,
15
- calc(
16
- 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
17
- )
18
- );
19
- margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
20
-
21
- // height: clamp(var(--_ctm-lt-ht, 50px), 100px, auto) !important;
22
- // height: var(--_ctm-lt-ht);
23
- // height: ;
24
- // height: auto;
25
- // aspect-ratio: 1 / var(--_sf-aspect-ratio);
26
- // --_aspect-ratio: calc(
27
- // 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
28
- // );
29
-
30
- // &[data-element-sub-child="true"] {
31
- // // width: max(var(--_sf-nw-wh, var(--_tst-lt-wh)));
32
- // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
33
- // }
34
-
35
- & > .wrapper {
36
- // width: 100%;
37
- // height: 100%;
38
- }
39
- &[data-show-shadow="false"] {
40
- --_show-shadow: none;
41
- }
42
-
43
- .accordion-element {
44
- background-color: var(
45
- --_ctm-mob-dn-fq-wt-bd-cr,
46
- var(--_ctm-tab-dn-fq-wt-bd-cr, var(--_ctm-dn-fq-wt-bd-cr))
47
- );
48
- padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
49
- display: flex;
50
- flex-direction: column;
51
- --_sf-gp: var(
52
- --_ctm-mob-lt-im-sg,
53
- var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
54
- );
55
- --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
56
- row-gap: var(--_sf-gp);
57
- width: 100%;
58
- // height: 100%;
59
- border-color: var(
60
- --_ctm-mob-dn-fq-wt-br-cr,
61
- var(--_ctm-tab-dn-fq-wt-br-cr, var(--_ctm-dn-fq-wt-br-cr))
62
- );
63
- border-style: var(
64
- --_ctm-mob-dn-fq-wt-br-se,
65
- var(--_ctm-tab-dn-fq-wt-br-se, var(--_ctm-dn-fq-wt-br-se))
66
- );
67
- border-width: var(
68
- --_ctm-mob-dn-fq-wt-br-wh,
69
- var(--_ctm-tab-dn-fq-wt-br-wh, var(--_ctm-dn-fq-wt-br-wh))
70
- );
71
- border-radius: var(
72
- --_ctm-mob-dn-fq-wt-br-rs,
73
- var(--_ctm-tab-dn-fq-wt-br-rs, var(--_ctm-dn-fq-wt-br-rs))
74
- );
75
- box-shadow: var(
76
- --_show-shadow,
77
- var(--_ctm-mob-dn-fq-wt-sw-ae, var(--_ctm-tab-dn-fq-wt-sw-ae, var(--_ctm-dn-fq-wt-sw-ae)))
78
- var(--_ctm-mob-dn-fq-wt-sw-br, var(--_ctm-tab-dn-fq-wt-sw-br, var(--_ctm-dn-fq-wt-sw-br)))
79
- var(--_ctm-mob-dn-fq-wt-sw-sd, var(--_ctm-tab-dn-fq-wt-sw-sd, var(--_ctm-dn-fq-wt-sw-sd)))
80
- var(--_ctm-mob-dn-fq-wt-sw-cr, var(--_ctm-tab-dn-fq-wt-sw-cr, var(--_ctm-dn-fq-wt-sw-cr)))
81
- );
82
-
83
- &[data-divider-show="true"] {
84
- --_sf-dvdr: var(
85
- --_ctm-mob-dn-dr-dr-wh,
86
- var(--_ctm-tab-dn-dr-dr-wh, var(--_ctm-dn-dr-dr-wh, 1px))
87
- )
88
- var(--_ctm-mob-dn-dr-br-se, var(--_ctm-tab-dn-dr-br-se, var(--_ctm-dn-dr-br-se, solid)))
89
- var(--_ctm-dn-dr-br-cr, var(--_tst-dn-dr-bd-cr));
90
- --_sf-dvdr-gap: var(--_sf-gp);
91
- }
92
- &[data-icon-position="Left"] {
93
- --_sf-fd: row-reverse;
94
- --_sf-jc: flex-end;
95
- }
96
- &[data-show-icon="false"] {
97
- --_sf-show-icon-ff: none;
98
- }
99
- &[data-divider-show="true"] {
100
- // .accordion-item:not(:last-child) {
101
- // border-bottom: var(
102
- // --_ctm-mob-dn-dr-dr-wh,
103
- // var(--_ctm-tab-dn-dr-dr-wh, var(--_ctm-dn-dr-dr-wh))
104
- // )
105
- // var(--_ctm-mob-dn-dr-br-se, var(--_ctm-tab-dn-dr-br-se, var(--_ctm-dn-dr-br-se)))
106
- // var(--_ctm-mob-dn-dr-br-cr, var(--_ctm-tab-dn-dr-br-cr, var(--_ctm-dn-dr-br-cr)));
107
- // }
108
- }
109
- }
110
-
111
- .accordion-item {
112
- width: 100%;
113
- display: grid;
114
- overflow: clip;
115
- // height: 30px;
116
-
117
- // padding-block: var(--_ctm-lt-im-vl-pg, var(--_tst-lt-im-vl-pg));
118
- // padding-inline: var(
119
- // --_ctm-mob-lt-im-hl-pg,
120
- // var(--_ctm-tab-lt-im-hl-pg, var(--_ctm-lt-im-hl-pg))
121
- // );
122
-
123
- padding: var(
124
- --_ctm-mob-dn-cd-an-im-pg-im,
125
- var(--_ctm-tab-dn-cd-an-im-pg-im, var(--_ctm-dn-cd-an-im-pg-im))
126
- );
127
- grid-template-rows: var(
128
- --_self-active-gtr,
129
- minmax(
130
- var(
131
- --_ctm-mob-dn-cd-an-im-in-se,
132
- var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se, 50px))
133
- ),
134
- auto
135
- )
136
- 0px
137
- );
138
- // transition: grid-template-rows 0.45s ease-in-out;
139
-
140
- --_sf-pd-cd: var(--_sf-dvdr-gap);
141
- // updated css
142
- border-color: var(
143
- --_ctm-mob-dn-cd-an-im-br-cr,
144
- var(--_ctm-tab-dn-cd-an-im-br-cr, var(--_ctm-dn-cd-an-im-br-cr))
145
- );
146
- border-style: var(
147
- --_ctm-mob-dn-cd-an-im-br-se,
148
- var(--_ctm-tab-dn-cd-an-im-br-se, var(--_ctm-dn-cd-an-im-br-se))
149
- );
150
- border-width: var(
151
- --_ctm-mob-dn-cd-an-im-br-wh,
152
- var(--_ctm-tab-dn-cd-an-im-br-wh, var(--_ctm-dn-cd-an-im-br-wh))
153
- );
154
- border-radius: var(
155
- --_ctm-mob-dn-cd-an-im-br-rs,
156
- var(--_ctm-tab-dn-cd-an-im-br-rs, var(--_ctm-dn-cd-an-im-br-rs))
157
- );
158
- box-shadow: var(
159
- --_show-shadow,
160
- var(
161
- --_ctm-mob-dn-cd-an-im-sw-ae,
162
- var(--_ctm-tab-dn-cd-an-im-sw-ae, var(--_ctm-dn-cd-an-im-sw-ae))
163
- )
164
- var(
165
- --_ctm-mob-dn-cd-an-im-sw-br,
166
- var(--_ctm-tab-dn-cd-an-im-sw-br, var(--_ctm-dn-cd-an-im-sw-br))
167
- )
168
- var(
169
- --_ctm-mob-dn-cd-an-im-sw-sd,
170
- var(--_ctm-tab-dn-cd-an-im-sw-sd, var(--_ctm-dn-cd-an-im-sw-sd))
171
- )
172
- var(
173
- --_ctm-mob-dn-cd-an-im-sw-sd,
174
- var(--_ctm-tab-dn-cd-an-im-sw-sd, var(--_ctm-dn-cd-an-im-sw-sd))
175
- )
176
- );
177
-
178
- // &:not(:last-of-type) {
179
- // &::after {
180
- // content: "";
181
- // height: var(--_ctm-dn-dr-dr-wh, 1px);
182
- // background-color: var(--_ctm-dn-dr-br-cr, var(--_tst-dn-dr-bd-cr));
183
-
184
- // // border-block-end: var(--_sf-dvdr);
185
- // }
186
- // }
187
-
188
- .accordion-title {
189
- display: flex;
190
- flex-direction: var(--_sf-fd, row);
191
- align-content: center;
192
- gap: var(--_sf-cd-gp);
193
- align-items: center;
194
- justify-content: var(--_sf-jc, space-between);
195
- cursor: pointer;
196
- // padding-block-end: var(--_sf-dc-pd, var(--_sf-pd-cd));
197
- background-color: var(
198
- --_ctm-mob-dn-cd-an-im-bd-cr,
199
- var(--_ctm-tab-dn-cd-an-im-bd-cr, var(--_ctm-dn-cd-an-im-bd-cr))
200
- );
201
- padding: var(
202
- --_ctm-mob-dn-cd-an-im-pg-te,
203
- var(--_ctm-tab-dn-cd-an-im-pg-te, var(--_ctm-dn-cd-an-im-pg-te))
204
- );
205
-
206
- // p {
207
- // color: var(
208
- // --_ctm-mob-dn-cd-an-im-cr,
209
- // var(--_ctm-tab-dn-cd-an-im-cr, var(--_ctm-dn-cd-an-im-cr))
210
- // );
211
- // font-family: var(
212
- // --_ctm-mob-dn-cd-an-im-ft-fy,
213
- // var(--_ctm-tab-dn-cd-an-im-ft-fy, var(--_ctm-dn-cd-an-im-ft-fy))
214
- // ),
215
-
216
- // font-size: var(
217
- // --_ctm-mob-dn-cd-an-im-ft-se,
218
- // var(--_ctm-tab-dn-cd-an-im-ft-se, var(--_ctm-dn-cd-an-im-ft-se))
219
- // );
220
- // font-weight: var(
221
- // --_ctm-mob-dn-cd-an-im-ft-wt,
222
- // var(--_ctm-tab-dn-cd-an-im-ft-wt, var(--_ctm-dn-cd-an-im-ft-wt))
223
- // );
224
- // font-style: var(
225
- // --_ctm-mob-dn-cd-an-im-ft-se-ic,
226
- // var(--_ctm-tab-dn-cd-an-im-ft-se-ic, var(--_ctm-dn-cd-an-im-ft-se-ic))
227
- // );
228
- // text-align: var(
229
- // --_ctm-mob-dn-cd-an-im-tt-an,
230
- // var(--_ctm-tab-dn-cd-an-im-tt-an, var(--_ctm-dn-cd-an-im-tt-an))
231
- // );
232
- // letter-spacing: var(
233
- // --_ctm-mob-dn-cd-an-im-lr-sg,
234
- // var(--_ctm-tab-dn-cd-an-im-lr-sg, var(--_ctm-dn-cd-an-im-lr-sg))
235
- // );
236
- // line-height: var(
237
- // --_ctm-mob-dn-cd-an-im-le-ht,
238
- // var(--_ctm-tab-dn-cd-an-im-le-ht, var(--_ctm-dn-cd-an-im-le-ht-dc))
239
- // );
240
- // text-decoration: var(
241
- // --_ctm-mob-dn-cd-an-im-ue,
242
- // var(--_ctm-tab-dn-cd-an-im-ue, var(--_ctm-dn-cd-an-im-ue))
243
- // );
244
- // }
245
- color: var(
246
- --_ctm-mob-dn-cd-an-im-cr,
247
- var(--_ctm-tab-dn-cd-an-im-cr, var(--_ctm-dn-cd-an-im-cr))
248
- );
249
- font-family: var(
250
- --_ctm-mob-dn-cd-an-im-ft-fy,
251
- var(--_ctm-tab-dn-cd-an-im-ft-fy, var(--_ctm-dn-cd-an-im-ft-fy))
252
- );
253
- font-size: var(
254
- --_ctm-mob-dn-cd-an-im-ft-se,
255
- var(--_ctm-tab-dn-cd-an-im-ft-se, var(--_ctm-dn-cd-an-im-ft-se))
256
- );
257
- font-weight: var(
258
- --_ctm-mob-dn-cd-an-im-ft-wt,
259
- var(--_ctm-tab-dn-cd-an-im-ft-wt, var(--_ctm-dn-cd-an-im-ft-wt))
260
- );
261
- font-style: var(
262
- --_ctm-mob-dn-cd-an-im-ft-se-ic,
263
- var(--_ctm-tab-dn-cd-an-im-ft-se-ic, var(--_ctm-dn-cd-an-im-ft-se-ic))
264
- );
265
- text-align: var(
266
- --_ctm-mob-dn-cd-an-im-tt-an,
267
- var(--_ctm-tab-dn-cd-an-im-tt-an, var(--_ctm-dn-cd-an-im-tt-an))
268
- );
269
- letter-spacing: var(
270
- --_ctm-mob-dn-cd-an-im-lr-sg,
271
- var(--_ctm-tab-dn-cd-an-im-lr-sg, var(--_ctm-dn-cd-an-im-lr-sg))
272
- );
273
- line-height: var(
274
- --_ctm-mob-dn-cd-an-im-le-ht,
275
- var(--_ctm-tab-dn-cd-an-im-le-ht, var(--_ctm-dn-cd-an-im-le-ht-dc))
276
- );
277
- text-decoration: var(
278
- --_ctm-mob-dn-cd-an-im-ue,
279
- var(--_ctm-tab-dn-cd-an-im-ue, var(--_ctm-dn-cd-an-im-ue))
280
- );
281
- .icon {
282
- display: var(--_sf-show-icon-ff, flex);
283
- svg {
284
- width: var(
285
- --_ctm-mab-dn-cd-an-im-in-se,
286
- var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se))
287
- );
288
- height: var(
289
- --_ctm-mob-dn-cd-an-im-in-se,
290
- var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se))
291
- );
292
- path {
293
- stroke: var(
294
- --_ctm-mob-dn-cd-an-im-in-c1,
295
- var(--_ctm-tab-dn-cd-an-im-in-c1, var(--_ctm-dn-cd-an-im-in-c1))
296
- );
297
- }
298
- }
299
- }
300
- }
301
- .accordion-description {
302
- display: none;
303
- }
304
- // .accordion-description {
305
- // // margin-block-start: calc(-1 * var(--_sf-dc-mb));
306
- // padding-block-end: var(--_sf-dc-pd-bt);
307
- // p {
308
- // color: var(--_ctm-dn-cd-an-im-cr-dc, var(--_tst-dn-cd-an-im-cr-dc));
309
- // font-family: var(--_ctm-dn-cd-an-im-ft-fy-dc, var(--_tst-dn-cd-an-im-ft-fy-dc)),
310
-
311
- // font-size: var(--_ctm-dn-cd-an-im-ft-se-dc, var(--_tst-dn-cd-an-im-ft-se-dc));
312
- // font-weight: var(--_ctm-dn-cd-an-im-ft-wt-dc, var(--_tst-dn-cd-an-im-ft-wt-dc));
313
- // font-style: var(--_ctm-dn-cd-an-im-ft-se-ic-dc, var(--_tst-dn-cd-an-im-ft-se-ic-dc));
314
- // text-align: var(--_ctm-dn-cd-an-im-tt-an-dc, var(--_tst-dn-cd-an-im-tt-an-dc));
315
- // letter-spacing: var(--_ctm-dn-cd-an-im-lr-sg-dc, var(--_tst-dn-cd-an-im-lr-sg-dc));
316
- // line-height: var(--_ctm-dn-cd-an-im-le-ht-dc, var(--_tst-dn-cd-an-im-le-ht-dc));
317
- // }
318
- // }
319
-
320
- &[data-state="open"] {
321
- // overflow: inherit;
322
- // height: auto;
323
-
324
- padding: var(
325
- --_ctm-mob-dn-ed-an-im-pg-im,
326
- var(--_ctm-tab-dn-ed-an-im-pg-im, var(--_ctm-dn-ed-an-im-pg-im))
327
- );
328
- gap: var(
329
- --_ctm-mob-lt-te-ad-dn-sg,
330
- var(--_ctm-tab-lt-te-ad-dn-sg, var(--_ctm-lt-te-ad-dn-sg))
331
- );
332
-
333
- --_self-active-gtr: minmax(
334
- var(
335
- --_ctm-mob-dn-cd-an-im-in-se,
336
- var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se))
337
- ),
338
- auto
339
- )
340
- minmax(50px, auto);
341
-
342
- --_sf-dc-pd: var(--_sf-dvdr-gap, var(--_sf-cd-gp));
343
- --_sf-dc-mb: var(--_sf-cd-gp);
344
- --_sf-tt-pd: 0px;
345
- --_sf-dc-pd-bt: var(--_sf-dvdr-gap, 0px);
346
-
347
- border-color: var(
348
- --_ctm-mob-dn-ed-an-im-br-cr,
349
- var(--_ctm-tab-dn-ed-an-im-br-cr, var(--_ctm-dn-ed-an-im-br-cr))
350
- );
351
- border-style: var(
352
- --_ctm-mob-dn-ed-an-im-br-se,
353
- var(--_ctm-tab-dn-ed-an-im-br-se, var(--_ctm-dn-ed-an-im-br-se))
354
- );
355
- border-width: var(
356
- --_ctm-mob-dn-ed-an-im-br-wh,
357
- var(--_ctm-tab-dn-ed-an-im-br-wh, var(--_ctm-dn-ed-an-im-br-wh))
358
- );
359
- border-radius: var(
360
- --_ctm-mob-dn-ed-an-im-br-rs,
361
- var(--_ctm-tab-dn-ed-an-im-br-rs, var(--_ctm-dn-ed-an-im-br-rs))
362
- );
363
- box-shadow: var(
364
- --_show-shadow,
365
- var(
366
- --_ctm-mob-dn-ed-an-im-sw-ae,
367
- var(--_ctm-tab-dn-ed-an-im-sw-ae, var(--_ctm-dn-ed-an-im-sw-ae))
368
- )
369
- var(
370
- --_ctm-mob-dn-ed-an-im-sw-br,
371
- var(--_ctm-tab-dn-ed-an-im-sw-br, var(--_ctm-dn-ed-an-im-sw-br))
372
- )
373
- var(
374
- --_ctm-mob-dn-ed-an-im-sw-sd,
375
- var(--_ctm-tab-dn-ed-an-im-sw-sd, var(--_ctm-dn-ed-an-im-sw-sd))
376
- )
377
- var(
378
- --_ctm-mob-dn-ed-an-im-sw-cr,
379
- var(--_ctm-tab-dn-ed-an-im-sw-cr, var(--_ctm-dn-ed-an-im-sw-cr))
380
- )
381
- );
382
- .accordion-title {
383
- display: flex;
384
- flex-direction: var(--_sf-fd, row);
385
- align-content: center;
386
- gap: var(--_sf-cd-gp);
387
- align-items: center;
388
- justify-content: var(--_sf-jc, space-between);
389
- cursor: pointer;
390
- // padding-block-end: var(--_sf-dc-pd, var(--_sf-pd-cd));
391
- background-color: var(
392
- --_ctm-mob-dn-ed-an-im-bd-cr,
393
- var(--_ctm-tab-dn-ed-an-im-bd-cr, var(--_ctm-dn-ed-an-im-bd-cr))
394
- );
395
- padding: var(
396
- --_ctm-mob-dn-ed-an-im-pg-te,
397
- var(--_ctm-tab-dn-ed-an-im-pg-te, var(--_ctm-dn-ed-an-im-pg-te))
398
- );
399
-
400
- color: var(
401
- --_ctm-mob-dn-ed-an-im-cr,
402
- var(--_ctm-tab-dn-ed-an-im-cr, var(--_ctm-dn-ed-an-im-cr))
403
- );
404
- font-family: var(
405
- --_ctm-mob-dn-ed-an-im-ft-fy,
406
- var(--_ctm-tab-dn-ed-an-im-ft-fy, var(--_ctm-dn-ed-an-im-ft-fy))
407
- );
408
- font-size: var(
409
- --_ctm-mob-dn-ed-an-im-ft-se,
410
- var(--_ctm-tab-dn-ed-an-im-ft-se, var(--_ctm-dn-ed-an-im-ft-se))
411
- );
412
- font-weight: var(
413
- --_ctm-mob-dn-ed-an-im-ft-wt,
414
- var(--_ctm-tab-dn-ed-an-im-ft-wt, var(--_ctm-dn-ed-an-im-ft-wt))
415
- );
416
- font-style: var(
417
- --_ctm-mob-dn-ed-an-im-ft-se-ic,
418
- var(--_tst-tab-dn-ed-an-im-ft-se-ic, var(--_tst-dn-ed-an-im-ft-se-ic))
419
- );
420
- text-align: var(
421
- --_ctm-mob-dn-ed-an-im-tt-an,
422
- var(--_ctm-tab-dn-ed-an-im-tt-anvvar(--_ctm-dn-ed-an-im-tt-an))
423
- );
424
- letter-spacing: var(
425
- --_ctm-mob-dn-ed-an-im-lr-sg,
426
- var(--_ctm-tab-dn-ed-an-im-lr-sg, var(--_ctm-dn-ed-an-im-lr-sg))
427
- );
428
- line-height: var(
429
- --_ctm-mob-dn-ed-an-im-le-ht,
430
- var(--_ctm-tab-dn-ed-an-im-le-ht, var(--_ctm-dn-ed-an-im-le-ht))
431
- );
432
- // text-decoration: var(
433
- // --_ctm-dn-ed-an-im-lh,
434
- // var(--_ctm-dn-ed-an-im-ue),
435
- // var(--_tst-dn-cd-an-im-lh)
436
- // );
437
- text-decoration: var(
438
- --_ctm-mob-dn-ed-an-im-ue,
439
- var(--_ctm-tab-dn-ed-an-im-ue, var(--_ctm-dn-ed-an-im-ue))
440
- );
441
- .icon {
442
- display: var(--_sf-show-icon-ff, flex);
443
- svg {
444
- width: var(
445
- --_ctm-mob-dn-ed-an-im-in-se,
446
- var(--_ctm-tab-dn-ed-an-im-in-se, var(--_ctm-dn-ed-an-im-in-se))
447
- );
448
- height: var(
449
- --_ctm-mob-dn-ed-an-im-in-se,
450
- var(--_ctm-tab-dn-ed-an-im-in-se, var(--_ctm-dn-ed-an-im-in-se))
451
- );
452
- path {
453
- stroke: var(
454
- --_ctm-mob-dn-ed-an-im-in-c1,
455
- var(--_ctm-tab-dn-ed-an-im-in-c1, var(--_ctm-dn-ed-an-im-in-c1))
456
- );
457
- }
458
- }
459
- }
460
- }
461
- .accordion-description {
462
- display: block;
463
- // padding-block-end: var(--_sf-dc-pd-bt);
464
- background-color: var(
465
- --_ctm-mob-dn-ed-an-im-bd-cr-dc,
466
- var(--_ctm-tab-dn-ed-an-im-bd-cr-dc, var(--_ctm-dn-ed-an-im-bd-cr-dc))
467
- );
468
- padding: var(
469
- --_ctm-mob-dn-ed-an-im-pg-dc,
470
- var(--_ctm-tab-dn-ed-an-im-pg-dc, var(--_ctm-dn-ed-an-im-pg-dc))
471
- );
472
-
473
- color: var(
474
- --_ctm-mob-dn-ed-an-im-cr-dc,
475
- var(--_ctm-tab-dn-ed-an-im-cr-dc, var(--_ctm-dn-ed-an-im-cr-dc))
476
- );
477
- font-family: var(
478
- --_ctm-mob-dn-ed-an-im-ft-fy-dc,
479
- var(--_ctm-tab-dn-ed-an-im-ft-fy-dc, var(--_ctm-dn-ed-an-im-ft-fy-dc))
480
- );
481
- font-size: var(
482
- --_ctm-mob-dn-ed-an-im-ft-se-dc,
483
- var(--_ctm-tab-dn-ed-an-im-ft-se-dc, var(--_ctm-dn-ed-an-im-ft-se-dc))
484
- );
485
- font-weight: var(
486
- --_ctm-mob-dn-ed-an-im-ft-wt-dc,
487
- var(--_ctm-tab-dn-ed-an-im-ft-wt-dc, var(--_ctm-dn-ed-an-im-ft-wt-dc))
488
- );
489
- font-style: var(
490
- --_ctm-mob-dn-ed-an-im-ft-se-ic-dc,
491
- var(--_ctm-tab-dn-ed-an-im-ft-se-ic-dc, var(--_ctm-dn-ed-an-im-ft-se-ic-dc))
492
- );
493
- text-align: var(
494
- --_ctm-mob-dn-ed-an-im-tt-an-dc,
495
- var(--_ctm-tab-dn-ed-an-im-tt-an-dc, var(--_ctm-dn-ed-an-im-tt-an-dc))
496
- );
497
- letter-spacing: var(
498
- --_ctm-mob-dn-ed-an-im-lr-sg-dc,
499
- var(--_ctm-tab-dn-ed-an-im-lr-sg-dc, var(--_ctm-dn-ed-an-im-lr-sg-dc))
500
- );
501
- line-height: var(
502
- --_ctm-mob-dn-ed-an-im-le-ht-dc,
503
- var(--_ctm-tab-dn-ed-an-im-le-ht-dc, var(--_ctm-dn-ed-an-im-le-ht-dc))
504
- );
505
- text-decoration: var(
506
- --_ctm-mob-dn-ed-an-im-ue-dc,
507
- var(--_ctm-tab-dn-ed-an-im-ue-dc, var(--_ctm-dn-ed-an-im-ue-dc))
508
- );
509
- }
510
- .accordion-title {
511
- position: relative;
512
- }
513
- &[data-show-divider="true"] {
514
- .accordion-title:not(:last-child)::before {
515
- content: "";
516
- position: absolute;
517
- left: 0;
518
- right: 0;
519
- bottom: calc(
520
- -1 *
521
- (
522
- var(
523
- --_ctm-mob-lt-te-ad-dn-sg,
524
- var(--_ctm-tab-lt-te-ad-dn-sg, var(--_ctm-lt-te-ad-dn-sg))
525
- ) /
526
- 2
527
- )
528
- );
529
-
530
- height: var(
531
- --_ctm-mob-dn-ed-an-im-dr-wt,
532
- var(--_ctm-tab-dn-ed-an-im-dr-wt, var(--_ctm-dn-ed-an-im-dr-wt))
533
- );
534
- background-color: var(
535
- --_ctm-mob-dn-ed-an-im-dr-cr,
536
- var(--_ctm-tab-dn-ed-an-im-dr-cr, var(--_ctm-dn-ed-an-im-dr-cr))
537
- );
538
- }
539
- }
540
- }
541
- }
542
- .divider {
543
- // height: var(
544
- // --_ctm-mob-dn-wt-se-dr-wt,
545
- // var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt))
546
- // );
547
- // background-color: var(
548
- // --_ctm-mob-dn-wt-se-dr-cr,
549
- // var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr))
550
- // );
551
- border: none; /* Remove default border */
552
- height: var(
553
- --_ctm-mob-dn-dr-dr-wt,
554
- var(--_ctm-tab-dn-dr-dr-wt, var(--_ctm-dn-dr-dr-wt))
555
- ); /* Set thickness */
556
- background-color: var(
557
- --_ctm-mob-dn-dr-dr-cr,
558
- var(--_ctm-tab-dn-dr-dr-cr, var(--_ctm-dn-dr-dr-cr))
559
- ); /* Set color */
560
- // margin: 20px 0; /* Optional spacing */
561
- // border-radius: 2px;
562
- }
563
- }
564
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+
4
+ [data-div-type="element"] {
5
+ &[data-element-type="faq"] {
6
+ // width: var(--_lt-wh);
7
+ // height: var(--_lt-ht);
8
+ // margin: var(--_lt-mn);
9
+ // padding: var(--_lt-pg);
10
+ // width: var(--_ctm-lt-wh, var(--_tst-lt-wh));
11
+ // width: 50%;
12
+ // width: var(--_sf-nw-wh, var(--_tst-lt-wh));
13
+ width: var(
14
+ --_sf-el-wh-st-mx,
15
+ calc(
16
+ 1% * var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl)))
17
+ )
18
+ );
19
+ margin: var(--_ctm-mob-lt-mn, var(--_ctm-tab-lt-mn, var(--_ctm-lt-mn)));
20
+
21
+ // height: clamp(var(--_ctm-lt-ht, 50px), 100px, auto) !important;
22
+ // height: var(--_ctm-lt-ht);
23
+ // height: ;
24
+ // height: auto;
25
+ // aspect-ratio: 1 / var(--_sf-aspect-ratio);
26
+ // --_aspect-ratio: calc(
27
+ // 1 * (var(--_ctm-lt-ht, var(--_tst-lt-ht)) / var(--_ctm-lt-wh, var(--_tst-lt-wh)))
28
+ // );
29
+
30
+ // &[data-element-sub-child="true"] {
31
+ // // width: max(var(--_sf-nw-wh, var(--_tst-lt-wh)));
32
+ // width: var(--_sf-el-wh-st-mx, calc(1% * var(--_ctm-ele-nw-wh-vl, var(--_sf-nw-wh))));
33
+ // }
34
+
35
+ & > .wrapper {
36
+ // width: 100%;
37
+ // height: 100%;
38
+ }
39
+ &[data-show-shadow="false"] {
40
+ --_show-shadow: none;
41
+ }
42
+
43
+ .accordion-element {
44
+ background-color: var(
45
+ --_ctm-mob-dn-fq-wt-bd-cr,
46
+ var(--_ctm-tab-dn-fq-wt-bd-cr, var(--_ctm-dn-fq-wt-bd-cr))
47
+ );
48
+ padding: var(--_ctm-mob-lt-pg, var(--_ctm-tab-lt-pg, var(--_ctm-lt-pg)));
49
+ display: flex;
50
+ flex-direction: column;
51
+ --_sf-gp: var(
52
+ --_ctm-mob-lt-im-sg,
53
+ var(--_ctm-tab-lt-im-sg, var(--_ctm-lt-im-sg, var(--_ctm-lt-im-sg), 16px))
54
+ );
55
+ --_sf-cd-gp: calc(var(--_sf-gp) * 0.5);
56
+ row-gap: var(--_sf-gp);
57
+ width: 100%;
58
+ // height: 100%;
59
+ border-color: var(
60
+ --_ctm-mob-dn-fq-wt-br-cr,
61
+ var(--_ctm-tab-dn-fq-wt-br-cr, var(--_ctm-dn-fq-wt-br-cr))
62
+ );
63
+ border-style: var(
64
+ --_ctm-mob-dn-fq-wt-br-se,
65
+ var(--_ctm-tab-dn-fq-wt-br-se, var(--_ctm-dn-fq-wt-br-se))
66
+ );
67
+ border-width: var(
68
+ --_ctm-mob-dn-fq-wt-br-wh,
69
+ var(--_ctm-tab-dn-fq-wt-br-wh, var(--_ctm-dn-fq-wt-br-wh))
70
+ );
71
+ border-radius: var(
72
+ --_ctm-mob-dn-fq-wt-br-rs,
73
+ var(--_ctm-tab-dn-fq-wt-br-rs, var(--_ctm-dn-fq-wt-br-rs))
74
+ );
75
+ box-shadow: var(
76
+ --_show-shadow,
77
+ var(--_ctm-mob-dn-fq-wt-sw-ae, var(--_ctm-tab-dn-fq-wt-sw-ae, var(--_ctm-dn-fq-wt-sw-ae)))
78
+ var(--_ctm-mob-dn-fq-wt-sw-br, var(--_ctm-tab-dn-fq-wt-sw-br, var(--_ctm-dn-fq-wt-sw-br)))
79
+ var(--_ctm-mob-dn-fq-wt-sw-sd, var(--_ctm-tab-dn-fq-wt-sw-sd, var(--_ctm-dn-fq-wt-sw-sd)))
80
+ var(--_ctm-mob-dn-fq-wt-sw-cr, var(--_ctm-tab-dn-fq-wt-sw-cr, var(--_ctm-dn-fq-wt-sw-cr)))
81
+ );
82
+
83
+ &[data-divider-show="true"] {
84
+ --_sf-dvdr: var(
85
+ --_ctm-mob-dn-dr-dr-wh,
86
+ var(--_ctm-tab-dn-dr-dr-wh, var(--_ctm-dn-dr-dr-wh, 1px))
87
+ )
88
+ var(--_ctm-mob-dn-dr-br-se, var(--_ctm-tab-dn-dr-br-se, var(--_ctm-dn-dr-br-se, solid)))
89
+ var(--_ctm-dn-dr-br-cr, var(--_tst-dn-dr-bd-cr));
90
+ --_sf-dvdr-gap: var(--_sf-gp);
91
+ }
92
+ &[data-icon-position="Left"] {
93
+ --_sf-fd: row-reverse;
94
+ --_sf-jc: flex-end;
95
+ }
96
+ &[data-show-icon="false"] {
97
+ --_sf-show-icon-ff: none;
98
+ }
99
+ &[data-divider-show="true"] {
100
+ // .accordion-item:not(:last-child) {
101
+ // border-bottom: var(
102
+ // --_ctm-mob-dn-dr-dr-wh,
103
+ // var(--_ctm-tab-dn-dr-dr-wh, var(--_ctm-dn-dr-dr-wh))
104
+ // )
105
+ // var(--_ctm-mob-dn-dr-br-se, var(--_ctm-tab-dn-dr-br-se, var(--_ctm-dn-dr-br-se)))
106
+ // var(--_ctm-mob-dn-dr-br-cr, var(--_ctm-tab-dn-dr-br-cr, var(--_ctm-dn-dr-br-cr)));
107
+ // }
108
+ }
109
+ }
110
+
111
+ .accordion-item {
112
+ width: 100%;
113
+ display: grid;
114
+ overflow: clip;
115
+ // height: 30px;
116
+
117
+ // padding-block: var(--_ctm-lt-im-vl-pg, var(--_tst-lt-im-vl-pg));
118
+ // padding-inline: var(
119
+ // --_ctm-mob-lt-im-hl-pg,
120
+ // var(--_ctm-tab-lt-im-hl-pg, var(--_ctm-lt-im-hl-pg))
121
+ // );
122
+
123
+ padding: var(
124
+ --_ctm-mob-dn-cd-an-im-pg-im,
125
+ var(--_ctm-tab-dn-cd-an-im-pg-im, var(--_ctm-dn-cd-an-im-pg-im))
126
+ );
127
+ grid-template-rows: var(
128
+ --_self-active-gtr,
129
+ minmax(
130
+ var(
131
+ --_ctm-mob-dn-cd-an-im-in-se,
132
+ var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se, 50px))
133
+ ),
134
+ auto
135
+ )
136
+ 0px
137
+ );
138
+ // transition: grid-template-rows 0.45s ease-in-out;
139
+
140
+ --_sf-pd-cd: var(--_sf-dvdr-gap);
141
+ // updated css
142
+ border-color: var(
143
+ --_ctm-mob-dn-cd-an-im-br-cr,
144
+ var(--_ctm-tab-dn-cd-an-im-br-cr, var(--_ctm-dn-cd-an-im-br-cr))
145
+ );
146
+ border-style: var(
147
+ --_ctm-mob-dn-cd-an-im-br-se,
148
+ var(--_ctm-tab-dn-cd-an-im-br-se, var(--_ctm-dn-cd-an-im-br-se))
149
+ );
150
+ border-width: var(
151
+ --_ctm-mob-dn-cd-an-im-br-wh,
152
+ var(--_ctm-tab-dn-cd-an-im-br-wh, var(--_ctm-dn-cd-an-im-br-wh))
153
+ );
154
+ border-radius: var(
155
+ --_ctm-mob-dn-cd-an-im-br-rs,
156
+ var(--_ctm-tab-dn-cd-an-im-br-rs, var(--_ctm-dn-cd-an-im-br-rs))
157
+ );
158
+ box-shadow: var(
159
+ --_show-shadow,
160
+ var(
161
+ --_ctm-mob-dn-cd-an-im-sw-ae,
162
+ var(--_ctm-tab-dn-cd-an-im-sw-ae, var(--_ctm-dn-cd-an-im-sw-ae))
163
+ )
164
+ var(
165
+ --_ctm-mob-dn-cd-an-im-sw-br,
166
+ var(--_ctm-tab-dn-cd-an-im-sw-br, var(--_ctm-dn-cd-an-im-sw-br))
167
+ )
168
+ var(
169
+ --_ctm-mob-dn-cd-an-im-sw-sd,
170
+ var(--_ctm-tab-dn-cd-an-im-sw-sd, var(--_ctm-dn-cd-an-im-sw-sd))
171
+ )
172
+ var(
173
+ --_ctm-mob-dn-cd-an-im-sw-sd,
174
+ var(--_ctm-tab-dn-cd-an-im-sw-sd, var(--_ctm-dn-cd-an-im-sw-sd))
175
+ )
176
+ );
177
+
178
+ // &:not(:last-of-type) {
179
+ // &::after {
180
+ // content: "";
181
+ // height: var(--_ctm-dn-dr-dr-wh, 1px);
182
+ // background-color: var(--_ctm-dn-dr-br-cr, var(--_tst-dn-dr-bd-cr));
183
+
184
+ // // border-block-end: var(--_sf-dvdr);
185
+ // }
186
+ // }
187
+
188
+ .accordion-title {
189
+ display: flex;
190
+ flex-direction: var(--_sf-fd, row);
191
+ align-content: center;
192
+ gap: var(--_sf-cd-gp);
193
+ align-items: center;
194
+ justify-content: var(--_sf-jc, space-between);
195
+ cursor: pointer;
196
+ // padding-block-end: var(--_sf-dc-pd, var(--_sf-pd-cd));
197
+ background-color: var(
198
+ --_ctm-mob-dn-cd-an-im-bd-cr,
199
+ var(--_ctm-tab-dn-cd-an-im-bd-cr, var(--_ctm-dn-cd-an-im-bd-cr))
200
+ );
201
+ padding: var(
202
+ --_ctm-mob-dn-cd-an-im-pg-te,
203
+ var(--_ctm-tab-dn-cd-an-im-pg-te, var(--_ctm-dn-cd-an-im-pg-te))
204
+ );
205
+
206
+ // p {
207
+ // color: var(
208
+ // --_ctm-mob-dn-cd-an-im-cr,
209
+ // var(--_ctm-tab-dn-cd-an-im-cr, var(--_ctm-dn-cd-an-im-cr))
210
+ // );
211
+ // font-family: var(
212
+ // --_ctm-mob-dn-cd-an-im-ft-fy,
213
+ // var(--_ctm-tab-dn-cd-an-im-ft-fy, var(--_ctm-dn-cd-an-im-ft-fy))
214
+ // ),
215
+
216
+ // font-size: var(
217
+ // --_ctm-mob-dn-cd-an-im-ft-se,
218
+ // var(--_ctm-tab-dn-cd-an-im-ft-se, var(--_ctm-dn-cd-an-im-ft-se))
219
+ // );
220
+ // font-weight: var(
221
+ // --_ctm-mob-dn-cd-an-im-ft-wt,
222
+ // var(--_ctm-tab-dn-cd-an-im-ft-wt, var(--_ctm-dn-cd-an-im-ft-wt))
223
+ // );
224
+ // font-style: var(
225
+ // --_ctm-mob-dn-cd-an-im-ft-se-ic,
226
+ // var(--_ctm-tab-dn-cd-an-im-ft-se-ic, var(--_ctm-dn-cd-an-im-ft-se-ic))
227
+ // );
228
+ // text-align: var(
229
+ // --_ctm-mob-dn-cd-an-im-tt-an,
230
+ // var(--_ctm-tab-dn-cd-an-im-tt-an, var(--_ctm-dn-cd-an-im-tt-an))
231
+ // );
232
+ // letter-spacing: var(
233
+ // --_ctm-mob-dn-cd-an-im-lr-sg,
234
+ // var(--_ctm-tab-dn-cd-an-im-lr-sg, var(--_ctm-dn-cd-an-im-lr-sg))
235
+ // );
236
+ // line-height: var(
237
+ // --_ctm-mob-dn-cd-an-im-le-ht,
238
+ // var(--_ctm-tab-dn-cd-an-im-le-ht, var(--_ctm-dn-cd-an-im-le-ht-dc))
239
+ // );
240
+ // text-decoration: var(
241
+ // --_ctm-mob-dn-cd-an-im-ue,
242
+ // var(--_ctm-tab-dn-cd-an-im-ue, var(--_ctm-dn-cd-an-im-ue))
243
+ // );
244
+ // }
245
+ color: var(
246
+ --_ctm-mob-dn-cd-an-im-cr,
247
+ var(--_ctm-tab-dn-cd-an-im-cr, var(--_ctm-dn-cd-an-im-cr))
248
+ );
249
+ font-family: var(
250
+ --_ctm-mob-dn-cd-an-im-ft-fy,
251
+ var(--_ctm-tab-dn-cd-an-im-ft-fy, var(--_ctm-dn-cd-an-im-ft-fy))
252
+ );
253
+ font-size: var(
254
+ --_ctm-mob-dn-cd-an-im-ft-se,
255
+ var(--_ctm-tab-dn-cd-an-im-ft-se, var(--_ctm-dn-cd-an-im-ft-se))
256
+ );
257
+ font-weight: var(
258
+ --_ctm-mob-dn-cd-an-im-ft-wt,
259
+ var(--_ctm-tab-dn-cd-an-im-ft-wt, var(--_ctm-dn-cd-an-im-ft-wt))
260
+ );
261
+ font-style: var(
262
+ --_ctm-mob-dn-cd-an-im-ft-se-ic,
263
+ var(--_ctm-tab-dn-cd-an-im-ft-se-ic, var(--_ctm-dn-cd-an-im-ft-se-ic))
264
+ );
265
+ text-align: var(
266
+ --_ctm-mob-dn-cd-an-im-tt-an,
267
+ var(--_ctm-tab-dn-cd-an-im-tt-an, var(--_ctm-dn-cd-an-im-tt-an))
268
+ );
269
+ letter-spacing: var(
270
+ --_ctm-mob-dn-cd-an-im-lr-sg,
271
+ var(--_ctm-tab-dn-cd-an-im-lr-sg, var(--_ctm-dn-cd-an-im-lr-sg))
272
+ );
273
+ line-height: var(
274
+ --_ctm-mob-dn-cd-an-im-le-ht,
275
+ var(--_ctm-tab-dn-cd-an-im-le-ht, var(--_ctm-dn-cd-an-im-le-ht-dc))
276
+ );
277
+ text-decoration: var(
278
+ --_ctm-mob-dn-cd-an-im-ue,
279
+ var(--_ctm-tab-dn-cd-an-im-ue, var(--_ctm-dn-cd-an-im-ue))
280
+ );
281
+ .icon {
282
+ display: var(--_sf-show-icon-ff, flex);
283
+ svg {
284
+ width: var(
285
+ --_ctm-mab-dn-cd-an-im-in-se,
286
+ var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se))
287
+ );
288
+ height: var(
289
+ --_ctm-mob-dn-cd-an-im-in-se,
290
+ var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se))
291
+ );
292
+ path {
293
+ stroke: var(
294
+ --_ctm-mob-dn-cd-an-im-in-c1,
295
+ var(--_ctm-tab-dn-cd-an-im-in-c1, var(--_ctm-dn-cd-an-im-in-c1))
296
+ );
297
+ }
298
+ }
299
+ }
300
+ }
301
+ .accordion-description {
302
+ display: none;
303
+ }
304
+ // .accordion-description {
305
+ // // margin-block-start: calc(-1 * var(--_sf-dc-mb));
306
+ // padding-block-end: var(--_sf-dc-pd-bt);
307
+ // p {
308
+ // color: var(--_ctm-dn-cd-an-im-cr-dc, var(--_tst-dn-cd-an-im-cr-dc));
309
+ // font-family: var(--_ctm-dn-cd-an-im-ft-fy-dc, var(--_tst-dn-cd-an-im-ft-fy-dc)),
310
+
311
+ // font-size: var(--_ctm-dn-cd-an-im-ft-se-dc, var(--_tst-dn-cd-an-im-ft-se-dc));
312
+ // font-weight: var(--_ctm-dn-cd-an-im-ft-wt-dc, var(--_tst-dn-cd-an-im-ft-wt-dc));
313
+ // font-style: var(--_ctm-dn-cd-an-im-ft-se-ic-dc, var(--_tst-dn-cd-an-im-ft-se-ic-dc));
314
+ // text-align: var(--_ctm-dn-cd-an-im-tt-an-dc, var(--_tst-dn-cd-an-im-tt-an-dc));
315
+ // letter-spacing: var(--_ctm-dn-cd-an-im-lr-sg-dc, var(--_tst-dn-cd-an-im-lr-sg-dc));
316
+ // line-height: var(--_ctm-dn-cd-an-im-le-ht-dc, var(--_tst-dn-cd-an-im-le-ht-dc));
317
+ // }
318
+ // }
319
+
320
+ &[data-state="open"] {
321
+ // overflow: inherit;
322
+ // height: auto;
323
+
324
+ padding: var(
325
+ --_ctm-mob-dn-ed-an-im-pg-im,
326
+ var(--_ctm-tab-dn-ed-an-im-pg-im, var(--_ctm-dn-ed-an-im-pg-im))
327
+ );
328
+ gap: var(
329
+ --_ctm-mob-lt-te-ad-dn-sg,
330
+ var(--_ctm-tab-lt-te-ad-dn-sg, var(--_ctm-lt-te-ad-dn-sg))
331
+ );
332
+
333
+ --_self-active-gtr: minmax(
334
+ var(
335
+ --_ctm-mob-dn-cd-an-im-in-se,
336
+ var(--_ctm-tab-dn-cd-an-im-in-se, var(--_ctm-dn-cd-an-im-in-se))
337
+ ),
338
+ auto
339
+ )
340
+ minmax(50px, auto);
341
+
342
+ --_sf-dc-pd: var(--_sf-dvdr-gap, var(--_sf-cd-gp));
343
+ --_sf-dc-mb: var(--_sf-cd-gp);
344
+ --_sf-tt-pd: 0px;
345
+ --_sf-dc-pd-bt: var(--_sf-dvdr-gap, 0px);
346
+
347
+ border-color: var(
348
+ --_ctm-mob-dn-ed-an-im-br-cr,
349
+ var(--_ctm-tab-dn-ed-an-im-br-cr, var(--_ctm-dn-ed-an-im-br-cr))
350
+ );
351
+ border-style: var(
352
+ --_ctm-mob-dn-ed-an-im-br-se,
353
+ var(--_ctm-tab-dn-ed-an-im-br-se, var(--_ctm-dn-ed-an-im-br-se))
354
+ );
355
+ border-width: var(
356
+ --_ctm-mob-dn-ed-an-im-br-wh,
357
+ var(--_ctm-tab-dn-ed-an-im-br-wh, var(--_ctm-dn-ed-an-im-br-wh))
358
+ );
359
+ border-radius: var(
360
+ --_ctm-mob-dn-ed-an-im-br-rs,
361
+ var(--_ctm-tab-dn-ed-an-im-br-rs, var(--_ctm-dn-ed-an-im-br-rs))
362
+ );
363
+ box-shadow: var(
364
+ --_show-shadow,
365
+ var(
366
+ --_ctm-mob-dn-ed-an-im-sw-ae,
367
+ var(--_ctm-tab-dn-ed-an-im-sw-ae, var(--_ctm-dn-ed-an-im-sw-ae))
368
+ )
369
+ var(
370
+ --_ctm-mob-dn-ed-an-im-sw-br,
371
+ var(--_ctm-tab-dn-ed-an-im-sw-br, var(--_ctm-dn-ed-an-im-sw-br))
372
+ )
373
+ var(
374
+ --_ctm-mob-dn-ed-an-im-sw-sd,
375
+ var(--_ctm-tab-dn-ed-an-im-sw-sd, var(--_ctm-dn-ed-an-im-sw-sd))
376
+ )
377
+ var(
378
+ --_ctm-mob-dn-ed-an-im-sw-cr,
379
+ var(--_ctm-tab-dn-ed-an-im-sw-cr, var(--_ctm-dn-ed-an-im-sw-cr))
380
+ )
381
+ );
382
+ .accordion-title {
383
+ display: flex;
384
+ flex-direction: var(--_sf-fd, row);
385
+ align-content: center;
386
+ gap: var(--_sf-cd-gp);
387
+ align-items: center;
388
+ justify-content: var(--_sf-jc, space-between);
389
+ cursor: pointer;
390
+ // padding-block-end: var(--_sf-dc-pd, var(--_sf-pd-cd));
391
+ background-color: var(
392
+ --_ctm-mob-dn-ed-an-im-bd-cr,
393
+ var(--_ctm-tab-dn-ed-an-im-bd-cr, var(--_ctm-dn-ed-an-im-bd-cr))
394
+ );
395
+ padding: var(
396
+ --_ctm-mob-dn-ed-an-im-pg-te,
397
+ var(--_ctm-tab-dn-ed-an-im-pg-te, var(--_ctm-dn-ed-an-im-pg-te))
398
+ );
399
+
400
+ color: var(
401
+ --_ctm-mob-dn-ed-an-im-cr,
402
+ var(--_ctm-tab-dn-ed-an-im-cr, var(--_ctm-dn-ed-an-im-cr))
403
+ );
404
+ font-family: var(
405
+ --_ctm-mob-dn-ed-an-im-ft-fy,
406
+ var(--_ctm-tab-dn-ed-an-im-ft-fy, var(--_ctm-dn-ed-an-im-ft-fy))
407
+ );
408
+ font-size: var(
409
+ --_ctm-mob-dn-ed-an-im-ft-se,
410
+ var(--_ctm-tab-dn-ed-an-im-ft-se, var(--_ctm-dn-ed-an-im-ft-se))
411
+ );
412
+ font-weight: var(
413
+ --_ctm-mob-dn-ed-an-im-ft-wt,
414
+ var(--_ctm-tab-dn-ed-an-im-ft-wt, var(--_ctm-dn-ed-an-im-ft-wt))
415
+ );
416
+ font-style: var(
417
+ --_ctm-mob-dn-ed-an-im-ft-se-ic,
418
+ var(--_tst-tab-dn-ed-an-im-ft-se-ic, var(--_tst-dn-ed-an-im-ft-se-ic))
419
+ );
420
+ text-align: var(
421
+ --_ctm-mob-dn-ed-an-im-tt-an,
422
+ var(--_ctm-tab-dn-ed-an-im-tt-anvvar(--_ctm-dn-ed-an-im-tt-an))
423
+ );
424
+ letter-spacing: var(
425
+ --_ctm-mob-dn-ed-an-im-lr-sg,
426
+ var(--_ctm-tab-dn-ed-an-im-lr-sg, var(--_ctm-dn-ed-an-im-lr-sg))
427
+ );
428
+ line-height: var(
429
+ --_ctm-mob-dn-ed-an-im-le-ht,
430
+ var(--_ctm-tab-dn-ed-an-im-le-ht, var(--_ctm-dn-ed-an-im-le-ht))
431
+ );
432
+ // text-decoration: var(
433
+ // --_ctm-dn-ed-an-im-lh,
434
+ // var(--_ctm-dn-ed-an-im-ue),
435
+ // var(--_tst-dn-cd-an-im-lh)
436
+ // );
437
+ text-decoration: var(
438
+ --_ctm-mob-dn-ed-an-im-ue,
439
+ var(--_ctm-tab-dn-ed-an-im-ue, var(--_ctm-dn-ed-an-im-ue))
440
+ );
441
+ .icon {
442
+ display: var(--_sf-show-icon-ff, flex);
443
+ svg {
444
+ width: var(
445
+ --_ctm-mob-dn-ed-an-im-in-se,
446
+ var(--_ctm-tab-dn-ed-an-im-in-se, var(--_ctm-dn-ed-an-im-in-se))
447
+ );
448
+ height: var(
449
+ --_ctm-mob-dn-ed-an-im-in-se,
450
+ var(--_ctm-tab-dn-ed-an-im-in-se, var(--_ctm-dn-ed-an-im-in-se))
451
+ );
452
+ path {
453
+ stroke: var(
454
+ --_ctm-mob-dn-ed-an-im-in-c1,
455
+ var(--_ctm-tab-dn-ed-an-im-in-c1, var(--_ctm-dn-ed-an-im-in-c1))
456
+ );
457
+ }
458
+ }
459
+ }
460
+ }
461
+ .accordion-description {
462
+ display: block;
463
+ // padding-block-end: var(--_sf-dc-pd-bt);
464
+ background-color: var(
465
+ --_ctm-mob-dn-ed-an-im-bd-cr-dc,
466
+ var(--_ctm-tab-dn-ed-an-im-bd-cr-dc, var(--_ctm-dn-ed-an-im-bd-cr-dc))
467
+ );
468
+ padding: var(
469
+ --_ctm-mob-dn-ed-an-im-pg-dc,
470
+ var(--_ctm-tab-dn-ed-an-im-pg-dc, var(--_ctm-dn-ed-an-im-pg-dc))
471
+ );
472
+
473
+ color: var(
474
+ --_ctm-mob-dn-ed-an-im-cr-dc,
475
+ var(--_ctm-tab-dn-ed-an-im-cr-dc, var(--_ctm-dn-ed-an-im-cr-dc))
476
+ );
477
+ font-family: var(
478
+ --_ctm-mob-dn-ed-an-im-ft-fy-dc,
479
+ var(--_ctm-tab-dn-ed-an-im-ft-fy-dc, var(--_ctm-dn-ed-an-im-ft-fy-dc))
480
+ );
481
+ font-size: var(
482
+ --_ctm-mob-dn-ed-an-im-ft-se-dc,
483
+ var(--_ctm-tab-dn-ed-an-im-ft-se-dc, var(--_ctm-dn-ed-an-im-ft-se-dc))
484
+ );
485
+ font-weight: var(
486
+ --_ctm-mob-dn-ed-an-im-ft-wt-dc,
487
+ var(--_ctm-tab-dn-ed-an-im-ft-wt-dc, var(--_ctm-dn-ed-an-im-ft-wt-dc))
488
+ );
489
+ font-style: var(
490
+ --_ctm-mob-dn-ed-an-im-ft-se-ic-dc,
491
+ var(--_ctm-tab-dn-ed-an-im-ft-se-ic-dc, var(--_ctm-dn-ed-an-im-ft-se-ic-dc))
492
+ );
493
+ text-align: var(
494
+ --_ctm-mob-dn-ed-an-im-tt-an-dc,
495
+ var(--_ctm-tab-dn-ed-an-im-tt-an-dc, var(--_ctm-dn-ed-an-im-tt-an-dc))
496
+ );
497
+ letter-spacing: var(
498
+ --_ctm-mob-dn-ed-an-im-lr-sg-dc,
499
+ var(--_ctm-tab-dn-ed-an-im-lr-sg-dc, var(--_ctm-dn-ed-an-im-lr-sg-dc))
500
+ );
501
+ line-height: var(
502
+ --_ctm-mob-dn-ed-an-im-le-ht-dc,
503
+ var(--_ctm-tab-dn-ed-an-im-le-ht-dc, var(--_ctm-dn-ed-an-im-le-ht-dc))
504
+ );
505
+ text-decoration: var(
506
+ --_ctm-mob-dn-ed-an-im-ue-dc,
507
+ var(--_ctm-tab-dn-ed-an-im-ue-dc, var(--_ctm-dn-ed-an-im-ue-dc))
508
+ );
509
+ }
510
+ .accordion-title {
511
+ position: relative;
512
+ }
513
+ &[data-show-divider="true"] {
514
+ .accordion-title:not(:last-child)::before {
515
+ content: "";
516
+ position: absolute;
517
+ left: 0;
518
+ right: 0;
519
+ bottom: calc(
520
+ -1 *
521
+ (
522
+ var(
523
+ --_ctm-mob-lt-te-ad-dn-sg,
524
+ var(--_ctm-tab-lt-te-ad-dn-sg, var(--_ctm-lt-te-ad-dn-sg))
525
+ ) /
526
+ 2
527
+ )
528
+ );
529
+
530
+ height: var(
531
+ --_ctm-mob-dn-ed-an-im-dr-wt,
532
+ var(--_ctm-tab-dn-ed-an-im-dr-wt, var(--_ctm-dn-ed-an-im-dr-wt))
533
+ );
534
+ background-color: var(
535
+ --_ctm-mob-dn-ed-an-im-dr-cr,
536
+ var(--_ctm-tab-dn-ed-an-im-dr-cr, var(--_ctm-dn-ed-an-im-dr-cr))
537
+ );
538
+ }
539
+ }
540
+ }
541
+ }
542
+ .divider {
543
+ // height: var(
544
+ // --_ctm-mob-dn-wt-se-dr-wt,
545
+ // var(--_ctm-tab-dn-wt-se-dr-wt, var(--_ctm-dn-wt-se-dr-wt))
546
+ // );
547
+ // background-color: var(
548
+ // --_ctm-mob-dn-wt-se-dr-cr,
549
+ // var(--_ctm-tab-dn-wt-se-dr-cr, var(--_ctm-dn-wt-se-dr-cr))
550
+ // );
551
+ border: none; /* Remove default border */
552
+ height: var(
553
+ --_ctm-mob-dn-dr-dr-wt,
554
+ var(--_ctm-tab-dn-dr-dr-wt, var(--_ctm-dn-dr-dr-wt))
555
+ ); /* Set thickness */
556
+ background-color: var(
557
+ --_ctm-mob-dn-dr-dr-cr,
558
+ var(--_ctm-tab-dn-dr-dr-cr, var(--_ctm-dn-dr-dr-cr))
559
+ ); /* Set color */
560
+ // margin: 20px 0; /* Optional spacing */
561
+ // border-radius: 2px;
562
+ }
563
+ }
564
+ }