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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (135) hide show
  1. package/dist/add-existing-form.scss +5 -13
  2. package/dist/add-order.scss +236 -126
  3. package/dist/add-products-tab-details.scss +2097 -1048
  4. package/dist/add-products-tab.scss +1204 -666
  5. package/dist/allocation-header-quota-details.scss +407 -189
  6. package/dist/allocationDetails.scss +2143 -1661
  7. package/dist/allocations-quota-details.scss +323 -159
  8. package/dist/allocations.scss +793 -475
  9. package/dist/amount-estimator.scss +743 -405
  10. package/dist/badge.scss +18 -43
  11. package/dist/brand-basic-elements.scss +124 -76
  12. package/dist/brand.scss +55 -28
  13. package/dist/breadcrumbs.scss +718 -356
  14. package/dist/builder.js +1 -1
  15. package/dist/builderLite.js +1 -1
  16. package/dist/bulk-variant-picker.scss +2027 -1128
  17. package/dist/bundle.scss +1477 -841
  18. package/dist/bundleDetails.scss +5072 -3774
  19. package/dist/button.scss +103 -79
  20. package/dist/buy-for-tab-container.scss +106 -77
  21. package/dist/buyForHeaders.scss +2976 -1722
  22. package/dist/cart-details.scss +1012 -481
  23. package/dist/cart-summary.scss +1149 -557
  24. package/dist/cart-wrapper.scss +79 -37
  25. package/dist/cart.scss +225 -117
  26. package/dist/cartAttributes.scss +735 -416
  27. package/dist/category-groups-element.scss +108 -127
  28. package/dist/category-groups-product-grid.scss +147 -120
  29. package/dist/category-groups-product-image.scss +1457 -1162
  30. package/dist/category-groups-product-options.scss +680 -613
  31. package/dist/category-groups-product-price.scss +3244 -1966
  32. package/dist/category-groups-quota-details.scss +464 -210
  33. package/dist/category.scss +50 -26
  34. package/dist/checkout.scss +16 -24
  35. package/dist/confirm-modal.scss +2 -22
  36. package/dist/container.scss +54 -32
  37. package/dist/countdown.scss +443 -255
  38. package/dist/coupon.scss +710 -351
  39. package/dist/default-dropdown.scss +1 -12
  40. package/dist/embroider-template-1-v2.scss +172 -123
  41. package/dist/embroider-template-1.scss +104 -68
  42. package/dist/embroidery.scss +31 -30
  43. package/dist/employee-bulk-order.scss +142 -418
  44. package/dist/faq.scss +408 -228
  45. package/dist/filter-results.scss +265 -125
  46. package/dist/filters.scss +1797 -900
  47. package/dist/gallery-slider-temp.scss +750 -432
  48. package/dist/global-styles.scss +7 -23
  49. package/dist/grid.scss +33 -25
  50. package/dist/hotspot.scss +115 -68
  51. package/dist/image-temp.scss +20 -21
  52. package/dist/item-stock.scss +16 -9
  53. package/dist/kitDetails.scss +4301 -2721
  54. package/dist/kits.scss +19 -24
  55. package/dist/language-selector.scss +361 -211
  56. package/dist/last-x-orders.scss +174 -95
  57. package/dist/layouter-item.scss +103 -75
  58. package/dist/layouter-pro-item.scss +95 -89
  59. package/dist/layouter-pro.scss +92 -87
  60. package/dist/layouter.scss +445 -383
  61. package/dist/light-box-v2.scss +104 -89
  62. package/dist/login.scss +566 -287
  63. package/dist/map.scss +368 -221
  64. package/dist/marchandiserSets.scss +104 -95
  65. package/dist/mega-menu-container.scss +109 -96
  66. package/dist/mega-menu.scss +731 -624
  67. package/dist/menu-item.scss +2 -2
  68. package/dist/menu-v2.scss +619 -507
  69. package/dist/multi-select-dropdown.scss +3 -27
  70. package/dist/my-templates.scss +9 -38
  71. package/dist/option-bar.scss +375 -215
  72. package/dist/option-families.scss +252 -0
  73. package/dist/order-status.scss +1117 -646
  74. package/dist/overflow-module.scss +7 -6
  75. package/dist/past-orders.scss +149 -118
  76. package/dist/payment-methods.scss +30 -46
  77. package/dist/pickup-locations.scss +1118 -558
  78. package/dist/position-module.scss +17 -20
  79. package/dist/prefix-list.scss +10 -21
  80. package/dist/product-actions.scss +2316 -1610
  81. package/dist/product-basic-elements.scss +169 -108
  82. package/dist/product-highlights.scss +152 -107
  83. package/dist/product-image-bundles.scss +642 -337
  84. package/dist/product-inventory.scss +1357 -673
  85. package/dist/product-labels.scss +105 -84
  86. package/dist/product-options.scss +1274 -1117
  87. package/dist/product-price.scss +2561 -1283
  88. package/dist/product-promotions.scss +2830 -1388
  89. package/dist/product-sizechart.scss +905 -516
  90. package/dist/product.scss +61 -28
  91. package/dist/productDetails.scss +39 -19
  92. package/dist/profile.scss +447 -207
  93. package/dist/quantity-selector.scss +550 -313
  94. package/dist/quick-inventory-check.scss +174 -95
  95. package/dist/quick-links.scss +133 -55
  96. package/dist/quick-order-pad.scss +271 -218
  97. package/dist/quota-details.scss +282 -152
  98. package/dist/quotes.scss +122 -89
  99. package/dist/repeater-embla-controls.scss +15 -35
  100. package/dist/repeater-grid-toggle.scss +166 -156
  101. package/dist/repeater-item.scss +64 -41
  102. package/dist/repeater.scss +814 -671
  103. package/dist/request-for-quotes.scss +16 -66
  104. package/dist/responsive-behaviour.scss +1 -3
  105. package/dist/rfqs.scss +181 -118
  106. package/dist/scroll.scss +172 -93
  107. package/dist/search.scss +326 -179
  108. package/dist/section.scss +51 -27
  109. package/dist/shipping-payments.scss +58 -198
  110. package/dist/simple-list.scss +164 -74
  111. package/dist/social.scss +145 -80
  112. package/dist/sort.scss +19 -11
  113. package/dist/stack.scss +34 -23
  114. package/dist/static-global.scss +26 -44
  115. package/dist/stockStatus.scss +19 -11
  116. package/dist/store-locations.scss +1105 -577
  117. package/dist/tab-container.scss +108 -81
  118. package/dist/table-common.scss +408 -217
  119. package/dist/table.scss +502 -271
  120. package/dist/text-temp.scss +7 -8
  121. package/dist/theme-classes.scss +13 -17
  122. package/dist/types/builder/enums/data-connectors.d.ts +3 -1
  123. package/dist/types/builder/enums/index.d.ts +3 -1
  124. package/dist/types/builder/tools/element-edit/index.d.ts +2 -1
  125. package/dist/types/builder/tools/element-edit/optionFamilies.d.ts +20 -0
  126. package/dist/types/website/constants/data-connector-souces.d.ts +40 -8
  127. package/dist/types/website/constants/data-connectors.d.ts +12 -1
  128. package/dist/types/website/helper/ssr-functions.d.ts +8 -0
  129. package/dist/uom-selector.scss +949 -489
  130. package/dist/user-elements.scss +837 -529
  131. package/dist/variant-picker.scss +2555 -1281
  132. package/dist/volume-pricing.scss +1037 -541
  133. package/dist/website.js +1 -1
  134. package/dist/widget.scss +1 -0
  135. package/package.json +1 -1
