@sc-360-v2/storefront-cms-library 0.4.51 → 0.4.53

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 (40) hide show
  1. package/dist/allocationDetails.scss +2253 -2247
  2. package/dist/builder.js +1 -1
  3. package/dist/bundleDetails.scss +2 -0
  4. package/dist/cart-details.scss +3207 -3207
  5. package/dist/cart.scss +271 -269
  6. package/dist/cartAttributes.scss +932 -935
  7. package/dist/checkout.scss +6496 -6460
  8. package/dist/dropdownTemplate.scss +4 -1
  9. package/dist/filters.scss +36 -4
  10. package/dist/functions.scss +91 -1
  11. package/dist/icon-list.scss +277 -268
  12. package/dist/language-selector.scss +702 -528
  13. package/dist/layouter.scss +307 -294
  14. package/dist/login.scss +1605 -1473
  15. package/dist/menu-v2.scss +752 -730
  16. package/dist/my-templates.scss +464 -463
  17. package/dist/myTemplates.scss +5 -5
  18. package/dist/order-status.scss +1877 -1856
  19. package/dist/product-image-allocation.scss +1365 -0
  20. package/dist/product-image-bundles.scss +1 -0
  21. package/dist/product-image.scss +6 -2
  22. package/dist/product-sizechart.scss +1826 -1826
  23. package/dist/profile.scss +23 -20
  24. package/dist/repeater-embla-controls.scss +6 -0
  25. package/dist/repeater.scss +920 -915
  26. package/dist/search.scss +361 -296
  27. package/dist/static-global.scss +5 -0
  28. package/dist/types/builder/tools/element-edit/bundle.d.ts +13 -2
  29. package/dist/types/builder/tools/element-edit/cart.d.ts +1 -0
  30. package/dist/types/builder/tools/element-edit/common.d.ts +5 -0
  31. package/dist/types/builder/tools/element-edit/icon-list.d.ts +17 -0
  32. package/dist/types/builder/tools/element-edit/language-menu.d.ts +1 -0
  33. package/dist/types/builder/tools/element-edit/login.d.ts +1 -0
  34. package/dist/types/builder/tools/element-edit/orderStatus.d.ts +39 -0
  35. package/dist/types/builder/tools/element-edit/repeater.d.ts +2 -0
  36. package/dist/types/builder/tools/element-edit/resetPassword.d.ts +2 -1
  37. package/dist/types/builder/tools/element-edit/search.d.ts +28 -0
  38. package/dist/types/builder/tools/element-edit/userElements.d.ts +48 -88
  39. package/dist/user-elements.scss +2555 -2471
  40. package/package.json +1 -1
