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

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 (128) hide show
  1. package/dist/add-existing-form.scss +13 -5
  2. package/dist/add-order.scss +126 -236
  3. package/dist/add-products-tab-details.scss +1048 -2097
  4. package/dist/add-products-tab.scss +666 -1204
  5. package/dist/allocation-header-quota-details.scss +189 -407
  6. package/dist/allocationDetails.scss +1661 -2143
  7. package/dist/allocations-quota-details.scss +159 -323
  8. package/dist/allocations.scss +475 -793
  9. package/dist/amount-estimator.scss +405 -743
  10. package/dist/badge.scss +43 -18
  11. package/dist/brand-basic-elements.scss +76 -124
  12. package/dist/brand.scss +28 -55
  13. package/dist/breadcrumbs.scss +356 -718
  14. package/dist/builder.js +1 -1
  15. package/dist/bulk-variant-picker.scss +1128 -2027
  16. package/dist/bundle.scss +841 -1477
  17. package/dist/bundleCategories.scss +301 -301
  18. package/dist/bundleDetails.scss +3774 -5072
  19. package/dist/button.scss +79 -103
  20. package/dist/buy-for-tab-container.scss +77 -106
  21. package/dist/buyForHeaders.scss +1722 -2976
  22. package/dist/cart-details.scss +481 -1012
  23. package/dist/cart-summary.scss +2234 -2826
  24. package/dist/cart-wrapper.scss +37 -79
  25. package/dist/cart.scss +117 -225
  26. package/dist/cartAttributes.scss +1103 -1422
  27. package/dist/category-groups-element.scss +127 -108
  28. package/dist/category-groups-product-grid.scss +120 -147
  29. package/dist/category-groups-product-image.scss +1162 -1457
  30. package/dist/category-groups-product-options.scss +613 -680
  31. package/dist/category-groups-product-price.scss +1966 -3244
  32. package/dist/category-groups-quota-details.scss +210 -464
  33. package/dist/category.scss +26 -50
  34. package/dist/checkout.scss +24 -16
  35. package/dist/confirm-modal.scss +22 -2
  36. package/dist/container.scss +32 -54
  37. package/dist/countdown.scss +711 -899
  38. package/dist/coupon.scss +1160 -1519
  39. package/dist/default-dropdown.scss +12 -1
  40. package/dist/embroider-template-1-v2.scss +123 -172
  41. package/dist/embroider-template-1.scss +68 -104
  42. package/dist/embroidery.scss +30 -31
  43. package/dist/employee-bulk-order.scss +418 -142
  44. package/dist/faq.scss +228 -408
  45. package/dist/filter-results.scss +125 -265
  46. package/dist/filters.scss +2143 -3040
  47. package/dist/gallery-slider-temp.scss +1458 -1776
  48. package/dist/global-styles.scss +218 -198
  49. package/dist/grid.scss +25 -33
  50. package/dist/hotspot.scss +68 -115
  51. package/dist/image-temp.scss +21 -20
  52. package/dist/item-stock.scss +9 -16
  53. package/dist/kitDetails.scss +2719 -4299
  54. package/dist/kits.scss +24 -19
  55. package/dist/language-selector.scss +211 -361
  56. package/dist/last-x-orders.scss +95 -174
  57. package/dist/layouter-item.scss +75 -103
  58. package/dist/layouter-pro-item.scss +89 -95
  59. package/dist/layouter-pro.scss +87 -92
  60. package/dist/layouter.scss +383 -445
  61. package/dist/light-box-v2.scss +89 -104
  62. package/dist/login.scss +287 -566
  63. package/dist/map.scss +1212 -1359
  64. package/dist/marchandiserSets.scss +95 -104
  65. package/dist/mega-menu-container.scss +96 -109
  66. package/dist/mega-menu.scss +624 -731
  67. package/dist/menu-item.scss +2 -2
  68. package/dist/menu-v2.scss +507 -619
  69. package/dist/multi-select-dropdown.scss +27 -3
  70. package/dist/my-templates.scss +38 -9
  71. package/dist/option-bar.scss +215 -375
  72. package/dist/order-status.scss +1790 -2187
  73. package/dist/overflow-module.scss +6 -7
  74. package/dist/past-orders.scss +118 -149
  75. package/dist/payment-methods.scss +46 -30
  76. package/dist/pickup-locations.scss +558 -1118
  77. package/dist/position-module.scss +20 -17
  78. package/dist/prefix-list.scss +21 -10
  79. package/dist/product-actions.scss +1750 -2055
  80. package/dist/product-basic-elements.scss +108 -169
  81. package/dist/product-highlights.scss +303 -348
  82. package/dist/product-image-allocation.scss +1477 -1477
  83. package/dist/product-image-bundles.scss +337 -642
  84. package/dist/product-inventory.scss +673 -1357
  85. package/dist/product-labels.scss +84 -105
  86. package/dist/product-options.scss +1287 -1444
  87. package/dist/product-price.scss +1283 -2561
  88. package/dist/product-promotions.scss +1388 -2830
  89. package/dist/product-sizechart.scss +516 -905
  90. package/dist/product.scss +28 -61
  91. package/dist/productDetails.scss +19 -39
  92. package/dist/profile.scss +207 -447
  93. package/dist/quantity-selector.scss +837 -1074
  94. package/dist/quick-inventory-check.scss +95 -174
  95. package/dist/quick-links.scss +55 -133
  96. package/dist/quick-order-pad.scss +218 -271
  97. package/dist/quota-details.scss +152 -282
  98. package/dist/quotes.scss +814 -847
  99. package/dist/repeater-embla-controls.scss +35 -15
  100. package/dist/repeater-grid-toggle.scss +156 -166
  101. package/dist/repeater-item.scss +41 -64
  102. package/dist/repeater.scss +671 -814
  103. package/dist/request-for-quotes.scss +66 -16
  104. package/dist/responsive-behaviour.scss +3 -1
  105. package/dist/rfqs.scss +118 -181
  106. package/dist/scroll.scss +93 -172
  107. package/dist/search-results-heading.scss +309 -309
  108. package/dist/search.scss +179 -326
  109. package/dist/section.scss +27 -51
  110. package/dist/shipping-payments.scss +198 -58
  111. package/dist/simple-list.scss +74 -164
  112. package/dist/social.scss +80 -145
  113. package/dist/sort.scss +168 -176
  114. package/dist/stack.scss +23 -34
  115. package/dist/static-global.scss +44 -26
  116. package/dist/stockStatus.scss +11 -19
  117. package/dist/store-locations.scss +577 -1105
  118. package/dist/tab-container.scss +81 -108
  119. package/dist/table-common.scss +217 -408
  120. package/dist/table.scss +271 -502
  121. package/dist/text-temp.scss +8 -7
  122. package/dist/theme-classes.scss +17 -13
  123. package/dist/uom-selector.scss +489 -949
  124. package/dist/user-elements.scss +2588 -2896
  125. package/dist/variant-picker.scss +1281 -2555
  126. package/dist/volume-pricing.scss +541 -1037
  127. package/dist/widget.scss +153 -153
  128. package/package.json +1 -1
package/dist/mega-menu.scss CHANGED
@@ -17,14 +17,11 @@ $vtl: "[data-element-type='mega-menu'] > .vtl";
17
17
  $hamburger: ".flex__menu__hamburger";