package/dist/mega-menu.scss CHANGED
@@ -17,11 +17,14 @@ $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: (left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
20
+ start: (
21
+ left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
21
22
  ),
22
- end: (right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
23
+ end: (
24
+ right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
23
25
  ),
24
- center: (left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
26
+ center: (
27
+ left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
25
28
  transform: translateX(-50%),
26
29
  ),
27
30
  );
@@ -34,8 +37,7 @@ $defaultValues: (
34
37
  position: relative;
35
38
  display: var(--_d-flex);
36
39
  justify-content: prepareMediaVariable(--_ctm-meg-dn-hr-os-vl-at);
37
-
38
- &>div {
40
+ & > div {
39
41
  &#{$wrapper} {
40
42
  position: absolute;
41
43
  // left: var(--_sf-hm-mc-lt-vl-v2, 0px);
@@ -70,7 +72,7 @@ $defaultValues: (
70
72
  overflow-y: auto;
71
73
  }
72
74
 
73
- &>#{$menuItem} {
75
+ & > #{$menuItem} {
74
76
  width: 100%;
75
77
  align-items: flex-start;
76
78
  flex-direction: column;
@@ -81,14 +83,14 @@ $defaultValues: (
81
83
  // transform: none !important;
82
84
  // }
83
85
 
84
- &>#{$es} {
86
+ & > #{$es} {
85
87
  position: var(--_p-relative) !important;
86
88
  width: 100% !important;
87
89
  left: 0 !important;
88
90
  top: 0 !important;
89
91
 
90
92
  &:is(#{$mgc}) {
91
- &>.wrapper {
93
+ & > .wrapper {
92
94
  margin-inline: auto;
93
95
  }
94
96
  }
@@ -106,7 +108,7 @@ $defaultValues: (
106
108
  }
107
109
  }
108
110
 
109
- &>#{$hamburger} {
111
+ & > #{$hamburger} {
110
112
  display: var(--_d-flex);
111
113
  pointer-events: all;
112
114
  }
@@ -120,7 +122,7 @@ $defaultValues: (
120
122
  @include prepareMediaQueries($defaultValues);
121
123
  // var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, auto)))
122
124
 
123
- &>div {
125
+ & > div {
124
126
  &.wrapper {
125
127
  width: 100%;
126
128
  height: auto;
@@ -141,7 +143,7 @@ $defaultValues: (
141
143
  // }
142
144
 
143
145
  &.hrz {
144
- &>div {
146
+ & > div {
145
147
  &#{$wrapper} {
146
148
  display: var(--_d-flex);
147
149
  flex-direction: row;
@@ -153,7 +155,7 @@ $defaultValues: (
153
155
  }
154
156
 
155
157
  &.vtl {
156
- &>div {
158
+ & > div {
157
159
  &#{$wrapper} {
158
160
  display: var(--_d-flex);
159
161
  flex-direction: column;
@@ -162,7 +164,7 @@ $defaultValues: (
162
164
  }
163
165
  }
164
166
 
165
- &>div {
167
+ & > div {
166
168
  &#{$wrapper} {
167
169
  padding: #{prepareMediaVariable(--_ctm-meg-lt-pg)};
168
170
  background: prepareMediaVariable(--_ctm-meg-dn-mu-cr-bd-cr);
@@ -173,29 +175,34 @@ $defaultValues: (
173
175
  border-width: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-wh);
174
176
  border-style: prepareMediaVariable(--_ctm-meg-dn-mu-cr-br-se);
175
177
  }
176
-
177
178
  &:is([data-show-boxshadow="true"] > *) {
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);
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);
179
183
  }
180
-
181
- &>div {
184
+ & > div {
182
185
  &#{$menuItem} {
183
186
  position: relative;
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)}));
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
+ );
190
199
  display: var(--_d-flex);
191
200
  align-items: center;
192
-
193
201
  &:is(#{$vtl} *) {
194
202
  align-items: flex-start;
195
203
  flex-direction: column;
196
204
  gap: #{prepareMediaVariable(--_ctm-meg-dn-sb-mu-cr-cr-ot-y)};
197
205
  }
198
-
199
206
  &:hover {
200
207
  --_sf-it-hr-pd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-pg)};
201
208
  --_sf-it-hr-bd: #{prepareMediaVariable(--_ctm-meg-dn-mu-im-se-hr-se-bd-cr)};
@@ -227,633 +234,733 @@ $defaultValues: (
227
234
 
228
235
  // Per-item leading icon hover overrides.
229
236
  --_sf-it-hr-in-cr-im: #{prepareMediaVariable(
230
- --_ctm-meg-dn-mu-im-se-hr-se-in-c1-im)
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
+ )};
231
242
  }
232
-
233
- ;
234
- --_sf-it-hr-in-se-im: #{prepareMediaVariable(
235
- --_ctm-meg-dn-mu-im-se-hr-se-in-se-im)
236
- }
237
-
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
- }
291
-
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);
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
+ )};
375
278
  }