package/dist/menu-v2.scss CHANGED
@@ -1,730 +1,752 @@
1
- @use "sass:map";
2
- @use "sass:list";
3
- @use "./functions.scss" as *;
4
- $activeElementSelector: "[data-has-clicked='true']";
5
- $wrapper: ".flex__menu__list__wrapper";
6
- $menuItem: ".flex__menu__item";
7
- $subMenuContainer: ".flex__submenu__container";
8
- $nodatap: ".no__menu_item__p";
9
- $subMenuItem: ".flex__sub__menu__item";
10
- $subMenuItemText: ".flex__sub__menu__item__text";
11
- $hrz: "[data-element-type='menu-v2'] > .hrz";
12
- $vtl: "[data-element-type='menu-v2'] > .vtl";
13
- $hamburger: ".flex__menu__hamburger";
14
- $hamburgerActive: "[data-hamburger-active='true']";
15
-
16
- $wrapperData: (
17
- start: (
18
- left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
19
- ),
20
- end: (
21
- right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
22
- ),
23
- center: (
24
- left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
25
- transform: translateX(-50%),
26
- ),
27
- );
28
-
29
- $defaultValues: (
30
- --_min-submenu-height: getListOfResponsive(650px, 400px, 550px),
31
- );
32
-
33
- @mixin hamburgerCSS() {
34
- position: relative;
35
- display: var(--_d-flex);
36
- justify-content: prepareMediaVariable(--_ctm-dn-hr-os-vl-at);
37
- & > div {
38
- &#{$wrapper} {
39
- position: absolute;
40
- // left: var(--_sf-hm-mc-lt-vl-v2, 0px);
41
- // width: 100%;
42
- // width: 100vw;
43
- top: calc(100% + prepareMediaVariable(--_ctm-dn-hr-os-cr-ot-y, 0px));
44
- z-index: 2;
45
- visibility: hidden;
46
- opacity: 0;
47
- max-height: 0px;
48
- overflow: clip;
49
- display: var(--_d-flex);
50
- flex-direction: column;
51
- gap: prepareMediaVariable(--_ctm-lt-im-gp);
52
-
53
- @each $key, $val in $wrapperData {
54
- &[data-position="#{$key}"] {
55
- @each $k, $v in $val {
56
- #{$k}: #{$v};
57
- }
58
- }
59
- }
60
-
61
- &:is([data-hamburger-active="true"] > *) {
62
- // animation: animThree var(--_transition-duration) var(--_transition-timing-function) 1
63
- // forwards alternate;
64
- visibility: visible;
65
- opacity: 1;
66
- width: prepareMediaVariable(--_ctm-dn-hr-os-cr-wh, 100%);
67
- max-height: var(--_min-submenu-height, 650px);
68
- overflow-y: auto;
69
- }
70
-
71
- & > #{$menuItem} {
72
- align-items: flex-start;
73
- width: 100%;
74
- flex-direction: column;
75
- gap: #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-y)};
76
- & > #{$subMenuContainer} {
77
- width: 100% !important;
78
- position: static !important;
79
- transform: none !important;
80
- }
81
- }
82
-
83
- @keyframes animThree {
84
- 100% {
85
- max-height: var(--_min-submenu-height, 650px);
86
- opacity: 1;
87
- visibility: visible;
88
- overflow-y: auto;
89
- }
90
- }
91
- }
92
- }
93
-
94
- & > #{$hamburger} {
95
- display: var(--_d-flex);
96
- }
97
- }
98
-
99
- [data-div-type="element"] {
100
- &[data-element-type="menu-v2"] {
101
- width: calc(1% * #{prepareMediaVariable(--_ctm-ele-nw-wh-vl)});
102
- margin: prepareMediaVariable(--_ctm-lt-mn);
103
- @include prepareMediaQueries($defaultValues);
104
- // var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, auto)))
105
-
106
- & > div {
107
- &.wrapper {
108
- width: 100%;
109
- // padding: #{prepareMediaVariable(--_ctm-lt-pg)};
110
- // background: prepareMediaVariable(--_ctm-dn-mu-cr-bd-cr);
111
- // border-radius: prepareMediaVariable(--_ctm-dn-mu-cr-br-rs);
112
-
113
- // &[data-show-border="true"] {
114
- // border-color: prepareMediaVariable(--_ctm-dn-mu-cr-br-cr);
115
- // border-width: prepareMediaVariable(--_ctm-dn-mu-cr-br-wh);
116
- // border-style: prepareMediaVariable(--_ctm-dn-mu-cr-br-se);
117
- // }
118
- // &[data-show-boxshadow="true"] {
119
- // box-shadow: prepareMediaVariable(--_ctm-dn-mu-cr-sw-ae)
120
- // prepareMediaVariable(--_ctm-dn-mu-cr-sw-br) prepareMediaVariable(--_ctm-dn-mu-cr-sw-sd)
121
- // prepareMediaVariable(--_ctm-dn-mu-cr-sw-cr);
122
- // }
123
-
124
- &.hrz {
125
- & > div {
126
- &#{$wrapper} {
127
- display: var(--_d-flex);
128
- flex-direction: row;
129
- gap: prepareMediaVariable(--_ctm-lt-im-gp);
130
- justify-content: prepareMediaVariable(--_ctm-lt-jy-ct);
131
- align-items: center;
132
-
133
- & > p {
134
- &#{$nodatap} {
135
- font-size: 14px;
136
- color: var(--_gray-500);
137
- }
138
- }
139
- }
140
- }
141
- }
142
-
143
- &.vtl {
144
- & > div {
145
- &#{$wrapper} {
146
- display: var(--_d-flex);
147
- flex-direction: column;
148
- gap: prepareMediaVariable(--_ctm-lt-im-gp);
149
- }
150
- }
151
- }
152
-
153
- & > div {
154
- &#{$wrapper} {
155
- padding: #{prepareMediaVariable(--_ctm-lt-pg)};
156
- background: prepareMediaVariable(--_ctm-dn-mu-cr-bd-cr);
157
- border-radius: prepareMediaVariable(--_ctm-dn-mu-cr-br-rs);
158
-
159
- &:is([data-show-border="true"] > *) {
160
- border-color: prepareMediaVariable(--_ctm-dn-mu-cr-br-cr);
161
- border-width: prepareMediaVariable(--_ctm-dn-mu-cr-br-wh);
162
- border-style: prepareMediaVariable(--_ctm-dn-mu-cr-br-se);
163
- }
164
- &:is([data-show-boxshadow="true"] > *) {
165
- box-shadow: prepareMediaVariable(--_ctm-dn-mu-cr-sw-ae)
166
- prepareMediaVariable(--_ctm-dn-mu-cr-sw-br)
167
- prepareMediaVariable(--_ctm-dn-mu-cr-sw-sd)
168
- prepareMediaVariable(--_ctm-dn-mu-cr-sw-cr);
169
- }
170
- & > div {
171
- &#{$menuItem} {
172
- position: relative;
173
- padding: var(
174
- --_sf-it-at-pd,
175
- var(--_sf-it-hr-pd, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-pg)})
176
- );
177
- background: var(
178
- --_sf-it-at-bd,
179
- var(--_sf-it-hr-bd, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-bd-cr)})
180
- );
181
- border-radius: var(
182
- --_sf-it-at-br,
183
- var(--_sf-it-hr-br, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-rs)})
184
- );
185
- display: var(--_d-flex);
186
- align-items: center;
187
- &:is(#{$vtl} *) {
188
- align-items: flex-start;
189
- flex-direction: column;
190
- gap: #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-y)};
191
- }
192
- &:hover {
193
- --_sf-it-hr-pd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-pg)};
194
- --_sf-it-hr-bd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-bd-cr)};
195
- --_sf-it-hr-br: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-rs)};
196
- --_sf-it-hr-brc: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-cr)};
197
- --_sf-it-hr-bw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-wh)};
198
- --_sf-it-hr-bs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-se)};
199
-
200
- --_sf-it-hr-bsa: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-ae)};
201
- --_sf-it-hr-blr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-br)};
202
- --_sf-it-hr-spr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-sd)};
203
- --_sf-it-hr-bscl: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-cr)};
204
-
205
- --_sf-it-hr-ff: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-fy)};
206
- --_sf-it-hr-fs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-se)};
207
- --_sf-it-hr-fclr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-cr)};
208
- --_sf-it-hr-fw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-wt)};
209
-
210
- --_sf-it-hr-fsi: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-se-ic)};
211
- --_sf-it-hr-td: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ue)};
212
- --_sf-it-hr-tae: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-tt-an)};
213
- --_sf-it-hr-ls: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-lr-sg)};
214
- --_sf-it-hr-lh: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-le-ht)};
215
- }
216
- &.active {
217
- --_sf-it-at-pd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-pg)};
218
- --_sf-it-at-bd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-bd-cr)};
219
- --_sf-it-at-br: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-rs)};
220
- --_sf-it-at-brc: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-cr)};
221
- --_sf-it-at-bw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-wh)};
222
- --_sf-it-at-bs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-se)};
223
-
224
- --_sf-it-at-bsa: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-ae)};
225
- --_sf-it-at-blr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-br)};
226
- --_sf-it-at-spr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-sd)};
227
- --_sf-it-at-bscl: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-cr)};
228
-
229
- --_sf-it-at-ff: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-fy)};
230
- --_sf-it-at-fs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-se)};
231
- --_sf-it-at-fclr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-cr)};
232
- --_sf-it-at-fw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-wt)};
233
- --_sf-it-at-fsi: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-se-ic)};
234
- --_sf-it-at-td: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ue)};
235
- --_sf-it-at-tae: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-tt-an)};
236
- --_sf-it-at-ls: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-lr-sg)};
237
- --_sf-it-at-lh: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-le-ht)};
238
- }
239
-
240
- &[data-show-border="true"] {
241
- border-color: var(
242
- --_sf-it-at-brc,
243
- var(--_sf-it-hr-brc, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-cr)})
244
- );
245
- border-width: var(
246
- --_sf-it-at-bw,
247
- var(--_sf-it-hr-bw, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-wh)})
248
- );
249
- border-style: var(
250
- --_sf-it-at-bs,
251
- var(--_sf-it-hr-bs, prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-se))
252
- );
253
- }
254
- &[data-show-boxshadow="true"] {
255
- box-shadow: var(
256
- --_sf-it-at-bsa,
257
- var(--_sf-it-hr-bsa, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-ae)})
258
- )
259
- var(
260
- --_sf-it-at-blr,
261
- var(--_sf-it-hr-blr, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-br)})
262
- )
263
- var(
264
- --_sf-it-at-spr,
265
- var(--_sf-it-hr-spr, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-sd)})
266
- )
267
- var(
268
- --_sf-it-at-bscl,
269
- var(--_sf-it-hr-bscl, prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-cr))
270
- );
271
- }
272
-
273
- & > a {
274
- display: var(--_d-flex);
275
- justify-content: space-between;
276
- align-items: center;
277
- gap: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-gp);
278
- & > span {
279
- display: var(--_d-flex);
280
- font-family: var(
281
- --_sf-it-at-ff,
282
- var(--_sf-it-hr-ff, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-fy)})
283
- );
284
- font-size: var(
285
- --_sf-it-at-fs,
286
- var(--_sf-it-hr-fs, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-se)})
287
- );
288
- color: var(
289
- --_sf-it-at-fclr,
290
- var(--_sf-it-hr-fclr, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-cr)})
291
- );
292
- font-weight: var(
293
- --_sf-it-at-fw,
294
- var(--_sf-it-hr-fw, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-wt)})
295
- );
296
- font-style: var(
297
- --_sf-it-at-fsi,
298
- var(
299
- --_sf-it-hr-fsi,
300
- #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-se-ic)}
301
- )
302
- );
303
- text-decoration: var(
304
- --_sf-it-at-td,
305
- var(--_sf-it-hr-td, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ue)})
306
- );
307
- text-align: var(
308
- --_sf-it-at-tae,
309
- var(--_sf-it-hr-tae, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-tt-an)})
310
- );
311
- letter-spacing: var(
312
- --_sf-it-at-ls,
313
- var(--_sf-it-hr-ls, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-lr-sg)})
314
- );
315
- line-height: var(
316
- --_sf-it-at-lh,
317
- var(--_sf-it-hr-lh, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-le-ht)})
318
- );
319
-
320
- &.flex__menu__item__icon {
321
- &[data-rotate="true"] {
322
- --_sf-svg-tr: 180deg;
323
- }
324
- svg {
325
- width: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-se);
326
- height: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-se);
327
- transform: rotate(#{var(--_sf-svg-tr, 0deg)});
328
- transition: transform var(--_transition-duration)
329
- var(--_transition-timing-function);
330
-
331
- path {
332
- stroke: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-c1);
333
- }
334
- }
335
- }
336
- }
337
- }
338
-
339
- // Sub Item Container
340
-
341
- & > ul {
342
- &#{$subMenuContainer} {
343
- background: prepareMediaVariable(--_ctm-dn-sb-mu-cr-bd-cr);
344
- border-radius: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-rs);
345
- padding: prepareMediaVariable(--_ctm-dn-sb-mu-cr-pg);
346
-
347
- &:is(#{$hrz} *) {
348
- position: absolute;
349
- left: calc(50% + #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-x)});
350
- width: calc(100% + #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-wh)});
351
- top: calc(100% + #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-y)});
352
- transform: translateX(-50%);
353
- z-index: 2;
354
- }
355
- &:is(#{$vtl} *) {
356
- width: 100%;
357
- }
358
-
359
- // max-height: 0px;
360
- // overflow: clip;
361
- max-height: 500px;
362
- overflow-y: auto;
363
- // animation: animTwo var(--_transition-duration)
364
- // var(--_transition-timing-function) 1 forwards alternate;
365
-
366
- @keyframes animTwo {
367
- 100% {
368
- max-height: 500px;
369
- overflow-y: auto;
370
- }
371
- }
372
-
373
- &[data-show-border="true"] {
374
- border-width: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-wh);
375
- border-color: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-cr);
376
- border-style: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-se);
377
- }
378
- &[data-show-boxshadow="true"] {
379
- box-shadow: prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-ae)
380
- prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-br)
381
- prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-sd)
382
- prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-cr);
383
- }
384
-
385
- & > li {
386
- &#{$subMenuItem} {
387
- display: var(--_d-flex);
388
- flex-direction: column;
389
-
390
- padding: var(
391
- --_sf-sb-it-at-pd,
392
- var(
393
- --_sf-sb-it-hr-pd,
394
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-pg)}
395
- )
396
- );
397
- background: var(
398
- --_sf-sb-it-at-bd,
399
- var(
400
- --_sf-sb-it-hr-bd,
401
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-bd-cr)}
402
- )
403
- );
404
- border-radius: var(
405
- --_sf-sb-it-at-br,
406
- var(
407
- --_sf-sb-it-hr-br,
408
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-rs)}
409
- )
410
- );
411
-
412
- &[data-show-border="true"] {
413
- border-color: var(
414
- --_sf-sb-it-at-brc,
415
- var(
416
- --_sf-sb-it-hr-brc,
417
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-cr)}
418
- )
419
- );
420
- border-width: var(
421
- --_sf-sb-it-at-bw,
422
- var(
423
- --_sf-sb-it-hr-bw,
424
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-wh)}
425
- )
426
- );
427
- border-style: var(
428
- --_sf-sb-it-at-bs,
429
- var(
430
- --_sf-sb-it-hr-bs,
431
- prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-se)
432
- )
433
- );
434
- }
435
- &[data-show-boxshadow="true"] {
436
- box-shadow: var(
437
- --_sf-sb-it-at-bsa,
438
- var(
439
- --_sf-sb-it-hr-bsa,
440
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-ae)}
441
- )
442
- )
443
- var(
444
- --_sf-sb-it-at-blr,
445
- var(
446
- --_sf-sb-it-hr-blr,
447
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-br)}
448
- )
449
- )
450
- var(
451
- --_sf-sb-it-at-spr,
452
- var(
453
- --_sf-sb-it-hr-spr,
454
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-sd)}
455
- )
456
- )
457
- var(
458
- --_sf-sb-it-at-bscl,
459
- var(
460
- --_sf-sb-it-hr-bscl,
461
- prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-cr)
462
- )
463
- );
464
- }
465
-
466
- &:hover {
467
- --_sf-sb-it-hr-pd: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-hr-se-pg)};
468
- --_sf-sb-it-hr-bd: #{prepareMediaVariable(
469
- --_ctm-dn-sb-mu-im-se-hr-se-bd-cr
470
- )};
471
- --_sf-sb-it-hr-br: #{prepareMediaVariable(
472
- --_ctm-dn-sb-mu-im-se-hr-se-br-rs
473
- )};
474
- --_sf-sb-it-hr-brc: #{prepareMediaVariable(
475
- --_ctm-dn-sb-mu-im-se-hr-se-br-cr
476
- )};
477
- --_sf-sb-it-hr-bw: #{prepareMediaVariable(
478
- --_ctm-dn-sb-mu-im-se-hr-se-br-wh
479
- )};
480
- --_sf-sb-it-hr-bs: #{prepareMediaVariable(
481
- --_ctm-dn-sb-mu-im-se-hr-se-br-se
482
- )};
483
- --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
484
- --_ctm-dn-sb-mu-im-se-hr-se-sw-ae
485
- )};
486
- --_sf-sb-it-hr-blr: #{prepareMediaVariable(
487
- --_ctm-dn-sb-mu-im-se-hr-se-sw-br
488
- )};
489
- --_sf-sb-it-hr-spr: #{prepareMediaVariable(
490
- --_ctm-dn-sb-mu-im-se-hr-se-sw-sd
491
- )};
492
- --_sf-sb-it-hr-bscl: #{prepareMediaVariable(
493
- --_ctm-dn-sb-mu-im-se-hr-se-sw-cr
494
- )};
495
-
496
- --_sf-sb-it-hr-ff: #{prepareMediaVariable(
497
- --_ctm-dn-sb-mu-im-se-hr-se-ft-fy
498
- )};
499
- --_sf-sb-it-hr-fs: #{prepareMediaVariable(
500
- --_ctm-dn-sb-mu-im-se-hr-se-ft-se
501
- )};
502
- --_sf-sb-it-hr-fclr: #{prepareMediaVariable(
503
- --_ctm-dn-sb-mu-im-se-hr-se-cr
504
- )};
505
- --_sf-sb-it-hr-fw: #{prepareMediaVariable(
506
- --_ctm-dn-sb-mu-im-se-hr-se-ft-wt
507
- )};
508
-
509
- --_sf-sb-it-hr-fsi: #{prepareMediaVariable(
510
- --_ctm-dn-sb-mu-im-se-hr-se-ft-se-ic
511
- )};
512
- --_sf-sb-it-hr-td: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-hr-se-ue)};
513
- --_sf-sb-it-hr-tae: #{prepareMediaVariable(
514
- --_ctm-dn-sb-mu-im-se-hr-se-tt-an
515
- )};
516
- --_sf-sb-it-hr-ls: #{prepareMediaVariable(
517
- --_ctm-dn-sb-mu-im-se-hr-se-lr-sg
518
- )};
519
- --_sf-sb-it-hr-lh: #{prepareMediaVariable(
520
- --_ctm-dn-sb-mu-im-se-hr-se-le-ht
521
- )};
522
- }
523
- &.active {
524
- --_sf-sb-it-at-pd: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-sd-se-pg)};
525
- --_sf-sb-it-at-bd: #{prepareMediaVariable(
526
- --_ctm-dn-sb-mu-im-se-sd-se-bd-cr
527
- )};
528
- --_sf-sb-it-at-br: #{prepareMediaVariable(
529
- --_ctm-dn-sb-mu-im-se-sd-se-br-rs
530
- )};
531
- --_sf-sb-it-at-brc: #{prepareMediaVariable(
532
- --_ctm-dn-sb-mu-im-se-sd-se-br-cr
533
- )};
534
- --_sf-sb-it-at-bw: #{prepareMediaVariable(
535
- --_ctm-dn-sb-mu-im-se-sd-se-br-wh
536
- )};
537
- --_sf-sb-it-at-bs: #{prepareMediaVariable(
538
- --_ctm-dn-sb-mu-im-se-sd-se-br-se
539
- )};
540
- --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
541
- --_ctm-dn-sb-mu-im-se-sd-se-sw-ae
542
- )};
543
- --_sf-sb-it-at-blr: #{prepareMediaVariable(
544
- --_ctm-dn-sb-mu-im-se-sd-se-sw-br
545
- )};
546
- --_sf-sb-it-at-spr: #{prepareMediaVariable(
547
- --_ctm-dn-sb-mu-im-se-sd-se-sw-sd
548
- )};
549
- --_sf-sb-it-at-bscl: #{prepareMediaVariable(
550
- --_ctm-dn-sb-mu-im-se-sd-se-sw-cr
551
- )};
552
-
553
- --_sf-sb-it-at-ff: #{prepareMediaVariable(
554
- --_ctm-dn-sb-mu-im-se-sd-se-ft-fy
555
- )};
556
- --_sf-sb-it-at-fs: #{prepareMediaVariable(
557
- --_ctm-dn-sb-mu-im-se-sd-se-ft-se
558
- )};
559
- --_sf-sb-it-at-fclr: #{prepareMediaVariable(
560
- --_ctm-dn-sb-mu-im-se-sd-se-cr
561
- )};
562
- --_sf-sb-it-at-fw: #{prepareMediaVariable(
563
- --_ctm-dn-sb-mu-im-se-sd-se-ft-wt
564
- )};
565
- --_sf-sb-it-at-fsi: #{prepareMediaVariable(
566
- --_ctm-dn-sb-mu-im-se-sd-se-ft-se-ic
567
- )};
568
- --_sf-sb-it-at-td: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-sd-se-ue)};
569
- --_sf-sb-it-at-tae: #{prepareMediaVariable(
570
- --_ctm-dn-sb-mu-im-se-sd-se-tt-an
571
- )};
572
- --_sf-sb-it-at-ls: #{prepareMediaVariable(
573
- --_ctm-dn-sb-mu-im-se-sd-se-lr-sg
574
- )};
575
- --_sf-sb-it-at-lh: #{prepareMediaVariable(
576
- --_ctm-dn-sb-mu-im-se-sd-se-le-ht
577
- )};
578
- }
579
-
580
- & > a {
581
- display: var(--_d-flex);
582
- justify-content: space-between;
583
- align-items: center;
584
-
585
- & > span {
586
- display: var(--_d-flex);
587
-
588
- &#{$subMenuItemText} {
589
- font-family: var(
590
- --_sf-it-at-ff,
591
- var(
592
- --_sf-it-hr-ff,
593
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-fy)}
594
- )
595
- );
596
- font-size: var(
597
- --_sf-sb-it-at-fs,
598
- var(
599
- --_sf-sb-it-hr-fs,
600
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-se)}
601
- )
602
- );
603
- color: var(
604
- --_sf-sb-it-at-fclr,
605
- var(
606
- --_sf-sb-it-hr-fclr,
607
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-cr)}
608
- )
609
- );
610
- font-weight: var(
611
- --_sf-sb-it-at-fw,
612
- var(
613
- --_sf-sb-it-hr-fw,
614
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-fw-se-ft-wt)}
615
- )
616
- );
617
- font-style: var(
618
- --_sf-sb-it-at-fsi,
619
- var(
620
- --_sf-sb-it-hr-fsi,
621
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-se-ic)}
622
- )
623
- );
624
- text-decoration: var(
625
- --_sf-sb-it-at-td,
626
- var(
627
- --_sf-sb-it-hr-td,
628
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ue)}
629
- )
630
- );
631
- text-align: var(
632
- --_sf-sb-it-at-tae,
633
- var(
634
- --_sf-sb-it-hr-tae,
635
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-tt-an)}
636
- )
637
- );
638
- letter-spacing: var(
639
- --_sf-sb-it-at-ls,
640
- var(
641
- --_sf-sb-it-hr-ls,
642
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-lr-sg)}
643
- )
644
- );
645
- line-height: var(
646
- --_sf-sb-it-at-lh,
647
- var(
648
- --_sf-sb-it-hr-lh,
649
- #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-le-ht)}
650
- )
651
- );
652
- }
653
- }
654
- }
655
- }
656
- }
657
- }
658
- }
659
- }
660
- }
661
- }
662
- }
663
- & > #{$hamburger} {
664
- display: var(--_d-none);
665
- padding: var(--_sf-hm-hr-pd, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-pg)});
666
- border-radius: var(--_sf-hm-hr-br, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-rs)});
667
- background: var(--_sf-hm-hr-bd, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-bd-cr)});
668
-
669
- &[data-show-border="true"] {
670
- border-style: var(--_sf-hm-hr-bs, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-se)});
671
- border-width: var(--_sf-hm-hr-bw, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-wh)});
672
- border-color: var(--_sf-hm-hr-bc, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-cr)});
673
- }
674
-
675
- &[data-show-boxshadow="true"] {
676
- box-shadow: var(--_sf-hm-hr-bsa, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-ae)})
677
- var(--_sf-hm-hr-blr, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-br)})
678
- var(--_sf-hm-hr-spr, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-sd)})
679
- var(--_sf-hm-hr-bscl, prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-cr));
680
- }
681
-
682
- &:hover {
683
- --_sf-hm-hr-ic-sz: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-in-se)};
684
- --_sf-hm-hr-ic-clr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-in-c1)};
685
-
686
- --_sf-hm-hr-pd: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-pg)};
687
- --_sf-hm-hr-br: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-br-rs)};
688
- --_sf-hm-hr-bd: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-bd-cr)};
689
-
690
- --_sf-hm-hr-bs: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-br-se)};
691
- --_sf-hm-hr-bw: #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-wh)};
692
- --_sf-hm-hr-bc: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-br-cr)};
693
-
694
- --_sf-hm-hr-bsa: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-ae)};
695
- --_sf-hm-hr-blr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-br)};
696
- --_sf-hm-hr-spr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-sd)};
697
- --_sf-hm-hr-bscl: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-cr)};
698
- }
699
-
700
- & > svg {
701
- width: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-in-se)});
702
- height: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-in-se)});
703
-
704
- path {
705
- stroke: var(--_sf-hm-hr-ic-clr, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-in-c1)});
706
- }
707
- }
708
- }
709
-
710
- @media only screen and (min-width: 10px) {
711
- &.dk {
712
- @include hamburgerCSS();
713
- }
714
- }
715
-
716
- @media only screen and (min-width: 10px) and (max-width: 1023px) {
717
- &.tb {
718
- @include hamburgerCSS();
719
- }
720
- }
721
-
722
- @media only screen and (min-width: 10px) and (max-width: 767px) {
723
- &.mb {
724
- @include hamburgerCSS();
725
- }
726
- }
727
- }
728
- }
729
- }
730
- }
1
+ @use "sass:map";
2
+ @use "sass:list";
3
+ @use "./functions.scss" as *;
4
+ $activeElementSelector: "[data-has-clicked='true']";
5
+ $wrapper: ".flex__menu__list__wrapper";
6
+ $menuItem: ".flex__menu__item";
7
+ $subMenuContainer: ".flex__submenu__container";
8
+ $nodatap: ".no__menu_item__p";
9
+ $subMenuItem: ".flex__sub__menu__item";
10
+ $subMenuItemText: ".flex__sub__menu__item__text";
11
+ $hrz: "[data-element-type='menu-v2'] > .hrz";
12
+ $vtl: "[data-element-type='menu-v2'] > .vtl";
13
+ $hamburger: ".flex__menu__hamburger";
14
+ $hamburgerActive: "[data-hamburger-active='true']";
15
+
16
+ $wrapperData: (
17
+ start: (
18
+ left: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
19
+ ),
20
+ end: (
21
+ right: prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px),
22
+ ),
23
+ center: (
24
+ left: calc(50% + #{prepareMediaVariable(--_ctm-meg-dn-hr-os-cr-ot-x, 0px)}),
25
+ transform: translateX(-50%),
26
+ ),
27
+ );
28
+
29
+ $defaultValues: (
30
+ --_min-submenu-height: getListOfResponsive(650px, 400px, 550px),
31
+ );
32
+
33
+ @mixin hamburgerCSS() {
34
+ position: relative;
35
+ display: var(--_d-flex);
36
+ justify-content: prepareMediaVariable(--_ctm-dn-hr-os-vl-at);
37
+ & > div {
38
+ &#{$wrapper} {
39
+ position: absolute;
40
+ // left: var(--_sf-hm-mc-lt-vl-v2, 0px);
41
+ // width: 100%;
42
+ // width: 100vw;
43
+ top: calc(100% + prepareMediaVariable(--_ctm-dn-hr-os-cr-ot-y, 0px));
44
+ z-index: 2;
45
+ visibility: hidden;
46
+ opacity: 0;
47
+ max-height: 0px;
48
+ overflow: clip;
49
+ display: var(--_d-flex);
50
+ flex-direction: column;
51
+ gap: prepareMediaVariable(--_ctm-lt-im-gp);
52
+
53
+ @each $key, $val in $wrapperData {
54
+ &[data-position="#{$key}"] {
55
+ @each $k, $v in $val {
56
+ #{$k}: #{$v};
57
+ }
58
+ }
59
+ }
60
+
61
+ &:is([data-hamburger-active="true"] > *) {
62
+ // animation: animThree var(--_transition-duration) var(--_transition-timing-function) 1
63
+ // forwards alternate;
64
+ visibility: visible;
65
+ opacity: 1;
66
+ width: prepareMediaVariable(--_ctm-dn-hr-os-cr-wh, 100%);
67
+ max-height: var(--_min-submenu-height, 650px);
68
+ overflow-y: auto;
69
+ }
70
+
71
+ & > #{$menuItem} {
72
+ align-items: flex-start;
73
+ width: 100%;
74
+ flex-direction: column;
75
+ gap: #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-y)};
76
+ & > #{$subMenuContainer} {
77
+ width: 100% !important;
78
+ position: static !important;
79
+ transform: none !important;
80
+ }
81
+ }
82
+
83
+ @keyframes animThree {
84
+ 100% {
85
+ max-height: var(--_min-submenu-height, 650px);
86
+ opacity: 1;
87
+ visibility: visible;
88
+ overflow-y: auto;
89
+ }
90
+ }
91
+ }
92
+ }
93
+
94
+ & > #{$hamburger} {
95
+ display: var(--_d-flex);
96
+ }
97
+ }
98
+
99
+ [data-div-type="element"] {
100
+ &[data-element-type="menu-v2"] {
101
+ width: calc(1% * #{prepareMediaVariable(--_ctm-ele-nw-wh-vl)});
102
+ margin: prepareMediaVariable(--_ctm-lt-mn);
103
+ @include prepareMediaQueries($defaultValues);
104
+ // var(--_ctm-mob-ele-nw-wh-vl, var(--_ctm-tab-ele-nw-wh-vl, var(--_ctm-ele-nw-wh-vl, auto)))
105
+
106
+ & > div {
107
+ &.wrapper {
108
+ width: 100%;
109
+ // padding: #{prepareMediaVariable(--_ctm-lt-pg)};
110
+ // background: prepareMediaVariable(--_ctm-dn-mu-cr-bd-cr);
111
+ // border-radius: prepareMediaVariable(--_ctm-dn-mu-cr-br-rs);
112
+
113
+ // &[data-show-border="true"] {
114
+ // border-color: prepareMediaVariable(--_ctm-dn-mu-cr-br-cr);
115
+ // border-width: prepareMediaVariable(--_ctm-dn-mu-cr-br-wh);
116
+ // border-style: prepareMediaVariable(--_ctm-dn-mu-cr-br-se);
117
+ // }
118
+ // &[data-show-boxshadow="true"] {
119
+ // box-shadow: prepareMediaVariable(--_ctm-dn-mu-cr-sw-ae)
120
+ // prepareMediaVariable(--_ctm-dn-mu-cr-sw-br) prepareMediaVariable(--_ctm-dn-mu-cr-sw-sd)
121
+ // prepareMediaVariable(--_ctm-dn-mu-cr-sw-cr);
122
+ // }
123
+
124
+ &.hrz {
125
+ & > div {
126
+ &#{$wrapper} {
127
+ display: var(--_d-flex);
128
+ flex-direction: row;
129
+ gap: prepareMediaVariable(--_ctm-lt-im-gp);
130
+ justify-content: prepareMediaVariable(--_ctm-lt-jy-ct);
131
+ align-items: center;
132
+
133
+ & > p {
134
+ &#{$nodatap} {
135
+ font-size: 14px;
136
+ color: var(--_gray-500);
137
+ }
138
+ }
139
+ }
140
+ }
141
+ }
142
+
143
+ &.vtl {
144
+ & > div {
145
+ &#{$wrapper} {
146
+ display: var(--_d-flex);
147
+ flex-direction: column;
148
+ gap: prepareMediaVariable(--_ctm-lt-im-gp);
149
+ }
150
+ }
151
+ }
152
+
153
+ & > div {
154
+ &#{$wrapper} {
155
+ padding: #{prepareMediaVariable(--_ctm-lt-pg)};
156
+ background: prepareMediaVariable(--_ctm-dn-mu-cr-bd-cr);
157
+ border-radius: prepareMediaVariable(--_ctm-dn-mu-cr-br-rs);
158
+
159
+ &:is([data-show-border="true"] > *) {
160
+ border-color: prepareMediaVariable(--_ctm-dn-mu-cr-br-cr);
161
+ border-width: prepareMediaVariable(--_ctm-dn-mu-cr-br-wh);
162
+ border-style: prepareMediaVariable(--_ctm-dn-mu-cr-br-se);
163
+ }
164
+ &:is([data-show-boxshadow="true"] > *) {
165
+ box-shadow: prepareMediaVariable(--_ctm-dn-mu-cr-sw-ae)
166
+ prepareMediaVariable(--_ctm-dn-mu-cr-sw-br)
167
+ prepareMediaVariable(--_ctm-dn-mu-cr-sw-sd)
168
+ prepareMediaVariable(--_ctm-dn-mu-cr-sw-cr);
169
+ }
170
+ & > div {
171
+ &#{$menuItem} {
172
+ position: relative;
173
+ padding: var(
174
+ --_sf-it-at-pd,
175
+ var(--_sf-it-hr-pd, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-pg)})
176
+ );
177
+ background: var(
178
+ --_sf-it-at-bd,
179
+ var(--_sf-it-hr-bd, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-bd-cr)})
180
+ );
181
+ border-radius: var(
182
+ --_sf-it-at-br,
183
+ var(--_sf-it-hr-br, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-rs)})
184
+ );
185
+ display: var(--_d-flex);
186
+ align-items: center;
187
+ &:is(#{$vtl} *) {
188
+ align-items: flex-start;
189
+ flex-direction: column;
190
+ gap: #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-y)};
191
+ }
192
+ &:hover {
193
+ --_sf-it-hr-pd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-pg)};
194
+ --_sf-it-hr-bd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-bd-cr)};
195
+ --_sf-it-hr-br: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-rs)};
196
+ --_sf-it-hr-brc: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-cr)};
197
+ --_sf-it-hr-bw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-wh)};
198
+ --_sf-it-hr-bs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-br-se)};
199
+
200
+ --_sf-it-hr-bsa: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-ae)};
201
+ --_sf-it-hr-blr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-br)};
202
+ --_sf-it-hr-spr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-sd)};
203
+ --_sf-it-hr-bscl: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-sw-cr)};
204
+
205
+ --_sf-it-hr-ff: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-fy)};
206
+ --_sf-it-hr-fs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-se)};
207
+ --_sf-it-hr-fclr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-cr)};
208
+ --_sf-it-hr-fw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-wt)};
209
+
210
+ --_sf-it-hr-fsi: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ft-se-ic)};
211
+ --_sf-it-hr-td: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-ue)};
212
+ --_sf-it-hr-tae: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-tt-an)};
213
+ --_sf-it-hr-ls: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-lr-sg)};
214
+ --_sf-it-hr-lh: #{prepareMediaVariable(--_ctm-dn-mu-im-se-hr-se-le-ht)};
215
+ }
216
+ &.active {
217
+ --_sf-it-at-pd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-pg)};
218
+ --_sf-it-at-bd: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-bd-cr)};
219
+ --_sf-it-at-br: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-rs)};
220
+ --_sf-it-at-brc: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-cr)};
221
+ --_sf-it-at-bw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-wh)};
222
+ --_sf-it-at-bs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-br-se)};
223
+
224
+ --_sf-it-at-bsa: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-ae)};
225
+ --_sf-it-at-blr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-br)};
226
+ --_sf-it-at-spr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-sd)};
227
+ --_sf-it-at-bscl: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-sw-cr)};
228
+
229
+ --_sf-it-at-ff: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-fy)};
230
+ --_sf-it-at-fs: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-se)};
231
+ --_sf-it-at-fclr: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-cr)};
232
+ --_sf-it-at-fw: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-wt)};
233
+ --_sf-it-at-fsi: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ft-se-ic)};
234
+ --_sf-it-at-td: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-ue)};
235
+ --_sf-it-at-tae: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-tt-an)};
236
+ --_sf-it-at-ls: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-lr-sg)};
237
+ --_sf-it-at-lh: #{prepareMediaVariable(--_ctm-dn-mu-im-se-sd-se-le-ht)};
238
+ }
239
+
240
+ &[data-show-border="true"] {
241
+ border-color: var(
242
+ --_sf-it-at-brc,
243
+ var(--_sf-it-hr-brc, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-cr)})
244
+ );
245
+ border-width: var(
246
+ --_sf-it-at-bw,
247
+ var(--_sf-it-hr-bw, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-wh)})
248
+ );
249
+ border-style: var(
250
+ --_sf-it-at-bs,
251
+ var(--_sf-it-hr-bs, prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-br-se))
252
+ );
253
+ }
254
+ &[data-show-boxshadow="true"] {
255
+ box-shadow: var(
256
+ --_sf-it-at-bsa,
257
+ var(--_sf-it-hr-bsa, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-ae)})
258
+ )
259
+ var(
260
+ --_sf-it-at-blr,
261
+ var(--_sf-it-hr-blr, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-br)})
262
+ )
263
+ var(
264
+ --_sf-it-at-spr,
265
+ var(--_sf-it-hr-spr, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-sd)})
266
+ )
267
+ var(
268
+ --_sf-it-at-bscl,
269
+ var(--_sf-it-hr-bscl, prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-sw-cr))
270
+ );
271
+ }
272
+
273
+ & > a {
274
+ display: var(--_d-flex);
275
+ justify-content: space-between;
276
+ align-items: center;
277
+ gap: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-gp);
278
+ & > span {
279
+ display: var(--_d-flex);
280
+ font-family: var(
281
+ --_sf-it-at-ff,
282
+ var(--_sf-it-hr-ff, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-fy)})
283
+ );
284
+ font-size: var(
285
+ --_sf-it-at-fs,
286
+ var(--_sf-it-hr-fs, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-se)})
287
+ );
288
+ color: var(
289
+ --_sf-it-at-fclr,
290
+ var(--_sf-it-hr-fclr, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-cr)})
291
+ );
292
+ font-weight: var(
293
+ --_sf-it-at-fw,
294
+ var(--_sf-it-hr-fw, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-wt)})
295
+ );
296
+ font-style: var(
297
+ --_sf-it-at-fsi,
298
+ var(
299
+ --_sf-it-hr-fsi,
300
+ #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ft-se-ic)}
301
+ )
302
+ );
303
+ text-decoration: var(
304
+ --_sf-it-at-td,
305
+ var(--_sf-it-hr-td, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-ue)})
306
+ );
307
+ text-align: var(
308
+ --_sf-it-at-tae,
309
+ var(--_sf-it-hr-tae, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-tt-an)})
310
+ );
311
+ letter-spacing: var(
312
+ --_sf-it-at-ls,
313
+ var(--_sf-it-hr-ls, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-lr-sg)})
314
+ );
315
+ line-height: var(
316
+ --_sf-it-at-lh,
317
+ var(--_sf-it-hr-lh, #{prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-le-ht)})
318
+ );
319
+
320
+ &.flex__menu__item__icon {
321
+ &[data-rotate="true"] {
322
+ --_sf-svg-tr: 180deg;
323
+ }
324
+ svg {
325
+ width: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-se);
326
+ height: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-se);
327
+ transform: rotate(#{var(--_sf-svg-tr, 0deg)});
328
+ transition: transform var(--_transition-duration)
329
+ var(--_transition-timing-function);
330
+
331
+ path {
332
+ stroke: prepareMediaVariable(--_ctm-dn-mu-im-se-dt-se-in-c1);
333
+ }
334
+ }
335
+ }
336
+ }
337
+ }
338
+
339
+ // Sub Item Container
340
+
341
+ & > ul {
342
+ &#{$subMenuContainer} {
343
+ background: prepareMediaVariable(--_ctm-dn-sb-mu-cr-bd-cr);
344
+ border-radius: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-rs);
345
+ padding: prepareMediaVariable(--_ctm-dn-sb-mu-cr-pg);
346
+
347
+ &:is(#{$hrz} *) {
348
+ position: absolute;
349
+ left: calc(50% + #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-x)});
350
+ width: calc(100% + #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-wh)});
351
+ top: calc(100% + #{prepareMediaVariable(--_ctm-dn-sb-mu-cr-cr-ot-y)});
352
+ transform: translateX(-50%);
353
+ z-index: 2;
354
+ }
355
+ &:is(#{$vtl} *) {
356
+ width: 100%;
357
+ }
358
+
359
+ // max-height: 0px;
360
+ // overflow: clip;
361
+ max-height: 500px;
362
+ overflow-y: auto;
363
+ // animation: animTwo var(--_transition-duration)
364
+ // var(--_transition-timing-function) 1 forwards alternate;
365
+
366
+ @keyframes animTwo {
367
+ 100% {
368
+ max-height: 500px;
369
+ overflow-y: auto;
370
+ }
371
+ }
372
+
373
+ &[data-show-border="true"] {
374
+ border-width: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-wh);
375
+ border-color: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-cr);
376
+ border-style: prepareMediaVariable(--_ctm-dn-sb-mu-cr-br-se);
377
+ }
378
+ &[data-show-boxshadow="true"] {
379
+ box-shadow: prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-ae)
380
+ prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-br)
381
+ prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-sd)
382
+ prepareMediaVariable(--_ctm-dn-sb-mu-cr-sw-cr);
383
+ }
384
+
385
+ & > li {
386
+ &#{$subMenuItem} {
387
+ display: var(--_d-flex);
388
+ flex-direction: column;
389
+
390
+ padding: var(
391
+ --_sf-sb-it-at-pd,
392
+ var(
393
+ --_sf-sb-it-hr-pd,
394
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-pg)}
395
+ )
396
+ );
397
+ background: var(
398
+ --_sf-sb-it-at-bd,
399
+ var(
400
+ --_sf-sb-it-hr-bd,
401
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-bd-cr)}
402
+ )
403
+ );
404
+ border-radius: var(
405
+ --_sf-sb-it-at-br,
406
+ var(
407
+ --_sf-sb-it-hr-br,
408
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-rs)}
409
+ )
410
+ );
411
+
412
+ &[data-show-border="true"] {
413
+ border-color: var(
414
+ --_sf-sb-it-at-brc,
415
+ var(
416
+ --_sf-sb-it-hr-brc,
417
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-cr)}
418
+ )
419
+ );
420
+ border-width: var(
421
+ --_sf-sb-it-at-bw,
422
+ var(
423
+ --_sf-sb-it-hr-bw,
424
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-wh)}
425
+ )
426
+ );
427
+ border-style: var(
428
+ --_sf-sb-it-at-bs,
429
+ var(
430
+ --_sf-sb-it-hr-bs,
431
+ prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-br-se)
432
+ )
433
+ );
434
+ }
435
+ &[data-show-boxshadow="true"] {
436
+ box-shadow: var(
437
+ --_sf-sb-it-at-bsa,
438
+ var(
439
+ --_sf-sb-it-hr-bsa,
440
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-ae)}
441
+ )
442
+ )
443
+ var(
444
+ --_sf-sb-it-at-blr,
445
+ var(
446
+ --_sf-sb-it-hr-blr,
447
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-br)}
448
+ )
449
+ )
450
+ var(
451
+ --_sf-sb-it-at-spr,
452
+ var(
453
+ --_sf-sb-it-hr-spr,
454
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-sd)}
455
+ )
456
+ )
457
+ var(
458
+ --_sf-sb-it-at-bscl,
459
+ var(
460
+ --_sf-sb-it-hr-bscl,
461
+ prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-sw-cr)
462
+ )
463
+ );
464
+ }
465
+
466
+ &:hover {
467
+ --_sf-sb-it-hr-pd: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-hr-se-pg)};
468
+ --_sf-sb-it-hr-bd: #{prepareMediaVariable(
469
+ --_ctm-dn-sb-mu-im-se-hr-se-bd-cr
470
+ )};
471
+ --_sf-sb-it-hr-br: #{prepareMediaVariable(
472
+ --_ctm-dn-sb-mu-im-se-hr-se-br-rs
473
+ )};
474
+ --_sf-sb-it-hr-brc: #{prepareMediaVariable(
475
+ --_ctm-dn-sb-mu-im-se-hr-se-br-cr
476
+ )};
477
+ --_sf-sb-it-hr-bw: #{prepareMediaVariable(
478
+ --_ctm-dn-sb-mu-im-se-hr-se-br-wh
479
+ )};
480
+ --_sf-sb-it-hr-bs: #{prepareMediaVariable(
481
+ --_ctm-dn-sb-mu-im-se-hr-se-br-se
482
+ )};
483
+ --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
484
+ --_ctm-dn-sb-mu-im-se-hr-se-sw-ae
485
+ )};
486
+ --_sf-sb-it-hr-blr: #{prepareMediaVariable(
487
+ --_ctm-dn-sb-mu-im-se-hr-se-sw-br
488
+ )};
489
+ --_sf-sb-it-hr-spr: #{prepareMediaVariable(
490
+ --_ctm-dn-sb-mu-im-se-hr-se-sw-sd
491
+ )};
492
+ --_sf-sb-it-hr-bscl: #{prepareMediaVariable(
493
+ --_ctm-dn-sb-mu-im-se-hr-se-sw-cr
494
+ )};
495
+
496
+ --_sf-sb-it-hr-ff: #{prepareMediaVariable(
497
+ --_ctm-dn-sb-mu-im-se-hr-se-ft-fy
498
+ )};
499
+ --_sf-sb-it-hr-fs: #{prepareMediaVariable(
500
+ --_ctm-dn-sb-mu-im-se-hr-se-ft-se
501
+ )};
502
+ --_sf-sb-it-hr-fclr: #{prepareMediaVariable(
503
+ --_ctm-dn-sb-mu-im-se-hr-se-cr
504
+ )};
505
+ --_sf-sb-it-hr-fw: #{prepareMediaVariable(
506
+ --_ctm-dn-sb-mu-im-se-hr-se-ft-wt
507
+ )};
508
+
509
+ --_sf-sb-it-hr-fsi: #{prepareMediaVariable(
510
+ --_ctm-dn-sb-mu-im-se-hr-se-ft-se-ic
511
+ )};
512
+ --_sf-sb-it-hr-td: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-hr-se-ue)};
513
+ --_sf-sb-it-hr-tae: #{prepareMediaVariable(
514
+ --_ctm-dn-sb-mu-im-se-hr-se-tt-an
515
+ )};
516
+ --_sf-sb-it-hr-ls: #{prepareMediaVariable(
517
+ --_ctm-dn-sb-mu-im-se-hr-se-lr-sg
518
+ )};
519
+ --_sf-sb-it-hr-lh: #{prepareMediaVariable(
520
+ --_ctm-dn-sb-mu-im-se-hr-se-le-ht
521
+ )};
522
+ }
523
+ &.active {
524
+ --_sf-sb-it-at-pd: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-sd-se-pg)};
525
+ --_sf-sb-it-at-bd: #{prepareMediaVariable(
526
+ --_ctm-dn-sb-mu-im-se-sd-se-bd-cr
527
+ )};
528
+ --_sf-sb-it-at-br: #{prepareMediaVariable(
529
+ --_ctm-dn-sb-mu-im-se-sd-se-br-rs
530
+ )};
531
+ --_sf-sb-it-at-brc: #{prepareMediaVariable(
532
+ --_ctm-dn-sb-mu-im-se-sd-se-br-cr
533
+ )};
534
+ --_sf-sb-it-at-bw: #{prepareMediaVariable(
535
+ --_ctm-dn-sb-mu-im-se-sd-se-br-wh
536
+ )};
537
+ --_sf-sb-it-at-bs: #{prepareMediaVariable(
538
+ --_ctm-dn-sb-mu-im-se-sd-se-br-se
539
+ )};
540
+ --_sf-sb-it-hr-bsa: #{prepareMediaVariable(
541
+ --_ctm-dn-sb-mu-im-se-sd-se-sw-ae
542
+ )};
543
+ --_sf-sb-it-at-blr: #{prepareMediaVariable(
544
+ --_ctm-dn-sb-mu-im-se-sd-se-sw-br
545
+ )};
546
+ --_sf-sb-it-at-spr: #{prepareMediaVariable(
547
+ --_ctm-dn-sb-mu-im-se-sd-se-sw-sd
548
+ )};
549
+ --_sf-sb-it-at-bscl: #{prepareMediaVariable(
550
+ --_ctm-dn-sb-mu-im-se-sd-se-sw-cr
551
+ )};
552
+
553
+ --_sf-sb-it-at-ff: #{prepareMediaVariable(
554
+ --_ctm-dn-sb-mu-im-se-sd-se-ft-fy
555
+ )};
556
+ --_sf-sb-it-at-fs: #{prepareMediaVariable(
557
+ --_ctm-dn-sb-mu-im-se-sd-se-ft-se
558
+ )};
559
+ --_sf-sb-it-at-fclr: #{prepareMediaVariable(
560
+ --_ctm-dn-sb-mu-im-se-sd-se-cr
561
+ )};
562
+ --_sf-sb-it-at-fw: #{prepareMediaVariable(
563
+ --_ctm-dn-sb-mu-im-se-sd-se-ft-wt
564
+ )};
565
+ --_sf-sb-it-at-fsi: #{prepareMediaVariable(
566
+ --_ctm-dn-sb-mu-im-se-sd-se-ft-se-ic
567
+ )};
568
+ --_sf-sb-it-at-td: #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-sd-se-ue)};
569
+ --_sf-sb-it-at-tae: #{prepareMediaVariable(
570
+ --_ctm-dn-sb-mu-im-se-sd-se-tt-an
571
+ )};
572
+ --_sf-sb-it-at-ls: #{prepareMediaVariable(
573
+ --_ctm-dn-sb-mu-im-se-sd-se-lr-sg
574
+ )};
575
+ --_sf-sb-it-at-lh: #{prepareMediaVariable(
576
+ --_ctm-dn-sb-mu-im-se-sd-se-le-ht
577
+ )};
578
+ }
579
+
580
+ & > a {
581
+ display: var(--_d-flex);
582
+ justify-content: space-between;
583
+ align-items: center;
584
+
585
+ & > span {
586
+ display: var(--_d-flex);
587
+
588
+ &#{$subMenuItemText} {
589
+ font-family: var(
590
+ --_sf-it-at-ff,
591
+ var(
592
+ --_sf-it-hr-ff,
593
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-fy)}
594
+ )
595
+ );
596
+ font-size: var(
597
+ --_sf-sb-it-at-fs,
598
+ var(
599
+ --_sf-sb-it-hr-fs,
600
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-se)}
601
+ )
602
+ );
603
+ color: var(
604
+ --_sf-sb-it-at-fclr,
605
+ var(
606
+ --_sf-sb-it-hr-fclr,
607
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-cr)}
608
+ )
609
+ );
610
+ font-weight: var(
611
+ --_sf-sb-it-at-fw,
612
+ var(
613
+ --_sf-sb-it-hr-fw,
614
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-wt)}
615
+ )
616
+ );
617
+ font-style: var(
618
+ --_sf-sb-it-at-fsi,
619
+ var(
620
+ --_sf-sb-it-hr-fsi,
621
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ft-se-ic)}
622
+ )
623
+ );
624
+ text-decoration: var(
625
+ --_sf-sb-it-at-td,
626
+ var(
627
+ --_sf-sb-it-hr-td,
628
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-ue)}
629
+ )
630
+ );
631
+ text-align: var(
632
+ --_sf-sb-it-at-tae,
633
+ var(
634
+ --_sf-sb-it-hr-tae,
635
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-tt-an)}
636
+ )
637
+ );
638
+ letter-spacing: var(
639
+ --_sf-sb-it-at-ls,
640
+ var(
641
+ --_sf-sb-it-hr-ls,
642
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-lr-sg)}
643
+ )
644
+ );
645
+ line-height: var(
646
+ --_sf-sb-it-at-lh,
647
+ var(
648
+ --_sf-sb-it-hr-lh,
649
+ #{prepareMediaVariable(--_ctm-dn-sb-mu-im-se-dt-se-le-ht)}
650
+ )
651
+ );
652
+ display: -webkit-box;
653
+ -webkit-line-clamp: 1;
654
+ -webkit-box-orient: vertical;
655
+ overflow: hidden;
656
+ }
657
+ }
658
+ }
659
+ }
660
+ }
661
+ }
662
+ }
663
+ }
664
+ }
665
+ }
666
+ }
667
+ & > #{$hamburger} {
668
+ display: var(--_d-none);
669
+ padding: var(--_sf-hm-hr-pd, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-pg)});
670
+ border-radius: var(--_sf-hm-hr-br, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-rs)});
671
+ background: var(--_sf-hm-hr-bd, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-bd-cr)});
672
+
673
+ &[data-show-border="true"] {
674
+ border-style: var(--_sf-hm-hr-bs, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-se)});
675
+ border-width: var(--_sf-hm-hr-bw, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-wh)});
676
+ border-color: var(--_sf-hm-hr-bc, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-cr)});
677
+ }
678
+
679
+ &[data-show-boxshadow="true"] {
680
+ box-shadow: var(--_sf-hm-hr-bsa, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-ae)})
681
+ var(--_sf-hm-hr-blr, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-br)})
682
+ var(--_sf-hm-hr-spr, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-sd)})
683
+ var(--_sf-hm-hr-bscl, prepareMediaVariable(--_ctm-dn-hr-se-dt-se-sw-cr));
684
+ }
685
+
686
+ &:hover {
687
+ & > span {
688
+ svg {
689
+ --_sf-hm-hr-ic-sz: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-in-se)};
690
+ path {
691
+ --_sf-hm-hr-ic-clr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-in-c1)};
692
+ --_sf-hm-hr-ic-swh: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-se-wh)};
693
+ }
694
+ }
695
+ }
696
+ // --_sf-hm-hr-ic-sz: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-in-se)};
697
+ // --_sf-hm-hr-ic-clr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-in-c1)};
698
+
699
+ --_sf-hm-hr-pd: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-pg)};
700
+ --_sf-hm-hr-br: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-br-rs)};
701
+ --_sf-hm-hr-bd: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-bd-cr)};
702
+
703
+ --_sf-hm-hr-bs: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-br-se)};
704
+ --_sf-hm-hr-bw: #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-br-wh)};
705
+ --_sf-hm-hr-bc: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-br-cr)};
706
+
707
+ --_sf-hm-hr-bsa: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-ae)};
708
+ --_sf-hm-hr-blr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-br)};
709
+ --_sf-hm-hr-spr: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-sd)};
710
+ --_sf-hm-hr-bscl: #{prepareMediaVariable(--_ctm-dn-hr-se-hr-se-sw-cr)};
711
+ }
712
+
713
+ & > span {
714
+ svg {
715
+ width: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-in-se)});
716
+ height: var(--_sf-hm-hr-ic-sz, #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-in-se)});
717
+
718
+ path {
719
+ stroke: var(
720
+ --_sf-hm-hr-ic-clr,
721
+ #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-in-c1)}
722
+ );
723
+ stroke-width: var(
724
+ --_sf-hm-hr-ic-swh,
725
+ #{prepareMediaVariable(--_ctm-dn-hr-se-dt-se-se-wh)}
726
+ );
727
+ }
728
+ }
729
+ }
730
+ }
731
+
732
+ @media only screen and (min-width: 10px) {
733
+ &.dk {
734
+ @include hamburgerCSS();
735
+ }
736
+ }
737
+
738
+ @media only screen and (min-width: 10px) and (max-width: 1023px) {
739
+ &.tb {
740
+ @include hamburgerCSS();
741
+ }
742
+ }
743
+
744
+ @media only screen and (min-width: 10px) and (max-width: 767px) {
745
+ &.mb {
746
+ @include hamburgerCSS();
747
+ }
748
+ }
749
+ }
750
+ }
751
+ }
752
+ }