18
18
  $hamburgerActive: "[data-hamburger-active='true']";
19
19
  $wrapperData: (
20
- start: (
21
- left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
20
+ start: (left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
22
21
  ),
23
- end: (
24
- right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
22
+ end: (right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
25
23
  ),
26
- center: (
27
- left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
24
+ center: (left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
28
25
  transform: translateX(-50%),
29
26
  ),
30
27
  );
@@ -37,7 +34,8 @@ $defaultValues: (
37
34
  position: relative;
38
35
  display: var(--_d-flex);
39
36
  justify-content: prepareMediaVariable(--_ctm-meg-dn-hr-os-vl-at);
40
- & > div {
37
+
38
+ &>div {
41
39
  &#{$wrapper} {
42
40
  position: absolute;
43
41
  // left: var(--_sf-hm-mc-lt-vl-v2, 0px);
@@ -72,7 +70,7 @@ $defaultValues: (
72
70
  overflow-y: auto;
73
71
  }
74
72
 
75
- & > #{$menuItem} {
73
+ &>#{$menuItem} {
76
74
  width: 100%;
77
75
  align-items: flex-start;
78
76
  flex-direction: column;
@@ -83,14 +81,14 @@ $defaultValues: (
83
81
  // transform: none !important;
84
82
  // }
85
83
 
86
- & > #{$es} {
84
+ &>#{$es} {
87
85
  position: var(--_p-relative) !important;
88
86
  width: 100% !important;
89
87
  left: 0 !important;
90
88
  top: 0 !important;
91
89
 
92
90
  &:is(#{$mgc}) {
93
- & > .wrapper {
91
+ &>.wrapper {
94
92
  margin-inline: auto;
95
93
  }
96
94
  }
@@ -108,7 +106,7 @@ $defaultValues: (
108
106
  }
109
107
  }
110
108
 
111
- & > #{$hamburger} {
109
+ &>#{$hamburger} {
112
110
  display: var(--_d-flex);
113
111
  pointer-events: all;
114
112
  }
@@ -122,7 +120,7 @@ $defaultValues: (
122
120
  @include prepareMediaQueries($defaultValues);
123
121
  // var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, auto)))
124
122
 
125
- & > div {
123
+ &>div {
126
124
  &.wrapper {
127
125
  width: 100%;
128
126
  height: auto;
@@ -143,7 +141,7 @@ $defaultValues: (
143
141
  // }
144
142
 
145
143
  &.hrz {
146
- & > div {
144
+ &>div {
147
145
  &#{$wrapper} {
148
146
  display: var(--_d-flex);
149
147
  flex-direction: row;
@@ -155,7 +153,7 @@ $defaultValues: (
155
153
  }
156
154
 
157
155
  &.vtl {
158
- & > div {
156
+ &>div {
159
157
  &#{$wrapper} {
160
158
  display: var(--_d-flex);
161
159
  flex-direction: column;
@@ -164,7 +162,7 @@ $defaultValues: (
164
162
  }
165
163
  }
166
164
 
167
- & > div {
165
+ &>div {
168
166
  &#{$wrapper} {
169
167
  padding: #{prepareMediaVariable(--_ctm-meg-lt-pg)};
170
168
  background: prepareMediaVariable(--_ctm-meg-dn-mu-cr-bd-cr);
@@ -175,34 +173,29 @@ $defaultValues: (
175
173
  border-width: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-wh);
176
174
  border-style: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-se);
177
175
  }
176
+
178
177
  &:is([data-show-boxshadow="true"] > *) {
179
- box-shadow: prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-ae)
180
- prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-br)
181
- prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-sd)
182
- prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-cr);
178
+ box-shadow: prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-ae) prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-br) prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-sd) prepareMediaVariable(--_ctm-meg-dn-mu-cr-sw-cr);
183
179
  }
184
- & > div {
180
+
181
+ &>div {
185
182
  &#{$menuItem} {
186
183
  position: relative;
187
- padding: var(
188
- --_sf-it-at-pd,
189
- var(--_sf-it-hr-pd, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-pg)})
190
- );
191
- background: var(
192
- --_sf-it-at-bd,
193
- var(--_sf-it-hr-bd, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-bd-cr)})
194
- );
195
- border-radius: var(
196
- --_sf-it-at-br,
197
- var(--_sf-it-hr-br, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-rs)})
198
- );
184
+ padding: var(--_sf-it-at-pd,
185
+ var(--_sf-it-hr-pd, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-pg)}));
186
+ background: var(--_sf-it-at-bd,
187
+ var(--_sf-it-hr-bd, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-bd-cr)}));
188
+ border-radius: var(--_sf-it-at-br,
189
+ var(--_sf-it-hr-br, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-rs)}));
199
190
  display: var(--_d-flex);
200
191
  align-items: center;
192
+
201
193
  &:is(#{$vtl} *) {
202
194
  align-items: flex-start;
203
195
  flex-direction: column;
204
196
  gap: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)};
205
197
  }
198
+
206
199
  &:hover {
207
200
  --_sf-it-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-pg)};
208
201
  --_sf-it-hr-bd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-bd-cr)};
@@ -234,733 +227,633 @@ $defaultValues: (
234
227
 
235
228
  // Per-item leading icon hover overrides.
236
229
  --_sf-it-hr-in-cr-im: #{prepareMediaVariable(
237
- --_ctm-meg-dn-mu-im-se-hr-se-in-c1-im
238
- )};
239
- --_sf-it-hr-in-se-im: #{prepareMediaVariable(
240
- --_ctm-meg-dn-mu-im-se-hr-se-in-se-im
241
- )};
242
- }
243
- &.active {
244
- --_sf-it-at-pd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-pg)};
245
- --_sf-it-at-bd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-bd-cr)};
246
- --_sf-it-at-br: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-rs)};
247
- --_sf-it-at-brc: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-cr)};
248
- --_sf-it-at-bw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-wh)};
249
- --_sf-it-at-bs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-se)};
250
-
251
- --_sf-it-at-bsa: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-ae)};
252
- --_sf-it-at-blr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-br)};
253
- --_sf-it-at-spr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-sd)};
254
- --_sf-it-at-bscl: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-cr)};
255
-
256
- --_sf-it-at-ff: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-fy)};
257
- --_sf-it-at-fs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-se)};
258
- --_sf-it-at-fclr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-cr)};
259
- --_sf-it-at-fw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-wt)};
260
- --_sf-it-at-fsi: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-se-ic)};
261
- --_sf-it-at-td: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ue)};
262
- --_sf-it-at-tae: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-tt-an)};
263
- --_sf-it-at-ls: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-lr-sg)};
264
- --_sf-it-at-lh: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-le-ht)};
265
- --_sf-it-at-ttm: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-tt-tm)};
266
- --_sf-it-at-wwp: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-wd-wp)};
267
- --_sf-it-at-wbk: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-wd-bk)};
268
- --_sf-it-at-in-cr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-in-c1)};
269
- --_sf-it-at-in-se: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-in-se)};
270
-
271
- // Per-item leading icon selected-state overrides.
272
- --_sf-it-at-in-cr-im: #{prepareMediaVariable(
273
- --_ctm-meg-dn-mu-im-se-sd-se-in-c1-im
274
- )};
275
- --_sf-it-at-in-se-im: #{prepareMediaVariable(
276
- --_ctm-meg-dn-mu-im-se-sd-se-in-se-im
277
- )};
230
+ --_ctm-meg-dn-mu-im-se-hr-se-in-c1-im)
278
231
  }