376
- }
377
- }
378
279
 
379
- &.flex__menu__item__icon {
380
- pointer-events: all;
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
+ }
381
327
 
382
- &[data-rotate="true"] {
383
- --_sf-svg-tr: 180deg;
384
- }
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
+ }
385
507
 
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);
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
+ }
402
536
  }
537
+
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
+ // }
403
858
  }
404
859
  }
405
860
  }
406
861
 
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;
862
+ & > p {
863
+ &#{$nodatap} {
864
+ font-size: 14px;
865
+ color: var(--_gray-500);
866
+ }
411
867
  }
412
868
  }
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
+ }
413
892
 
414
- &>#{$es} {
415
- position: var(--_p-absolute);
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
+ }
416
902
 
417
- &:is(.hrz > div > div > *) {
418
- top: 100%; // Need to Integrate top value
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)};
419
906
 
420
- &:is(#{$mgc}) {
421
- left: var(--_sf-mg-dm-ps-vl, 0px);
422
- }
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)};
423
910
 
424
- &:is(#{$smp}) {
425
- left: prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-x, 0px);
426
- }
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)};
427
914
 
428
- // left: 0px;
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)};
429
919
  }
430
920
 
431
- &:is(.vtl > div > div > *) {
432
- left: 100%; // Need to Integrate top value
921
+ & > span {
922
+ display: var(--_d-flex);
923
+ align-items: center;
924
+ justify-content: center;
925
+ }
433
926
 
434
- &:is(#{$mgc}) {
435
- // top: var(--_sf-mg-dm-ps-vl, 0px);
436
- top: 0px;
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)};
437
942
  }
438
943
  }
944
+ }
439
945
 
440
- display: var(--_sf-bm-es-at-dp-vl, var(--_d-none)) !important;
946
+ @media only screen and (min-width: 10px) {
947
+ &.dk {
948
+ @include hamburgerCSS();
949
+ }
950
+ }
441
951
 
442
- &:is(#{$activeMg} > *) {
443
- --_sf-bm-es-at-dp-vl: var(--_d-grid) !important;
952
+ @media only screen and (min-width: 10px) and (max-width: 1023px) {
953
+ &.tb {
954
+ @include hamburgerCSS();
444
955
  }
445
956
  }
446
957
 
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
- // }
958
+ @media only screen and (min-width: 10px) and (max-width: 767px) {
959
+ &.mb {
960
+ @include hamburgerCSS();
961
+ }
962
+ }
767
963
  }
768
964
  }
769
965
  }
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
- }
858
966
  }
859
- }