279
232
 
280
- &[data-show-border="true"] {
281
- border-color: var(
282
- --_sf-it-at-brc,
283
- var(
284
- --_sf-it-hr-brc,
285
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-cr)}
286
- )
287
- );
288
- border-width: var(
289
- --_sf-it-at-bw,
290
- var(--_sf-it-hr-bw, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-wh)})
291
- );
292
- border-style: var(
293
- --_sf-it-at-bs,
294
- var(--_sf-it-hr-bs, prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-se))
295
- );
296
- }
297
- &[data-show-boxshadow="true"] {
298
- box-shadow: var(
299
- --_sf-it-at-bsa,
300
- var(
301
- --_sf-it-hr-bsa,
302
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-ae)}
303
- )
304
- )
305
- var(
306
- --_sf-it-at-blr,
307
- var(
308
- --_sf-it-hr-blr,
309
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-br)}
310
- )
311
- )
312
- var(
313
- --_sf-it-at-spr,
314
- var(
315
- --_sf-it-hr-spr,
316
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-sd)}
317
- )
318
- )
319
- var(
320
- --_sf-it-at-bscl,
321
- var(
322
- --_sf-it-hr-bscl,
323
- prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-cr)
324
- )
325
- );
326
- }
233
+ ;
234
+ --_sf-it-hr-in-se-im: #{prepareMediaVariable(
235
+ --_ctm-meg-dn-mu-im-se-hr-se-in-se-im)
236
+ }
327
237
 
328
- & > a {
329
- display: var(--_d-flex);
330
- justify-content: space-between;
331
- align-items: center;
332
- gap: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-gp);
333
- & > span {
334
- display: var(--_d-flex);
335
- font-family: var(
336
- --_sf-it-at-ff,
337
- var(
338
- --_sf-it-hr-ff,
339
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-fy)}
340
- )
341
- );
342
- &.flex__overflow {
343
- white-space: normal;
344
- @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
345
- }
346
- font-size: var(
347
- --_sf-it-at-fs,
348
- var(
349
- --_sf-it-hr-fs,
350
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-se)}
351
- )
352
- );
353
- color: var(
354
- --_sf-it-at-fclr,
355
- var(
356
- --_sf-it-hr-fclr,
357
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-cr)}
358
- )
359
- );
360
- font-weight: var(
361
- --_sf-it-at-fw,
362
- var(
363
- --_sf-it-hr-fw,
364
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-wt)}
365
- )
366
- );
367
- font-style: var(
368
- --_sf-it-at-fsi,
369
- var(
370
- --_sf-it-hr-fsi,
371
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-se-ic)}
372
- )
373
- );
374
- text-decoration: var(
375
- --_sf-it-at-td,
376
- var(--_sf-it-hr-td, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ue)})
377
- );
378
- text-align: var(
379
- --_sf-it-at-tae,
380
- var(
381
- --_sf-it-hr-tae,
382
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-tt-an)}
383
- )
384
- );
385
- letter-spacing: var(
386
- --_sf-it-at-ls,
387
- var(
388
- --_sf-it-hr-ls,
389
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-lr-sg)}
390
- )
391
- );
392
- line-height: var(
393
- --_sf-it-at-lh,
394
- var(
395
- --_sf-it-hr-lh,
396
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-le-ht)}
397
- )
398
- );
399
- text-transform: var(
400
- --_sf-it-at-ttm,
401
- var(
402
- --_sf-it-hr-ttm,
403
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-tt-tm, none)}
404
- )
405
- );
406
- word-wrap: var(
407
- --_sf-it-at-wwp,
408
- var(
409
- --_sf-it-hr-wwp,
410
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-wd-wp, normal)}
411
- )
412
- );
413
- word-break: var(
414
- --_sf-it-at-wbk,
415
- var(
416
- --_sf-it-hr-wbk,
417
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-wd-bk, keep-all)}
418
- )
419
- );
420
-
421
- // The item's own leading glyph, sized and coloured from the
422
- // `Item`-suffixed vars so it stays independent of the caret.
423
- &.flex__menu__item__leading__icon {
424
- flex: 0 0 auto;
425
- margin-inline-end: prepareMediaVariable(
426
- --_ctm-meg-dn-mu-im-se-dt-se-in-gp-im,
427
- 0px
428
- );
429
-
430
- svg {
431
- width: var(
432
- --_sf-it-at-in-se-im,
433
- var(
434
- --_sf-it-hr-in-se-im,
435
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se-im)}
436
- )
437
- );
438
- height: var(
439
- --_sf-it-at-in-se-im,
440
- var(
441
- --_sf-it-hr-in-se-im,
442
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se-im)}
443
- )
444
- );
445
-
446
- path {
447
- stroke: var(
448
- --_sf-it-at-in-cr-im,
449
- var(
450
- --_sf-it-hr-in-cr-im,
451
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-c1-im)}
452
- )
453
- );
454
- stroke-width: prepareMediaVariable(
455
- --_ctm-meg-dn-mu-im-se-dt-se-se-wh-im,
456
- 1.25
457
- );
458
- }
459
- }
460
- }
461
-
462
- &.flex__menu__item__icon {
463
- pointer-events: all;
464
- &[data-rotate="true"] {
465
- --_sf-svg-tr: 180deg;
466
- }
467
- svg {
468
- width: var(
469
- --_sf-it-at-in-se,
470
- var(
471
- --_sf-it-hr-in-se,
472
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se)}
473
- )
474
- );
475
- height: var(
476
- --_sf-it-at-in-se,
477
- var(
478
- --_sf-it-hr-in-se,
479
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se)}
480
- )
481
- );
482
- transform: rotate(#{var(--_sf-svg-tr, 0deg)});
483
- transition: transform var(--_transition-duration)
484
- var(--_transition-timing-function);
485
-
486
- path {
487
- stroke: var(
488
- --_sf-it-at-in-cr,
489
- var(
490
- --_sf-it-hr-in-cr,
491
- #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-c1)}
492
- )
493
- );
494
- // Overrides the stroke-width presentation attribute baked into the icon markup.
495
- stroke-width: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-se-wh, 1.25);
496
- }
497
- }
498
- }
499
- }
500
-
501
- // Let the label absorb the free space when a leading icon is
502
- // present, so `space-between` does not spread the three children.
503
- & > .flex__menu__item__leading__icon + span {
504
- flex: 1 1 auto;
505
- }
506
- }
238
+ ;
239
+ }
240
+
241
+ &.active {
242
+ --_sf-it-at-pd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-pg)};
243
+ --_sf-it-at-bd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-bd-cr)};
244
+ --_sf-it-at-br: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-rs)};
245
+ --_sf-it-at-brc: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-cr)};
246
+ --_sf-it-at-bw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-wh)};
247
+ --_sf-it-at-bs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-br-se)};
248
+
249
+ --_sf-it-at-bsa: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-ae)};
250
+ --_sf-it-at-blr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-br)};
251
+ --_sf-it-at-spr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-sd)};
252
+ --_sf-it-at-bscl: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-sw-cr)};
253
+
254
+ --_sf-it-at-ff: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-fy)};
255
+ --_sf-it-at-fs: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-se)};
256
+ --_sf-it-at-fclr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-cr)};
257
+ --_sf-it-at-fw: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-wt)};
258
+ --_sf-it-at-fsi: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ft-se-ic)};
259
+ --_sf-it-at-td: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-ue)};
260
+ --_sf-it-at-tae: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-tt-an)};
261
+ --_sf-it-at-ls: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-lr-sg)};
262
+ --_sf-it-at-lh: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-le-ht)};
263
+ --_sf-it-at-ttm: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-tt-tm)};
264
+ --_sf-it-at-wwp: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-wd-wp)};
265
+ --_sf-it-at-wbk: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-wd-bk)};
266
+ --_sf-it-at-in-cr: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-in-c1)};
267
+ --_sf-it-at-in-se: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-sd-se-in-se)};
268
+
269
+ // Per-item leading icon selected-state overrides.
270
+ --_sf-it-at-in-cr-im: #{prepareMediaVariable(
271
+ --_ctm-meg-dn-mu-im-se-sd-se-in-c1-im)
272
+ }
273
+
274
+ ;
275
+ --_sf-it-at-in-se-im: #{prepareMediaVariable(
276
+ --_ctm-meg-dn-mu-im-se-sd-se-in-se-im)
277
+ }
278
+
279
+ ;
280
+ }
281
+
282
+ &[data-show-border="true"] {
283
+ border-color: var(--_sf-it-at-brc,
284
+ var(--_sf-it-hr-brc,
285
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-cr)}));
286
+ border-width: var(--_sf-it-at-bw,
287
+ var(--_sf-it-hr-bw, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-wh)}));
288
+ border-style: var(--_sf-it-at-bs,
289
+ var(--_sf-it-hr-bs, prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-br-se)));
290
+ }
507
291
 
508
- & > #{$es} {
509
- position: var(--_p-absolute);
510
-
511
- &:is(.hrz > div > div > *) {
512
- top: 100%; // Need to Integrate top value
513
- &:is(#{$mgc}) {
514
- left: var(--_sf-mg-dm-ps-vl, 0px);
515
- }
516
-
517
- &:is(#{$smp}) {
518
- left: prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-x, 0px);
519
- }
520
- // left: 0px;
521
- }
522
- &:is(.vtl > div > div > *) {
523
- left: 100%; // Need to Integrate top value
524
-
525
- &:is(#{$mgc}) {
526
- // top: var(--_sf-mg-dm-ps-vl, 0px);
527
- top: 0px;
528
- }
529
- }
530
-
531
- display: var(--_sf-bm-es-at-dp-vl, var(--_d-none)) !important;
532
-
533
- &:is(#{$activeMg} > *) {
534
- --_sf-bm-es-at-dp-vl: var(--_d-grid) !important;
535
- }
292
+ &[data-show-boxshadow="true"] {
293
+ box-shadow: var(--_sf-it-at-bsa,
294
+ var(--_sf-it-hr-bsa,
295
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-ae)})) var(--_sf-it-at-blr,
296
+ var(--_sf-it-hr-blr,
297
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-br)})) var(--_sf-it-at-spr,
298
+ var(--_sf-it-hr-spr,
299
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-sd)})) var(--_sf-it-at-bscl,
300
+ var(--_sf-it-hr-bscl,
301
+ prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-sw-cr)));
302
+ }
303
+
304
+ &>a {
305
+ display: var(--_d-flex);
306
+ justify-content: space-between;
307
+ align-items: center;
308
+ gap: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-gp);
309
+
310
+ &>span {
311
+ display: var(--_d-flex);
312
+ font-family: var(--_sf-it-at-ff,
313
+ var(--_sf-it-hr-ff,
314
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-fy)}));
315
+
316
+ &.flex__overflow {
317
+ white-space: normal;
318
+ @include restrictToLinesShow(#{var(--_sf-line-clamp, 1)});
319
+ }
320
+
321
+ font-size: var(--_sf-it-at-fs,
322
+ var(--_sf-it-hr-fs,
323
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-se)}));
324
+ color: var(--_sf-it-at-fclr,
325
+ var(--_sf-it-hr-fclr,
326
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-cr)}));
327
+ font-weight: var(--_sf-it-at-fw,
328
+ var(--_sf-it-hr-fw,
329
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-wt)}));
330
+ font-style: var(--_sf-it-at-fsi,
331
+ var(--_sf-it-hr-fsi,
332
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ft-se-ic)}));
333
+ text-decoration: var(--_sf-it-at-td,
334
+ var(--_sf-it-hr-td, #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-ue)}));
335
+ text-align: var(--_sf-it-at-tae,
336
+ var(--_sf-it-hr-tae,
337
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-tt-an)}));
338
+ letter-spacing: var(--_sf-it-at-ls,
339
+ var(--_sf-it-hr-ls,
340
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-lr-sg)}));
341
+ line-height: var(--_sf-it-at-lh,
342
+ var(--_sf-it-hr-lh,
343
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-le-ht)}));
344
+ text-transform: var(--_sf-it-at-ttm,
345
+ var(--_sf-it-hr-ttm,
346
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-tt-tm, none)}));
347
+ word-wrap: var(--_sf-it-at-wwp,
348
+ var(--_sf-it-hr-wwp,
349
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-wd-wp, normal)}));
350
+ word-break: var(--_sf-it-at-wbk,
351
+ var(--_sf-it-hr-wbk,
352
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-wd-bk, keep-all)}));
353
+
354
+ // The item's own leading glyph, sized and coloured from the
355
+ // `Item`-suffixed vars so it stays independent of the caret.
356
+ &.flex__menu__item__leading__icon {
357
+ flex: 0 0 auto;
358
+ margin-inline-end: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-gp-im,
359
+ 0px);
360
+
361
+ svg {
362
+ width: var(--_sf-it-at-in-se-im,
363
+ var(--_sf-it-hr-in-se-im,
364
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se-im)}));
365
+ height: var(--_sf-it-at-in-se-im,
366
+ var(--_sf-it-hr-in-se-im,
367
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se-im)}));
368
+
369
+ path {
370
+ stroke: var(--_sf-it-at-in-cr-im,
371
+ var(--_sf-it-hr-in-cr-im,
372
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-c1-im)}));
373
+ stroke-width: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-se-wh-im,
374
+ 1.25);
536
375
  }
376
+ }
377
+ }
378
+
379
+ &.flex__menu__item__icon {
380
+ pointer-events: all;
537
381
 
538
- // Sub Item Container
539
-
540
- // & > ul {
541
- // &#{$subMenuContainer} {
542
- // background: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-bd-cr);
543
- // border-radius: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-rs);
544
- // padding: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-pg);
545
-
546
- // &:is(#{$hrz} *) {
547
- // position: absolute;
548
- // left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-x)});
549
- // width: calc(100% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-wh)});
550
- // top: calc(100% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)});
551
- // transform: translateX(-50%);
552
- // z-index: 2;
553
- // }
554
- // &:is(#{$vtl} *) {
555
- // width: 100%;
556
- // }
557
-
558
- // // max-height: 0px;
559
- // // overflow: clip;
560
- // max-height: 500px;
561
- // overflow-y: auto;
562
- // // animation: animTwo var(--_transition-duration)
563
- // // var(--_transition-timing-function) 1 forwards alternate;
564
-
565
- // @keyframes animTwo {
566
- // 100% {
567
- // max-height: 500px;
568
- // overflow-y: auto;
569
- // }
570
- // }
571
-
572
- // &[data-show-border="true"] {
573
- // border-width: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-wh);
574
- // border-color: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-cr);
575
- // border-style: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-se);
576
- // }
577
- // &[data-show-boxshadow="true"] {
578
- // box-shadow: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-ae)
579
- // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-br)
580
- // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-sd)
581
- // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-cr);
582
- // }
583
-
584
- // & > li {
585
- // &#{$subMenuItem} {
586
- // display: var(--_d-flex);
587
- // flex-direction: column;
588
-
589
- // padding: var(
590
- // --_sf-sb-it-at-pd,
591
- // var(
592
- // --_sf-sb-it-hr-pd,
593
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-pg)}
594
- // )
595
- // );
596
- // background: var(
597
- // --_sf-sb-it-at-bd,
598
- // var(
599
- // --_sf-sb-it-hr-bd,
600
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-bd-cr)}
601
- // )
602
- // );
603
- // border-radius: var(
604
- // --_sf-sb-it-at-br,
605
- // var(
606
- // --_sf-sb-it-hr-br,
607
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-rs)}
608
- // )
609
- // );
610
-
611
- // &[data-show-border="true"] {
612
- // border-color: var(
613
- // --_sf-sb-it-at-brc,
614
- // var(
615
- // --_sf-sb-it-hr-brc,
616
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-cr)}
617
- // )
618
- // );
619
- // border-width: var(
620
- // --_sf-sb-it-at-bw,
621
- // var(
622
- // --_sf-sb-it-hr-bw,
623
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-wh)}
624
- // )
625
- // );
626
- // border-style: var(
627
- // --_sf-sb-it-at-bs,
628
- // var(
629
- // --_sf-sb-it-hr-bs,
630
- // prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-se)
631
- // )
632
- // );
633
- // }
634
- // &[data-show-boxshadow="true"] {
635
- // box-shadow: var(
636
- // --_sf-sb-it-at-bsa,
637
- // var(
638
- // --_sf-sb-it-hr-bsa,
639
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-ae)}
640
- // )
641
- // )
642
- // var(
643
- // --_sf-sb-it-at-blr,
644
- // var(
645
- // --_sf-sb-it-hr-blr,
646
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-br)}
647
- // )
648
- // )
649
- // var(
650
- // --_sf-sb-it-at-spr,
651
- // var(
652
- // --_sf-sb-it-hr-spr,
653
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-sd)}
654
- // )
655
- // )
656
- // var(
657
- // --_sf-sb-it-at-bscl,
658
- // var(
659
- // --_sf-sb-it-hr-bscl,
660
- // prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-cr)
661
- // )
662
- // );
663
- // }
664
-
665
- // &:hover {
666
- // --_sf-sb-it-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-hr-se-pg)};
667
- // --_sf-sb-it-hr-bd: #{prepareMediaVariable(
668
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-bd-cr
669
- // )};
670
- // --_sf-sb-it-hr-br: #{prepareMediaVariable(
671
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-rs
672
- // )};
673
- // --_sf-sb-it-hr-brc: #{prepareMediaVariable(
674
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-cr
675
- // )};
676
- // --_sf-sb-it-hr-bw: #{prepareMediaVariable(
677
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-wh
678
- // )};
679
- // --_sf-sb-it-hr-bs: #{prepareMediaVariable(
680
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-se
681
- // )};
682
- // --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
683
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-ae
684
- // )};
685
- // --_sf-sb-it-hr-blr: #{prepareMediaVariable(
686
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-br
687
- // )};
688
- // --_sf-sb-it-hr-spr: #{prepareMediaVariable(
689
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-sd
690
- // )};
691
- // --_sf-sb-it-hr-bscl: #{prepareMediaVariable(
692
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-cr
693
- // )};
694
-
695
- // --_sf-sb-it-hr-ff: #{prepareMediaVariable(
696
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-fy
697
- // )};
698
- // --_sf-sb-it-hr-fs: #{prepareMediaVariable(
699
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-se
700
- // )};
701
- // --_sf-sb-it-hr-fclr: #{prepareMediaVariable(
702
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-cr
703
- // )};
704
- // --_sf-sb-it-hr-fw: #{prepareMediaVariable(
705
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-wt
706
- // )};
707
-
708
- // --_sf-sb-it-hr-fsi: #{prepareMediaVariable(
709
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-se-ic
710
- // )};
711
- // --_sf-sb-it-hr-td: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-hr-se-ue)};
712
- // --_sf-sb-it-hr-tae: #{prepareMediaVariable(
713
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-tt-an
714
- // )};
715
- // --_sf-sb-it-hr-ls: #{prepareMediaVariable(
716
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-lr-sg
717
- // )};
718
- // --_sf-sb-it-hr-lh: #{prepareMediaVariable(
719
- // --_ctm-meg-dn-sb-mu-im-se-hr-se-le-ht
720
- // )};
721
- // }
722
- // &.active {
723
- // --_sf-sb-it-at-pd: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-sd-se-pg)};
724
- // --_sf-sb-it-at-bd: #{prepareMediaVariable(
725
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-bd-cr
726
- // )};
727
- // --_sf-sb-it-at-br: #{prepareMediaVariable(
728
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-rs
729
- // )};
730
- // --_sf-sb-it-at-brc: #{prepareMediaVariable(
731
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-cr
732
- // )};
733
- // --_sf-sb-it-at-bw: #{prepareMediaVariable(
734
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-wh
735
- // )};
736
- // --_sf-sb-it-at-bs: #{prepareMediaVariable(
737
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-se
738
- // )};
739
- // --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
740
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-ae
741
- // )};
742
- // --_sf-sb-it-at-blr: #{prepareMediaVariable(
743
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-br
744
- // )};
745
- // --_sf-sb-it-at-spr: #{prepareMediaVariable(
746
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-sd
747
- // )};
748
- // --_sf-sb-it-at-bscl: #{prepareMediaVariable(
749
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-cr
750
- // )};
751
-
752
- // --_sf-sb-it-at-ff: #{prepareMediaVariable(
753
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-fy
754
- // )};
755
- // --_sf-sb-it-at-fs: #{prepareMediaVariable(
756
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-se
757
- // )};
758
- // --_sf-sb-it-at-fclr: #{prepareMediaVariable(
759
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-cr
760
- // )};
761
- // --_sf-sb-it-at-fw: #{prepareMediaVariable(
762
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-wt
763
- // )};
764
- // --_sf-sb-it-at-fsi: #{prepareMediaVariable(
765
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-se-ic
766
- // )};
767
- // --_sf-sb-it-at-td: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-sd-se-ue)};
768
- // --_sf-sb-it-at-tae: #{prepareMediaVariable(
769
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-tt-an
770
- // )};
771
- // --_sf-sb-it-at-ls: #{prepareMediaVariable(
772
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-lr-sg
773
- // )};
774
- // --_sf-sb-it-at-lh: #{prepareMediaVariable(
775
- // --_ctm-meg-dn-sb-mu-im-se-sd-se-le-ht
776
- // )};
777
- // }
778
-
779
- // & > a {
780
- // display: var(--_d-flex);
781
- // justify-content: space-between;
782
- // align-items: center;
783
-
784
- // & > span {
785
- // display: var(--_d-flex);
786
-
787
- // &#{$subMenuItemText} {
788
- // font-family: var(
789
- // --_sf-it-at-ff,
790
- // var(
791
- // --_sf-it-hr-ff,
792
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-fy)}
793
- // )
794
- // ),
795
- // font-size: var(
796
- // --_sf-sb-it-at-fs,
797
- // var(
798
- // --_sf-sb-it-hr-fs,
799
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-se)}
800
- // )
801
- // );
802
- // color: var(
803
- // --_sf-sb-it-at-fclr,
804
- // var(
805
- // --_sf-sb-it-hr-fclr,
806
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-cr)}
807
- // )
808
- // );
809
- // font-weight: var(
810
- // --_sf-sb-it-at-fw,
811
- // var(
812
- // --_sf-sb-it-hr-fw,
813
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-fw-se-ft-wt)}
814
- // )
815
- // );
816
- // font-style: var(
817
- // --_sf-sb-it-at-fsi,
818
- // var(
819
- // --_sf-sb-it-hr-fsi,
820
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-se-ic)}
821
- // )
822
- // );
823
- // text-decoration: var(
824
- // --_sf-sb-it-at-td,
825
- // var(
826
- // --_sf-sb-it-hr-td,
827
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ue)}
828
- // )
829
- // );
830
- // text-align: var(
831
- // --_sf-sb-it-at-tae,
832
- // var(
833
- // --_sf-sb-it-hr-tae,
834
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-tt-an)}
835
- // )
836
- // );
837
- // letter-spacing: var(
838
- // --_sf-sb-it-at-ls,
839
- // var(
840
- // --_sf-sb-it-hr-ls,
841
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-lr-sg)}
842
- // )
843
- // );
844
- // line-height: var(
845
- // --_sf-sb-it-at-lh,
846
- // var(
847
- // --_sf-sb-it-hr-lh,
848
- // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-le-ht)}
849
- // )
850
- // );
851
- // }
852
- // }
853
- // }
854
- // }
855
- // }
856
- // }
857
- // }
382
+ &[data-rotate="true"] {
383
+ --_sf-svg-tr: 180deg;
384
+ }
385
+
386
+ svg {
387
+ width: var(--_sf-it-at-in-se,
388
+ var(--_sf-it-hr-in-se,
389
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se)}));
390
+ height: var(--_sf-it-at-in-se,
391
+ var(--_sf-it-hr-in-se,
392
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-se)}));
393
+ transform: rotate(#{var(--_sf-svg-tr, 0deg)});
394
+ transition: transform var(--_transition-duration) var(--_transition-timing-function);
395
+
396
+ path {
397
+ stroke: var(--_sf-it-at-in-cr,
398
+ var(--_sf-it-hr-in-cr,
399
+ #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-in-c1)}));
400
+ // Overrides the stroke-width presentation attribute baked into the icon markup.
401
+ stroke-width: prepareMediaVariable(--_ctm-meg-dn-mu-im-se-dt-se-se-wh, 1.25);
402
+ }
858
403
  }
859
404
  }
860
405
  }
861
406
 
862
- & > p {
863
- &#{$nodatap} {
864
- font-size: 14px;
865
- color: var(--_gray-500);
866
- }
407
+ // Let the label absorb the free space when a leading icon is
408
+ // present, so `space-between` does not spread the three children.
409
+ &>.flex__menu__item__leading__icon+span {
410
+ flex: 1 1 auto;
867
411
  }
868
412
  }
869
- & > #{$hamburger} {
870
- display: var(--_d-none);
871
- padding: var(--_sf-hm-hr-pd, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-pg)});
872
- border-radius: var(
873
- --_sf-hm-hr-br,
874
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-rs)}
875
- );
876
- background: var(--_sf-hm-hr-bd, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-bd-cr)});
877
-
878
- &[data-show-border="true"] {
879
- border-style: var(
880
- --_sf-hm-hr-bs,
881
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-se)}
882
- );
883
- border-width: var(
884
- --_sf-hm-hr-bw,
885
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-wh)}
886
- );
887
- border-color: var(
888
- --_sf-hm-hr-bc,
889
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-cr)}
890
- );
891
- }
892
413
 
893
- &[data-show-boxshadow="true"] {
894
- box-shadow: var(
895
- --_sf-hm-hr-bsa,
896
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-ae)}
897
- )
898
- var(--_sf-hm-hr-blr, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-br)})
899
- var(--_sf-hm-hr-spr, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-sd)})
900
- var(--_sf-hm-hr-bscl, prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-cr));
901
- }
414
+ &>#{$es} {
415
+ position: var(--_p-absolute);
902
416
 
903
- &:hover {
904
- --_sf-hm-hr-ic-sz: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-in-se)};
905
- --_sf-hm-hr-ic-clr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-in-c1)};
417
+ &:is(.hrz > div > div > *) {
418
+ top: 100%; // Need to Integrate top value
906
419
 
907
- --_sf-hm-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-pg)};
908
- --_sf-hm-hr-br: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-rs)};
909
- --_sf-hm-hr-bd: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-bd-cr)};
420
+ &:is(#{$mgc}) {
421
+ left: var(--_sf-mg-dm-ps-vl, 0px);
422
+ }
910
423
 
911
- --_sf-hm-hr-bs: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-se)};
912
- --_sf-hm-hr-bw: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-wh)};
913
- --_sf-hm-hr-bc: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-cr)};
424
+ &:is(#{$smp}) {
425
+ left: prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-x, 0px);
426
+ }
914
427
 
915
- --_sf-hm-hr-bsa: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-ae)};
916
- --_sf-hm-hr-blr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-br)};
917
- --_sf-hm-hr-spr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-sd)};
918
- --_sf-hm-hr-bscl: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-cr)};
428
+ // left: 0px;
919
429
  }
920
430
 
921
- & > span {
922
- display: var(--_d-flex);
923
- align-items: center;
924
- justify-content: center;
925
- }
431
+ &:is(.vtl > div > div > *) {
432
+ left: 100%; // Need to Integrate top value
926
433
 
927
- svg {
928
- width: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-se)});
929
- height: var(
930
- --_sf-hm-hr-ic-sz,
931
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-se)}
932
- );
933
-
934
- path {
935
- stroke: var(
936
- --_sf-hm-hr-ic-clr,
937
- #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-c1)}
938
- );
939
- // Overrides the stroke-width presentation attribute baked into the icon
940
- // markup. Authored on the default state only, so it keeps applying on hover.
941
- stroke-width: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-se-wh, 1.25)};
434
+ &:is(#{$mgc}) {
435
+ // top: var(--_sf-mg-dm-ps-vl, 0px);
436
+ top: 0px;
942
437
  }
943
438
  }
944
- }
945
439
 
946
- @media only screen and (min-width: 10px) {
947
- &.dk {
948
- @include hamburgerCSS();
949
- }
950
- }
440
+ display: var(--_sf-bm-es-at-dp-vl, var(--_d-none)) !important;
951
441
 
952
- @media only screen and (min-width: 10px) and (max-width: 1023px) {
953
- &.tb {
954
- @include hamburgerCSS();
442
+ &:is(#{$activeMg} > *) {
443
+ --_sf-bm-es-at-dp-vl: var(--_d-grid) !important;
955
444
  }
956
445
  }
957
446
 
958
- @media only screen and (min-width: 10px) and (max-width: 767px) {
959
- &.mb {
960
- @include hamburgerCSS();
961
- }
962
- }
447
+ // Sub Item Container
448
+
449
+ // & > ul {
450
+ // &#{$subMenuContainer} {
451
+ // background: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-bd-cr);
452
+ // border-radius: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-rs);
453
+ // padding: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-pg);
454
+
455
+ // &:is(#{$hrz} *) {
456
+ // position: absolute;
457
+ // left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-x)});
458
+ // width: calc(100% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-wh)});
459
+ // top: calc(100% + #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)});
460
+ // transform: translateX(-50%);
461
+ // z-index: 2;
462
+ // }
463
+ // &:is(#{$vtl} *) {
464
+ // width: 100%;
465
+ // }
466
+
467
+ // // max-height: 0px;
468
+ // // overflow: clip;
469
+ // max-height: 500px;
470
+ // overflow-y: auto;
471
+ // // animation: animTwo var(--_transition-duration)
472
+ // // var(--_transition-timing-function) 1 forwards alternate;
473
+
474
+ // @keyframes animTwo {
475
+ // 100% {
476
+ // max-height: 500px;
477
+ // overflow-y: auto;
478
+ // }
479
+ // }
480
+
481
+ // &[data-show-border="true"] {
482
+ // border-width: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-wh);
483
+ // border-color: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-cr);
484
+ // border-style: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-br-se);
485
+ // }
486
+ // &[data-show-boxshadow="true"] {
487
+ // box-shadow: prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-ae)
488
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-br)
489
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-sd)
490
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-sw-cr);
491
+ // }
492
+
493
+ // & > li {
494
+ // &#{$subMenuItem} {
495
+ // display: var(--_d-flex);
496
+ // flex-direction: column;
497
+
498
+ // padding: var(
499
+ // --_sf-sb-it-at-pd,
500
+ // var(
501
+ // --_sf-sb-it-hr-pd,
502
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-pg)}
503
+ // )
504
+ // );
505
+ // background: var(
506
+ // --_sf-sb-it-at-bd,
507
+ // var(
508
+ // --_sf-sb-it-hr-bd,
509
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-bd-cr)}
510
+ // )
511
+ // );
512
+ // border-radius: var(
513
+ // --_sf-sb-it-at-br,
514
+ // var(
515
+ // --_sf-sb-it-hr-br,
516
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-rs)}
517
+ // )
518
+ // );
519
+
520
+ // &[data-show-border="true"] {
521
+ // border-color: var(
522
+ // --_sf-sb-it-at-brc,
523
+ // var(
524
+ // --_sf-sb-it-hr-brc,
525
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-cr)}
526
+ // )
527
+ // );
528
+ // border-width: var(
529
+ // --_sf-sb-it-at-bw,
530
+ // var(
531
+ // --_sf-sb-it-hr-bw,
532
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-wh)}
533
+ // )
534
+ // );
535
+ // border-style: var(
536
+ // --_sf-sb-it-at-bs,
537
+ // var(
538
+ // --_sf-sb-it-hr-bs,
539
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-br-se)
540
+ // )
541
+ // );
542
+ // }
543
+ // &[data-show-boxshadow="true"] {
544
+ // box-shadow: var(
545
+ // --_sf-sb-it-at-bsa,
546
+ // var(
547
+ // --_sf-sb-it-hr-bsa,
548
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-ae)}
549
+ // )
550
+ // )
551
+ // var(
552
+ // --_sf-sb-it-at-blr,
553
+ // var(
554
+ // --_sf-sb-it-hr-blr,
555
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-br)}
556
+ // )
557
+ // )
558
+ // var(
559
+ // --_sf-sb-it-at-spr,
560
+ // var(
561
+ // --_sf-sb-it-hr-spr,
562
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-sd)}
563
+ // )
564
+ // )
565
+ // var(
566
+ // --_sf-sb-it-at-bscl,
567
+ // var(
568
+ // --_sf-sb-it-hr-bscl,
569
+ // prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-sw-cr)
570
+ // )
571
+ // );
572
+ // }
573
+
574
+ // &:hover {
575
+ // --_sf-sb-it-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-hr-se-pg)};
576
+ // --_sf-sb-it-hr-bd: #{prepareMediaVariable(
577
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-bd-cr
578
+ // )};
579
+ // --_sf-sb-it-hr-br: #{prepareMediaVariable(
580
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-rs
581
+ // )};
582
+ // --_sf-sb-it-hr-brc: #{prepareMediaVariable(
583
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-cr
584
+ // )};
585
+ // --_sf-sb-it-hr-bw: #{prepareMediaVariable(
586
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-wh
587
+ // )};
588
+ // --_sf-sb-it-hr-bs: #{prepareMediaVariable(
589
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-br-se
590
+ // )};
591
+ // --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
592
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-ae
593
+ // )};
594
+ // --_sf-sb-it-hr-blr: #{prepareMediaVariable(
595
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-br
596
+ // )};
597
+ // --_sf-sb-it-hr-spr: #{prepareMediaVariable(
598
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-sd
599
+ // )};
600
+ // --_sf-sb-it-hr-bscl: #{prepareMediaVariable(
601
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-sw-cr
602
+ // )};
603
+
604
+ // --_sf-sb-it-hr-ff: #{prepareMediaVariable(
605
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-fy
606
+ // )};
607
+ // --_sf-sb-it-hr-fs: #{prepareMediaVariable(
608
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-se
609
+ // )};
610
+ // --_sf-sb-it-hr-fclr: #{prepareMediaVariable(
611
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-cr
612
+ // )};
613
+ // --_sf-sb-it-hr-fw: #{prepareMediaVariable(
614
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-wt
615
+ // )};
616
+
617
+ // --_sf-sb-it-hr-fsi: #{prepareMediaVariable(
618
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-ft-se-ic
619
+ // )};
620
+ // --_sf-sb-it-hr-td: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-hr-se-ue)};
621
+ // --_sf-sb-it-hr-tae: #{prepareMediaVariable(
622
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-tt-an
623
+ // )};
624
+ // --_sf-sb-it-hr-ls: #{prepareMediaVariable(
625
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-lr-sg
626
+ // )};
627
+ // --_sf-sb-it-hr-lh: #{prepareMediaVariable(
628
+ // --_ctm-meg-dn-sb-mu-im-se-hr-se-le-ht
629
+ // )};
630
+ // }
631
+ // &.active {
632
+ // --_sf-sb-it-at-pd: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-sd-se-pg)};
633
+ // --_sf-sb-it-at-bd: #{prepareMediaVariable(
634
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-bd-cr
635
+ // )};
636
+ // --_sf-sb-it-at-br: #{prepareMediaVariable(
637
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-rs
638
+ // )};
639
+ // --_sf-sb-it-at-brc: #{prepareMediaVariable(
640
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-cr
641
+ // )};
642
+ // --_sf-sb-it-at-bw: #{prepareMediaVariable(
643
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-wh
644
+ // )};
645
+ // --_sf-sb-it-at-bs: #{prepareMediaVariable(
646
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-br-se
647
+ // )};
648
+ // --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
649
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-ae
650
+ // )};
651
+ // --_sf-sb-it-at-blr: #{prepareMediaVariable(
652
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-br
653
+ // )};
654
+ // --_sf-sb-it-at-spr: #{prepareMediaVariable(
655
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-sd
656
+ // )};
657
+ // --_sf-sb-it-at-bscl: #{prepareMediaVariable(
658
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-sw-cr
659
+ // )};
660
+
661
+ // --_sf-sb-it-at-ff: #{prepareMediaVariable(
662
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-fy
663
+ // )};
664
+ // --_sf-sb-it-at-fs: #{prepareMediaVariable(
665
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-se
666
+ // )};
667
+ // --_sf-sb-it-at-fclr: #{prepareMediaVariable(
668
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-cr
669
+ // )};
670
+ // --_sf-sb-it-at-fw: #{prepareMediaVariable(
671
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-wt
672
+ // )};
673
+ // --_sf-sb-it-at-fsi: #{prepareMediaVariable(
674
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-ft-se-ic
675
+ // )};
676
+ // --_sf-sb-it-at-td: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-sd-se-ue)};
677
+ // --_sf-sb-it-at-tae: #{prepareMediaVariable(
678
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-tt-an
679
+ // )};
680
+ // --_sf-sb-it-at-ls: #{prepareMediaVariable(
681
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-lr-sg
682
+ // )};
683
+ // --_sf-sb-it-at-lh: #{prepareMediaVariable(
684
+ // --_ctm-meg-dn-sb-mu-im-se-sd-se-le-ht
685
+ // )};
686
+ // }
687
+
688
+ // & > a {
689
+ // display: var(--_d-flex);
690
+ // justify-content: space-between;
691
+ // align-items: center;
692
+
693
+ // & > span {
694
+ // display: var(--_d-flex);
695
+
696
+ // &#{$subMenuItemText} {
697
+ // font-family: var(
698
+ // --_sf-it-at-ff,
699
+ // var(
700
+ // --_sf-it-hr-ff,
701
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-fy)}
702
+ // )
703
+ // ),
704
+ // font-size: var(
705
+ // --_sf-sb-it-at-fs,
706
+ // var(
707
+ // --_sf-sb-it-hr-fs,
708
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-se)}
709
+ // )
710
+ // );
711
+ // color: var(
712
+ // --_sf-sb-it-at-fclr,
713
+ // var(
714
+ // --_sf-sb-it-hr-fclr,
715
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-cr)}
716
+ // )
717
+ // );
718
+ // font-weight: var(
719
+ // --_sf-sb-it-at-fw,
720
+ // var(
721
+ // --_sf-sb-it-hr-fw,
722
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-fw-se-ft-wt)}
723
+ // )
724
+ // );
725
+ // font-style: var(
726
+ // --_sf-sb-it-at-fsi,
727
+ // var(
728
+ // --_sf-sb-it-hr-fsi,
729
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ft-se-ic)}
730
+ // )
731
+ // );
732
+ // text-decoration: var(
733
+ // --_sf-sb-it-at-td,
734
+ // var(
735
+ // --_sf-sb-it-hr-td,
736
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-ue)}
737
+ // )
738
+ // );
739
+ // text-align: var(
740
+ // --_sf-sb-it-at-tae,
741
+ // var(
742
+ // --_sf-sb-it-hr-tae,
743
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-tt-an)}
744
+ // )
745
+ // );
746
+ // letter-spacing: var(
747
+ // --_sf-sb-it-at-ls,
748
+ // var(
749
+ // --_sf-sb-it-hr-ls,
750
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-lr-sg)}
751
+ // )
752
+ // );
753
+ // line-height: var(
754
+ // --_sf-sb-it-at-lh,
755
+ // var(
756
+ // --_sf-sb-it-hr-lh,
757
+ // #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-im-se-dt-se-le-ht)}
758
+ // )
759
+ // );
760
+ // }
761
+ // }
762
+ // }
763
+ // }
764
+ // }
765
+ // }
766
+ // }
963
767
  }
964
768
  }
965
769
  }
770
+
771
+ &>p {
772
+ &#{$nodatap} {
773
+ font-size: 14px;
774
+ color: var(--_gray-500);
775
+ }
776
+ }
777
+ }
778
+
779
+ &>#{$hamburger} {
780
+ display: var(--_d-none);
781
+ padding: var(--_sf-hm-hr-pd, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-pg)});
782
+ border-radius: var(--_sf-hm-hr-br,
783
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-rs)});
784
+ background: var(--_sf-hm-hr-bd, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-bd-cr)});
785
+
786
+ &[data-show-border="true"] {
787
+ border-style: var(--_sf-hm-hr-bs,
788
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-se)});
789
+ border-width: var(--_sf-hm-hr-bw,
790
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-wh)});
791
+ border-color: var(--_sf-hm-hr-bc,
792
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-cr)});
793
+ }
794
+
795
+ &[data-show-boxshadow="true"] {
796
+ box-shadow: var(--_sf-hm-hr-bsa,
797
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-ae)}) var(--_sf-hm-hr-blr, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-br)}) var(--_sf-hm-hr-spr, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-sd)}) var(--_sf-hm-hr-bscl, prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-sw-cr));
798
+ }
799
+
800
+ &:hover {
801
+ --_sf-hm-hr-ic-sz: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-in-se)};
802
+ --_sf-hm-hr-ic-clr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-in-c1)};
803
+
804
+ --_sf-hm-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-pg)};
805
+ --_sf-hm-hr-br: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-rs)};
806
+ --_sf-hm-hr-bd: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-bd-cr)};
807
+
808
+ --_sf-hm-hr-bs: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-se)};
809
+ --_sf-hm-hr-bw: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-br-wh)};
810
+ --_sf-hm-hr-bc: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-br-cr)};
811
+
812
+ --_sf-hm-hr-bsa: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-ae)};
813
+ --_sf-hm-hr-blr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-br)};
814
+ --_sf-hm-hr-spr: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-sd)};
815
+ --_sf-hm-hr-bscl: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-hr-se-sw-cr)};
816
+ }
817
+
818
+ &>span {
819
+ display: var(--_d-flex);
820
+ align-items: center;
821
+ justify-content: center;
822
+ }
823
+
824
+ svg {
825
+ width: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-se)});
826
+ height: var(--_sf-hm-hr-ic-sz,
827
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-se)});
828
+
829
+ path {
830
+ stroke: var(--_sf-hm-hr-ic-clr,
831
+ #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-in-c1)});
832
+ // Overrides the stroke-width presentation attribute baked into the icon
833
+ // markup. Authored on the default state only, so it keeps applying on hover.
834
+ stroke-width: #{prepareMediaVariable(--_ctm-meg-dn-hr-se-dt-se-se-wh, 1.25)};
835
+ }
836
+ }
837
+ }
838
+
839
+ @media only screen and (min-width: 10px) {
840
+ &.dk {
841
+ @include hamburgerCSS();
842
+ }
843
+ }
844
+
845
+ @media only screen and (min-width: 10px) and (max-width: 1023px) {
846
+ &.tb {
847
+ @include hamburgerCSS();
848
+ }
849
+ }
850
+
851
+ @media only screen and (min-width: 10px) and (max-width: 767px) {
852
+ &.mb {
853
+ @include hamburgerCSS();
854
+ }
855
+ }
856
+ }
857
+ }
966
858
  }
859
+ }