PageSourceSearch

https://www.aveve.be/fr/checkout/cart/index/

html aveve.be collected 2026-09-24 10:29:36 UTC 777,595 bytes, 9,289 lines download raw bytes

1<!doctype html>
2<html lang="fr">
3<head >
4    <meta charset="utf-8"/>
5<meta name="title" content="Shopping Cart"/>
6<meta name="keywords" content="Aveve"/>
7<meta name="robots" content="INDEX,FOLLOW"/>
8<meta name="viewport" content="width=device-width, initial-scale=1"/>
9<title>Shopping Cart</title>
10<link rel="preload" as="style" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/css/styles.css" />
11<link rel="preload" as="script" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_MagentoDataServices/js/storefront-event-collector.js" />
12<link rel="preload" as="script" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_MagentoDataServices/js/storefront-events-sdk.js" />
13<link rel="preload" as="script" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_MagentoProductRecommendations/js/recs-sdk.js" />
14<link rel="preload" as="script" href="//cdn-4.convertexperiments.com/v1/js/10043079-10044225.js?environment=production" />
15<link rel="preload" as="font" crossorigin="anonymous" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/fonts/MuseoSans-300.woff2" />
16<link rel="preload" as="font" crossorigin="anonymous" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/fonts/MuseoSans-500.woff2" />
17        <link rel="stylesheet" type="text/css" media="all" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/css/styles.css" />
18<link rel="icon" sizes="16x16" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Magento_Theme/favicon.ico" />
19<link rel="icon" type="image/x-icon" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Magento_Enterprise/favicon.ico" />
20<link rel="shortcut icon" type="image/x-icon" href="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Magento_Enterprise/favicon.ico" />
21<script type="text/javascript" defer="defer" src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_MagentoDataServices/js/storefront-event-collector.js"></script>
vendor: 1 bytes, line 21
21
22<script type="text/javascript" defer="defer" src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_MagentoDataServices/js/storefront-events-sdk.js"></script>
vendor: 1 bytes, line 22
22
23<script type="text/javascript" defer="defer" src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_MagentoProductRecommendations/js/recs-sdk.js"></script>
23
24<link rel="preconnect" crossorigin="" href="https://images.ctfassets.net" />
25<link rel="dns-prefetch" href="https://images.ctfassets.net" />
26<!-- begin Convert Experiences code-->
26<script type="text/javascript" src="//cdn-4.convertexperiments.com/v1/js/10043079-10044225.js?environment=production"></script>
26<!-- end Convert Experiences code -->    
27<script nonce="dHd5Ym43cmJtcGdsZ2JnbW9nMWkwd2Zra2tyY3QwYXc=">
28    window.YIREO_GOOGLETAGMANAGER2_ENABLED = true;
29    (function (events) {
30        const initYireoGoogleTagManager2 = function () {
31            events.forEach(function (eventType) {
32                window.removeEventListener(eventType, initYireoGoogleTagManager2);
33            });
34
35                        (function (w, d, s, l, i) {
36                w[l] = w[l] || [];
37                w[l].push({'gtm.start': new Date().getTime(), event: 'gtm.js'});
38                var f = d.getElementsByTagName(s)[0],
39                    j = d.createElement(s),
40                    dl = l != 'dataLayer' ? '&l=' + l : '';
41                j.async = true;
42                j.src = 'https://www.googletagmanager.com' + '/gtm.js?id=' + i + dl;
43                f.parentNode.insertBefore(j, f);
44            })(window, document, 'script', 'dataLayer', 'GTM-5GJVS6');
45                    };
46
47        events.forEach(function (eventType) {
48            window.addEventListener(eventType, initYireoGoogleTagManager2, {once: true, passive: true})
49        });
50    })(['load', 'keydown', 'mouseover', 'scroll', 'touchstart', 'wheel']);
51
52    </script>
vendor: 1 bytes, line 52
52
53<script>
54    var BASE_URL = 'https://www.aveve.be/fr/';
55    var THEME_PATH = 'https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE';
56    var COOKIE_CONFIG = {
57        "expires": null,
58        "path": "\u002F",
59        "domain": ".www.aveve.be",
60        "secure": true,
61        "lifetime": "10519000",
62        "cookie_restriction_enabled": false    };
63    var CURRENT_STORE_CODE = 'fr';
64    var CURRENT_WEBSITE_ID = '1';
65
66    window.hyva = window.hyva || {}
67
68    window.cookie_consent_groups = window.cookie_consent_groups || {}
69    window.cookie_consent_groups['necessary'] = true;
70
71    window.cookie_consent_config = window.cookie_consent_config || {};
72    window.cookie_consent_config['necessary'] = [].concat(
73        window.cookie_consent_config['necessary'] || [],
74        [
75            'user_allowed_save_cookie',
76            'form_key',
77            'mage-messages',
78            'private_content_version',
79            'mage-cache-sessid',
80            'last_visited_store',
81            'section_data_ids'
82        ]
83    );
84</script>
vendor: 1 bytes, line 84
84
85<script>
86    'use strict';
87    (function( hyva, undefined ) {
88
89        function lifetimeToExpires(options, defaults) {
90
91            const lifetime = options.lifetime || defaults.lifetime;
92
93            if (lifetime) {
94                const date = new Date;
95                date.setTime(date.getTime() + lifetime * 1000);
96                return date;
97            }
98
99            return null;
100        }
101
102        function generateRandomString() {
103
104            const allowedCharacters = '0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ',
105                length = 16;
106
107            let formKey = '',
108                charactersLength = allowedCharacters.length;
109
110            for (let i = 0; i < length; i++) {
111                formKey += allowedCharacters[Math.round(Math.random() * (charactersLength - 1))]
112            }
113
114            return formKey;
115        }
116
117        const sessionCookieMarker = {noLifetime: true}
118
119        const cookieTempStorage = {};
120
121        const internalCookie = {
122            get(name) {
123                const v = document.cookie.match('(^|;) ?' + name + '=([^;]*)(;|$)');
124                return v ? v[2] : null;
125            },
126            set(name, value, days, skipSetDomain) {
127                let expires,
128                    path,
129                    domain,
130                    secure,
131                    samesite;
132
133                const defaultCookieConfig = {
134                    expires: null,
135                    path: '/',
136                    domain: null,
137                    secure: false,
138                    lifetime: null,
139                    samesite: 'lax'
140                };
141
142                const cookieConfig = window.COOKIE_CONFIG || {};
143
144                expires = days && days !== sessionCookieMarker
145                    ? lifetimeToExpires({lifetime: 24 * 60 * 60 * days, expires: null}, defaultCookieConfig)
146                    : lifetimeToExpires(window.COOKIE_CONFIG, defaultCookieConfig) || defaultCookieConfig.expires;
147
148                path = cookieConfig.path || defaultCookieConfig.path;
149                domain = !skipSetDomain && (cookieConfig.domain || defaultCookieConfig.domain);
150                secure = cookieConfig.secure || defaultCookieConfig.secure;
151                samesite = cookieConfig.samesite || defaultCookieConfig.samesite;
152
153                document.cookie = name + "=" + encodeURIComponent(value) +
154                    (expires && days !== sessionCookieMarker ? '; expires=' + expires.toGMTString() : '') +
155                    (path ? '; path=' + path : '') +
156                    (domain ? '; domain=' + domain : '') +
157                    (secure ? '; secure' : '') +
158                    (samesite ? '; samesite=' + samesite : 'lax');
159            },
160            isWebsiteAllowedToSaveCookie() {
161                const allowedCookies = this.get('user_allowed_save_cookie');
162                if (allowedCookies) {
163                    const allowedWebsites = JSON.parse(unescape(allowedCookies));
164
165                    return allowedWebsites[CURRENT_WEBSITE_ID] === 1;
166                }
167                return false;
168            },
169            getGroupByCookieName(name) {
170                const cookieConsentConfig = window.cookie_consent_config || {};
171                let group = null;
172                for (let prop in cookieConsentConfig) {
173                    if (!cookieConsentConfig.hasOwnProperty(prop)) continue;
174                    if (cookieConsentConfig[prop].includes(name)) {
175                        group = prop;
176                        break;
177                    }
178                }
179                return group;
180            },
181            isCookieAllowed(name) {
182                const cookieGroup = this.getGroupByCookieName(name);
183                return cookieGroup
184                    ? window.cookie_consent_groups[cookieGroup]
185                    : this.isWebsiteAllowedToSaveCookie();
186            },
187            saveTempStorageCookies() {
188                for (const [name, data] of Object.entries(cookieTempStorage)) {
189                    if (this.isCookieAllowed(name)) {
190                        this.set(name, data['value'], data['days'], data['skipSetDomain']);
191                        delete cookieTempStorage[name];
192                    }
193                }
194            }
195        };
196
197        hyva.getCookie = (name) => {
198            const cookieConfig = window.COOKIE_CONFIG || {};
199
200            if (cookieConfig.cookie_restriction_enabled && ! internalCookie.isCookieAllowed(name)) {
201                return cookieTempStorage[name] ? cookieTempStorage[name]['value'] : null;
202            }
203
204            return internalCookie.get(name);
205        }
206
207        hyva.setCookie = (name, value, days, skipSetDomain) => {
208            const cookieConfig = window.COOKIE_CONFIG || {};
209
210            if (cookieConfig.cookie_restriction_enabled && ! internalCookie.isCookieAllowed(name)) {
211                cookieTempStorage[name] = {value, days, skipSetDomain};
212                return;
213            }
214            return internalCookie.set(name, value, days, skipSetDomain);
215        }
216
217
218        hyva.setSessionCookie = (name, value, skipSetDomain) => {
219            return hyva.setCookie(name, value, sessionCookieMarker, skipSetDomain)
220        }
221
222        hyva.getBrowserStorage = () => {
223            const browserStorage = window.localStorage || window.sessionStorage;
224            if (!browserStorage) {
225                console.warn('Browser Storage is unavailable');
226                return false;
227            }
228            try {
229                browserStorage.setItem('storage_test', '1');
230                browserStorage.removeItem('storage_test');
231            } catch (error) {
232                console.warn('Browser Storage is not accessible', error);
233                return false;
234            }
235            return browserStorage;
236        }
237
238        hyva.postForm = (postParams) => {
239            const form = document.createElement("form");
240
241            let data = postParams.data;
242
243            if (! postParams.skipUenc && ! data.uenc) {
244                data.uenc = btoa(window.location.href);
245            }
246            form.method = "POST";
247            form.action = postParams.action;
248
249            Object.keys(postParams.data).map(key => {
250                const field = document.createElement("input");
251                field.type = 'hidden'
252                field.value = postParams.data[key];
253                field.name = key;
254                form.appendChild(field);
255            });
256
257            const form_key = document.createElement("input");
258            form_key.type = 'hidden';
259            form_key.value = hyva.getFormKey();
260            form_key.name="form_key";
261            form.appendChild(form_key);
262
263            document.body.appendChild(form);
264
265            form.submit();
266        }
267
268        hyva.getFormKey = function () {
269            let formKey = hyva.getCookie('form_key');
270
271            if (!formKey) {
272                formKey = generateRandomString();
273                hyva.setCookie('form_key', formKey);
274            }
275
276            return formKey;
277        }
278
279        hyva.formatPrice = (value, showSign, options = {}) => {
280            const groupSeparator = options.groupSeparator;
281            const decimalSeparator = options.decimalSeparator
282            delete options.groupSeparator;
283            delete options.decimalSeparator;
284            const formatter = new Intl.NumberFormat(
285                'en\u002DUS',
286                Object.assign({
287                    style: 'currency',
288                    currency: 'EUR',
289                    signDisplay: showSign ? 'always' : 'auto'
290                }, options)
291            );
292            return (typeof Intl.NumberFormat.prototype.formatToParts === 'function') ?
293                formatter.formatToParts(value).map(({type, value}) => {
294                    switch (type) {
295                        case 'currency':
296                            return '\u20AC' || value;
297                        case 'minusSign':
298                            return '- ';
299                        case 'plusSign':
300                            return '+ ';
301                        case 'group':
302                            return groupSeparator !== undefined ? groupSeparator : value;
303                        case 'decimal':
304                            return decimalSeparator !== undefined ? decimalSeparator : value;
305                        default :
306                            return value;
307                    }
308                }).reduce((string, part) => string + part) :
309                formatter.format(value);
310        }
311
312        const formatStr = function (str, nStart) {
313            const args = Array.from(arguments).slice(2);
314
315            return str.replace(/(%+)([0-9]+)/g, (m, p, n) => {
316                const idx = parseInt(n) - nStart;
317
318                if (args[idx] === null || args[idx] === void 0) {
319                    return m;
320                }
321                return p.length % 2
322                    ? p.slice(0, -1).replace('%%', '%') + args[idx]
323                    : p.replace('%%', '%') + n;
324            })
325        }
326
327        hyva.str = function (string) {
328            const args = Array.from(arguments);
329            args.splice(1, 0, 1);
330
331            return formatStr.apply(undefined, args);
332        }
333
334        hyva.strf = function () {
335            const args = Array.from(arguments);
336            args.splice(1, 0, 0);
337
338            return formatStr.apply(undefined, args);
339        }
340
341        /**
342         * Take a html string as `content` parameter and
343         * extract an element from the DOM to replace in
344         * the current page under the same selector,
345         * defined by `targetSelector`
346         */
347        hyva.replaceDomElement = (targetSelector, content) => {
348            // Parse the content and extract the DOM node using the `targetSelector`
349            const parser = new DOMParser();
350            const doc = parser.parseFromString(content, 'text/html');
351            const contentNode = doc.querySelector(targetSelector);
352
353            // Bail if content or target can't be found
354            if (!contentNode || !document.querySelector(targetSelector)) {
355                return;
356            }
357
358                        hyva.activateScripts(contentNode);
359            
360            // Replace the old DOM node with the new content
361            document.querySelector(targetSelector).replaceWith(contentNode);
362
363            // Reload customerSectionData and display cookie-messages if present
364            window.dispatchEvent(new CustomEvent("reload-customer-section-data"));
365            hyva.initMessages();
366        }
367
368        hyva.removeScripts = (contentNode) => {
369            const scripts = contentNode.getElementsByTagName('script');
370            for (let i = 0; i < scripts.length; i++) {
371                scripts[i].parentNode.removeChild(scripts[i]);
372            }
373            const templates = contentNode.getElementsByTagName('template');
374            for (let i = 0; i < templates.length; i++) {
375                const container = document.createElement('div');
376                container.innerHTML = templates[i].innerHTML;
377                hyva.removeScripts(container);
378                templates[i].innerHTML = container.innerHTML;
379            }
380        }
381
382        hyva.activateScripts = (contentNode) => {
383            // Create new array from HTMLCollection to avoid mutation of collection while manipulating the DOM.
384            const scripts = Array.from(contentNode.getElementsByTagName('script'));
385
386            // Iterate over all script tags to duplicate+inject each into the head
387            for (const original of scripts) {
388                const script = document.createElement('script');
389                original.type && (script.type = original.type);
390                script.innerHTML = original.innerHTML;
391
392                // Remove the original (non-executing) script from the contentNode
393                original.parentNode.removeChild(original)
394
395                // Add script to head
396                document.head.appendChild(script);
397            }
398
399            return contentNode;
400        }
401
402        const replace = {['+']: '-', ['/']: '_', ['=']: ','};
403        hyva.getUenc = () => btoa(window.location.href).replace(/[+/=]/g, match => replace[match]);
404
405        let currentTrap;
406
407        const focusableElements = (rootElement) => {
408            const selector = 'button, [href], input, select, textarea, details, [tabindex]:not([tabindex="-1"]';
409            return Array.from(rootElement.querySelectorAll(selector))
410                .filter(el => {
411                    return el.style.display !== 'none'
412                        && !el.disabled
413                        && el.tabIndex !== -1
414                        && (el.offsetWidth || el.offsetHeight || el.getClientRects().length)
415                })
416        }
417
418        const focusTrap = (e) => {
419            const isTabPressed = e.key === 'Tab' || e.keyCode === 9;
420            if (!isTabPressed) return;
421
422            const focusable = focusableElements(currentTrap)
423            const firstFocusableElement = focusable[0]
424            const lastFocusableElement = focusable[focusable.length - 1]
425
426            e.shiftKey
427                ? document.activeElement === firstFocusableElement && (lastFocusableElement.focus(), e.preventDefault())
428                : document.activeElement === lastFocusableElement && (firstFocusableElement.focus(), e.preventDefault())
429        };
430
431        hyva.releaseFocus = (rootElement) => {
432            if (currentTrap && (!rootElement || rootElement === currentTrap)) {
433                currentTrap.removeEventListener('keydown', focusTrap)
434                currentTrap = null
435            }
436        }
437        hyva.trapFocus = (rootElement) => {
438            if (!rootElement) return;
439            hyva.releaseFocus()
440            currentTrap = rootElement
441            rootElement.addEventListener('keydown', focusTrap)
442            const firstElement = focusableElements(rootElement)[0]
443            firstElement && firstElement.focus()
444        }
445
446        hyva.safeParseNumber = (rawValue) => {
447            const number = rawValue ? parseFloat(rawValue) : null;
448
449            return Array.isArray(number) || isNaN(number) ? rawValue : number;
450        }
451
452        const toCamelCase = s => s.split('_').map(word => word.charAt(0).toUpperCase() + word.slice(1)).join('');
453        hyva.createBooleanObject = (name, value = false, additionalMethods = {}) => {
454
455            const camelCase = toCamelCase(name);
456            const key = '__hyva_bool_' + name
457
458            return new Proxy(Object.assign(
459                additionalMethods,
460                {
461                    [key]: !!value,
462                    [name]() {return !!this[key]},
463                    ['!' + name]() {return !this[key]},
464                    ['toggle' + camelCase]() {this[key] = !this[key]},
465                    [`set${camelCase}True`]() {this[key] = true},
466                    [`set${camelCase}False`]() {this[key] = false},
467                }
468            ), {
469                set(target, prop, value) {
470                    return prop === name
471                        ? (target[key] = !!value)
472                        : Reflect.set(...arguments);
473                }
474            })
475        }
476
477                hyva.alpineInitialized = (fn) => window.addEventListener('alpine:initialized', fn, {once: true})
478        window.addEventListener('alpine:init', () => Alpine.data('{}', () => ({})), {once: true});
479                window.addEventListener('user-allowed-save-cookie', () => internalCookie.saveTempStorageCookies())
480
481    }( window.hyva = window.hyva || {} ));
482</script>
vendor: 1 bytes, line 482
482
483<script>
484    if (!window.IntersectionObserver) {
485        window.IntersectionObserver = function (callback) {
486            this.observe = el => el && callback(this.takeRecords());
487            this.takeRecords = () => [{isIntersecting: true, intersectionRatio: 1}];
488            this.disconnect = () => {};
489            this.unobserve = () => {};
490        }
491    }
492</script>
vendor: 1 bytes, line 492
492
493<script>
494    document.addEventListener("DOMContentLoaded", function() {
495        if (HTMLScriptElement.supports &&
496            HTMLScriptElement.supports('speculationrules')) {
497            const specScript = document.createElement('script');
498            specScript.type = 'speculationrules';
499                        const specRules = {
500                "prerender": [{
501                    "source": "document",
502                    "where": {
503                        "and": [
504                            {
505                                "href_matches": "/*"
506                            },
507                            {"not": {"href_matches": "/*(customer|login|logout|auth|cart|checkout|search|download|redirect|rewrite|store|productalert)/*"}},
508                            {"not": {"href_matches": "*.pdf"}},
509                            {"not": {"selector_matches": ".do-not-prerender"}},
510                            {"not": {"selector_matches": "[rel=nofollow]"}},
511                            {"not": {"selector_matches": "[target=_blank]"}},
512                            {"not": {"selector_matches": "[target=_parent]"}},
513                            {"not": {"selector_matches": "[target=_top]"}}
514                        ]
515                    },
516                    "eagerness": "moderate"
517                }]
518            };
519            specScript.textContent = JSON.stringify(specRules);
520            document.body.append(specScript);
521        }
522    });
523</script>
523
524
525<script>
526    window.addEventListener('load', function () {
527        if(typeof magentoStorefrontEvents === 'undefined' || !magentoStorefrontEvents) return;
528
529        window.magentoStorefrontEvents = magentoStorefrontEvents;
530        window.magentoStorefrontEventsDefaultTimeout = 200;
531        magentoStorefrontEvents.context.setStorefrontInstance(
532            {"storeUrl":"https:\/\/www.aveve.be\/","websiteId":1,"websiteCode":"aveve","storeId":1,"storeCode":"aveve","storeViewId":3,"storeViewCode":"fr","websiteName":"Aveve","storeName":"Aveve","storeViewName":"FR","baseCurrencyCode":"EUR","storeViewCurrencyCode":"EUR","catalogExtensionVersion":"103.4.3","environmentId":"c583c93d-0a59-462f-aa34-88549670e9ec","environment":"Production","storefrontTemplate":"Hyva"}        );
533        magentoStorefrontEvents.context.setMagentoExtension({
534            magentoExtensionVersion: "7.7.0",
535        });
536        magentoStorefrontEvents.context.setDataServicesExtension({
537            version: "7.7.0",
538        });
539        magentoStorefrontEvents.context.setPage({
540            pageType: "Default"
541        });
542        magentoStorefrontEvents.context.setContext("pageExtended", {
543            action: "page-view"
544        });
545
546        
547        magentoStorefrontEvents.publish.pageView();
548    });
549</script>
549
550</head>
551<body id="html-body" class="checkout-cart-index page-layout-1column">
vendor: 68 bytes, lines 551-552
551
552<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
552GTM-5GJVS6
vendor: 83 bytes, line 552
552" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
553<input name="form_key" type="hidden" value="5lU1xVujk3L0wVki" />
554    <noscript>
555        <section class="message global noscript border-b-2 border-blue-500 bg-blue-50 shadow-none m-0 px-0 rounded-none font-normal">
556            <div class="container text-center">
557                <p>
558                    <strong>JavaScript seems to be disabled in your browser.</strong>
559                    <span>
560                        For the best experience on our site, be sure to turn on Javascript in your browser.                    </span>
561                </p>
562            </div>
563        </section>
564    </noscript>
565
566
567<script>
568    document.body.addEventListener('touchstart', () => {}, {passive: true})
569</script>
vendor: 1 bytes, line 569
569
570<script nonce="dHd5Ym43cmJtcGdsZ2JnbW9nMWkwd2Zra2tyY3QwYXc=">
571    function yireoGoogleTagManager2Pusher(eventData, message, callback) {
572        window.YIREO_GOOGLETAGMANAGER2_PAST_EVENTS = window.YIREO_GOOGLETAGMANAGER2_PAST_EVENTS || [];
573
574        function doCallback(cb) {
575            if (undefined === cb) {
576                return;
577            }
578
579            cb();
580        }
581
582        
583        const copyEventData = Object.assign({}, eventData);
584        let metaData = {};
585        if (copyEventData.meta) {
586            metaData = copyEventData.meta;
587            delete copyEventData.meta;
588        }
589
590        const eventHash = btoa(encodeURIComponent(JSON.stringify(copyEventData)));
591        if (window.YIREO_GOOGLETAGMANAGER2_PAST_EVENTS.includes(eventHash)) {
592            yireoGoogleTagManager2Logger('Warning: Event already triggered', eventData);
593            doCallback(callback);
594            return;
595        }
596
597        if (metaData && metaData.allowed_pages && metaData.allowed_pages.length > 0
598            && false === metaData.allowed_pages.some(page => window.location.pathname.includes(page))) {
599            yireoGoogleTagManager2Logger('Warning: Skipping event, not in allowed pages', window.location.pathname, eventData);
600            doCallback(callback);
601            return;
602        }
603
604        if (!message) {
605            message = 'push (unknown) [unknown]';
606        }
607
608        yireoGoogleTagManager2Logger(message, eventData);
609        window.dataLayer = window.dataLayer || [];
610
611        if (eventData.ecommerce) {
612            window.dataLayer.push({ecommerce: null});
613        }
614
615        try {
616            window.dataLayer.push(eventData);
617            window.YIREO_GOOGLETAGMANAGER2_PAST_EVENTS.push(eventHash);
618        } catch(error) {
619            doCallback(callback);
620        }
621
622        doCallback(callback);
623    }
624</script>
vendor: 1 bytes, line 624
624
625<script nonce="dHd5Ym43cmJtcGdsZ2JnbW9nMWkwd2Zra2tyY3QwYXc=">
626    function yireoGoogleTagManager2Logger(...args) {
627        const debug = window.YIREO_GOOGLETAGMANAGER2_DEBUG || false;
628        if (false === debug) {
629            return;
630        }
631
632        var color = 'gray';
633        if (args[0].toLowerCase().startsWith('push')) {
634            color = 'green';
635        }
636
637        if (args[0].toLowerCase().startsWith('warning')) {
638            color = 'orange';
639        }
640
641        var css = 'color:white; background-color:' + color + '; padding:1px;'
642        console.log('%cYireo_GoogleTagManager2', css, ...args);
643    }
644</script>
644
645
646<script>
647    'use strict';
648    (function(hyva) {
649                const formValidationRules = {
650            required(value, options, field, context) {
651                const el = field.element.type === 'hidden' ? createTextInputFrom(field.element) : field.element,
652                    msg = 'Ce\u0020champ\u0020est\u0020obligatoire.';
653
654                if (el.type === 'radio' || el.type === 'checkbox') {
655                    return (value === undefined || value.length === 0) ? msg : true;
656                }
657
658                if (value.length > 0 && " " === value[0]) {
659                    return 'La\u0020valeur\u0020ne\u0020peut\u0020pas\u0020commencer\u0020par\u0020un\u0020espace.';
660                }
661
662                el.setAttribute('required', '');
663                el.checkValidity();
664
665                return el.validity.valueMissing ? msg : true;
666            },
667            maxlength(value, options, field, context) {
668                if (value.length > Number(options)) {
669                    return hyva.strf('Max\u0020\u00250\u0020caract\u00E8res\u0020autoris\u00E9s.', options);
670                }
671                return true;
672            },
673            minlength(value, options, field, context) {
674                if (value.length > 0 && value.length < Number(options)) {
675                    return hyva.strf('Veuillez\u0020saisir\u0020au\u0020moins\u0020\u0022\u00250\u0022\u0020caract\u00E8res', options);
676                }
677                return true;
678            },
679            giftCardAmount(value, options, field, context) {
680                if (!Number.isInteger(Number(value))){
681                    return hyva.strf('Oups,\u0020la\u0020valeur\u0020entr\u00E9e\u0020devrait\u0020\u00EAtre\u0020un\u0020nombre');
682                }
683
684                if (value < options[0] || value > options[1]) {
685                    return hyva.strf('Oups,\u0020le\u0020montant\u0020ne\u0020peut\u0020pas\u0020\u00EAtre\u0020inf\u00E9rieur\u0020\u00E0\u0020\u00250\u0020euros\u0020ou\u0020sup\u00E9rieur\u0020\u00E0\u0020\u00251\u0020euros', options[0], options[1]);
686                }
687
688                if (options[2] && (value % options[2]) !== 0){
689                    return hyva.strf('Oups,\u0020le\u0020montant\u0020doit\u0020toujours\u0020\u00EAtre\u0020un\u0020multiple\u0020de\u0020\u00250', options[2]);
690                }
691
692                return true;
693            },
694            max(value, options, field, context) {
695                field.element.setAttribute('max', options);
696                field.element.checkValidity();
697                if (field.element.validity.rangeOverflow) {
698                    return hyva.strf('Please\u0020enter\u0020a\u0020value\u0020less\u0020than\u0020or\u0020equal\u0020to\u0020\u0022\u00250\u0022.', options);
699                }
700                return true;
701            },
702            min(value, options, field, context) {
703                field.element.setAttribute('min', options);
704                field.element.checkValidity();
705                if (field.element.validity.rangeUnderflow) {
706                    return hyva.strf('La\u0020quantit\u00E9\u0020minimale\u0020de\u0020commande\u0020sur\u0020le\u0020webshop\u0020est\u0020de\u0020\u0022\u00250\u0022\u0020pi\u00E8ces', options);
707                }
708                return true;
709            },
710            step(value, options, field, context) {
711                field.element.setAttribute('step', options);
712                field.element.checkValidity();
713                if (field.element.validity.stepMismatch) {
714                    const val = Number(options);
715                    return hyva.strf('Please\u0020enter\u0020a\u0020valid\u0020value.\u0020The\u0020two\u0020nearest\u0020valid\u0020values\u0020are\u0020\u0022\u00250\u0022\u0020and\u0020\u0022\u00251\u0022.', Math.floor(val), Math.ceil(val));
716                }
717                return true;
718            },
719            pattern(value, options, field, context) {
720                field.element.setAttribute('pattern', options);
721                field.element.checkValidity();
722                if (field.element.validity.patternMismatch) {
723                    return field.element.title
724                        ? hyva.strf('Please\u0020match\u0020the\u0020requested\u0020format\u003A\u0020\u00250.', field.element.title)
725                        : 'Please\u0020match\u0020the\u0020requested\u0020format.'
726                }
727                return true;
728            },
729            email(value, options, field, context) {
730                                const rule = /^([a-z0-9,!\#\$%&'\*\+\/=\?\^_`\{\|\}~-]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z0-9,!\#\$%&'\*\+\/=\?\^_`\{\|\}~-]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*@([a-z0-9-]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z0-9-]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*\.(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]){2,})$/i;
731                if (value.length > 0 && !rule.test(value)) {
732                    return 'Veuillez\u0020saisir\u0020une\u0020adresse\u0020\u00E9lectronique\u0020valide.';
733                }
734                const rule2 = /[^\x00-\x7F]/gi;
735                if (value.length > 0 && rule2.test(value)) {
736                    return 'Veuillez\u0020saisir\u0020une\u0020adresse\u0020\u00E9lectronique\u0020valide.';
737                }
738                return true;
739            },
740            emailEqualTo(value, options, field, context) {
741                const dependencyField = context.fields[options].element;
742                const dependencyFieldName = dependencyField.label || dependencyField.name;
743                if (value !== dependencyField.value) {
744                    return hyva.strf('Votre\u0020e\u002Dmail\u0020de\u0020confirmation\u0020doit\u0020correspondre\u0020\u00E0\u0020votre\u0020adresse\u0020e\u002Dmail.', dependencyFieldName);
745                }
746                return true;
747            },
748            numbersAndTextOnly(value, options, field, context) {
749                const rule = /^[a-zA-Z0-9\s]*$/i;
750
751                if (value.length > 0 && !rule.test(value.trim())) {
752                    return 'Lettres,\u0020chiffres\u0020ou\u0020espaces\u0020uniquement';
753                }
754                return true;
755            },
756            houseAndBusNumber(value, options, field, context) {
757                const rule = /^[a-zA-Z0-9\s.;,\-+*#:\/\'\"()\[\]]+$/i;
758
759                if (value.length > 0 && !rule.test(value.trim())) {
760                    return 'Letters,\u0020numbers,\u0020spaces\u0020and\u0020certain\u0020punctuation\u0020marks\u0020\u0028.,\u003B\u002D\u002B\u002A\u0023\u003A\u002F\u0027\u0022\u0028\u0029\u005B\u005D\u0029\u0020only\u0020please.';
761                }
762                return true;
763            },
764            alphanumeric(value, options, field, context) {
765                                const rule = /^([A-zÀ-ÿ0-9])+([\sA-zÀ-ÿ0-9_-]{0,})+([A-zÀ-ÿ0-9])$/;
766
767                if (value.length > 0 && !rule.test(value.trim())) {
768                    return 'Lettres,\u0020chiffres,\u0020espaces\u0020ou\u0020caract\u00E8res\u0020de\u0020soulignement\u0020uniquement,\u0020s\u0027il\u0020vous\u0020pla\u00EEt.';
769                }
770                return true;
771            },
772            numberOnly(value, options, field, context){
773                                const rule = /^[0-9]+$/i;
774
775                if (value.length > 0 && !rule.test(value.trim())) {
776                    return 'Chiffres\u0020uniquement,\u0020s\u0027il\u0020vous\u0020pla\u00EEt.';
777                }
778                return true;
779            },
780            textOnly(value, options, field, context) {
781                const rule = /^(?:[a-zA-Z_-_'-]+(?:\s[a-zA-Z_-_'-]+)*|[a-zA-Z_-_'-]+)$/i;
782
783                if (value.length > 0 && !rule.test(value.trim())) {
784                    return 'Seulement\u0020des\u0020lettres,\u0020des\u0020espaces,\u0020des\u0020underscores\u0020ou\u0020des\u0020apostrophes\u0020svp.';
785                }
786                return true;
787            },
788            noEmoticons(value, options, field, context) {
789                let valueWithoutIcons = value.replace(/[\u{1F300}-\u{1F5FF}\u{1F600}-\u{1F64F}\u{1F680}-\u{1F6FF}\u{1F900}-\u{1F9FF}\u{2300}-\u{23FF}\u{2600}-\u{26FF}\u{2700}-\u{27BF}]/gu, '');
790
791                if (valueWithoutIcons !== value) {
792                    return 'Emoticons\u0020are\u0020not\u0020allowed.';
793                }
794
795                return true;
796            },
797            belgiumPostcode(value, options, field, context) {
798                if (value.length !== 4){
799                    return true;
800                }
801
802                const rule = /^[1-9][0-9]{3}$/i;
803
804                if (value.length > 0 && !rule.test(value.trim())) {
805                    return 'Veuillez\u0020entrer\u0020un\u0020code\u0020postal\u0020belge\u0020valide';
806                }
807
808                return true;
809            },
810            validateInterests(value, options, field, context) {
811                let checkedValueExists = false;
812
813                options.forEach(function (option) {
814                    const dependencyField = context.fields[option].element;
815
816                    if (dependencyField.checked) {
817                        checkedValueExists = true;
818                    }
819                });
820
821                window.dispatchEvent(new CustomEvent('validate-interests', {detail: {showErrorMsg: !checkedValueExists}}));
822
823                return true;
824            },
825            validateStoreChosen(value, options, field, context) {
826                let chosenStore = null;
827                if (options === 'value') {
828                    chosenStore = value
829                } else {
830                    chosenStore = field.element.getAttribute(options);
831                }
832
833                if (!chosenStore || chosenStore.trim() === '') {
834                    return 'Veuillez\u0020choisir\u0020un\u0020magasin';
835                }
836
837                return true;
838            },
839            passwordEqualTo(value, options, field, context) {
840                const dependencyField = context.fields[options].element;
841                const dependencyFieldName = dependencyField.label || dependencyField.name;
842                if (value !== dependencyField.value) {
843                    return hyva.strf('Vos\u0020mots\u0020de\u0020passe\u0020ne\u0020correspondent\u0020pas', dependencyFieldName);
844                }
845                return true;
846            },
847            password(value, options, field, context) {
848                return true;
849            },
850            _password(value, message) {
851                if (value.length > 0 && !/(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[\/\!"\#\$%&'\(\)\*\+,\-\.\: ;\<\=\>\?@\[\\\]\^_\{\|\}~])[A-Za-z\d\/\!"\#\$%&'\(\)\*\+,\-\.\: ;\<\=\>\?@\[\\\]\^_\{\|\}~]{8,}/.test(value)) {
852                    return message;
853                }
854                return true;
855            },
856            passwordUppercase(value, options, field, context) {
857                return this._password(value, 'Au\u0020moins\u0020une\u0020lettre\u0020majuscule');
858            },
859            passwordLowercase(value, options, field, context) {
860                return this._password(value, 'Au\u0020moins\u0020une\u0020lettre\u0020minuscule');
861            },
862            passwordNumber(value, options, field, context) {
863                return this._password(value, 'Au\u0020moins\u0020un\u0020num\u00E9ro');
864            },
865            passwordSpecialCharacter(value, options, field, context) {
866                return this._password(value, 'Au\u0020moins\u0020un\u0020caract\u00E8re\u0020sp\u00E9cial');
867            },
868            equalTo(value, options, field, context) {
869                const dependencyField = context.fields[options].element;
870                if (value !== dependencyField.value) {
871                    const dependencyFieldName =
872                        dependencyField.label ||
873                        dependencyField.title ||
874                        (dependencyField.labels && dependencyField.labels[0] && dependencyField.labels[0].innerText) ||
875                        dependencyField.name;
876                    return hyva.strf('This\u0020field\u0020value\u0020must\u0020be\u0020the\u0020same\u0020as\u0020\u0022\u00250\u0022.', dependencyFieldName);
877                }
878                return true;
879            },
880            dateformat(value, options, field, context) {
881                if ('' === value || null === value) {
882                    return true;
883                }
884
885                const regex = /^\d{2}\/\d{2}\/\d{4}$/;
886
887                if (value.match(regex) === null) {
888                    return 'Veuillez\u0020saisir\u0020une\u0020date\u0020valide.';
889                }
890
891                const [day, month, year] = value.split('/');
892                const isoFormattedStr = `${year}-${month}-${day}`;
893
894                const date = new Date(isoFormattedStr);
895
896                const timestamp = date.getTime();
897
898                if (typeof timestamp !== 'number' || Number.isNaN(timestamp)) {
899                    return 'Veuillez\u0020saisir\u0020une\u0020date\u0020valide.';
900                }
901
902                return true;
903            },
904            rated(value, options, field, context) {
905                const el = field.element.type === 'hidden' ? createTextInputFrom(field.element) : field.element,
906                    msg = 'Ce\u0020champ\u0020est\u0020obligatoire.';
907
908                if (el.type === 'checkbox') {
909
910                    return !el.value || el.value === "0" || !el.checked ? msg : true;
911                }
912
913                el.setAttribute('required', '');
914                el.checkValidity();
915
916                return el.validity.valueMissing ? msg : true;
917            },
918            isDateBetween(value, options, field, context) {
919                if ('' === value || null === value) {
920                    return true;
921                }
922
923                const regex = /^\d{2}\/\d{2}\/\d{4}$/;
924
925                if (value.match(regex) === null) {
926                    return 'Veuillez\u0020saisir\u0020une\u0020date\u0020valide.';
927                }
928
929                const [day, month, year] = value.split('/');
930                const isoFormattedStr = `${year}-${month}-${day}`;
931
932                const input = new Date(isoFormattedStr);
933                const min = new Date(options['min']);
934                const max = new Date(options['max']);
935
936                if (isNaN(input.getTime()) || isNaN(min.getTime()) || isNaN(max.getTime())) {
937                    return false;
938                }
939
940                if (input >= min && input <= max) {
941                    return options['message'];
942                }
943
944                return true;
945            }
946        };
947
948                function raceSome(promises, pred) {
949            return new Promise((resolve, reject) => {
950
951                if (promises.length === 0) {
952                    return resolve();
953                }
954
955                let settled = false, nDone = 0;
956
957                const resolveIf = v => {
958                    if (!settled && (pred(v) || ++nDone === promises.length)) {
959                        settled = true;
960                        resolve(v);
961                    }
962                    return v;
963                }
964
965                promises.map(promise => {
966                    promise.then(resolveIf).catch(reason => {
967                        settled = true;
968                        reject(reason)
969                    });
970                    return promise;
971                });
972            });
973        }
974
975        const INPUT_ATTRIBUTE_RULES = {min: 'min', max: 'max', required: 'required', minlength: 'minlength', maxlength: 'maxlength', step: 'step', pattern: 'pattern'}
976        const INPUT_TYPE_RULES = {email: 'email'}
977
978        function getRules(element) {
979            let rules = {};
980            Object.keys(INPUT_ATTRIBUTE_RULES).forEach(attrName => {
981                if (element.hasAttribute(attrName)) {
982                    rules[INPUT_ATTRIBUTE_RULES[attrName]] = element.getAttribute(attrName);
983                }
984            })
985            if (INPUT_TYPE_RULES[element.type]) {
986                rules[INPUT_TYPE_RULES[element.type]] = true;
987            }
988
989            if (element.dataset.validate) {
990                try {
991                    Object.assign(rules, JSON.parse(element.dataset.validate));
992                } catch (error) {
993                    console.error('Validator error. Cannot parse data-validate attribute of element:\n', element);
994                }
995            }
996
997            return rules;
998        }
999
1000        function isInvalidRuleResult(ruleState) {
1001            return typeof ruleState === 'string' || !ruleState || (ruleState.type && ruleState.content);
1002        }
1003
1004        async function runValidateFn(rule, options, value, field) {
1005            return formValidationRules[rule](value, options, field, this);
1006        }
1007
1008        function generateId() {
1009            let id;
1010            do {
1011                id = `${this.idPrefix}-${++this.idSeq}`;
1012            } while (document.getElementById(id));
1013            return id;
1014        }
1015
1016        function isVisible(element) {
1017            const el = element.type !== 'hidden' ? element : (element.parentElement || {});
1018            return !!(el.offsetWidth || el.offsetHeight || el.getClientRects().length)
1019        }
1020
1021        function elementWillValidate(element) {
1022            return (element.willValidate || element.type === 'hidden')
1023                && element.tagName !== 'BUTTON'
1024                && element.disabled === false
1025                && !(element.tagName === 'INPUT' && element.type === 'submit')
1026                && (element.hasAttribute('data-validate-hidden') || isVisible(element))
1027        }
1028
1029        function createMessageContainer(el, fieldWrapperClassName) {
1030            if (! el.parentElement) {
1031                return;
1032            }
1033            const refocus = document.activeElement === el;
1034            const wrapper = document.createElement('div');
1035            wrapper.classList.add.apply(wrapper.classList, fieldWrapperClassName.split(' '));
1036            el.parentElement.insertBefore(wrapper, el);
1037            wrapper.appendChild(el);
1038            refocus && document.activeElement !== el && el.focus();
1039            return wrapper;
1040        }
1041
1042        function containerNotFound(selector, el) {
1043            const msg = `Cannot find message container element ${selector} of ${el.name}`;
1044            console.error(msg, el);
1045            throw msg;
1046        }
1047
1048        function createTextInputFrom(el) {
1049            const text = document.createElement('INPUT');
1050            text.type = 'text';
1051            text.value = el.value;
1052            return text;
1053        }
1054
1055        function classNamesToSelector(classNames) {
1056            return classNames.split(' ')
1057                .filter(className => className.length > 0)
1058                .map(className => `.${className}`)
1059                .join('')
1060        }
1061
1062        function hasMessagesWrapper(field, messagesWrapperClassName) {
1063            return this.getMessageContainer(field).querySelector(classNamesToSelector(messagesWrapperClassName));
1064        }
1065
1066        function getErrorIcon(field) {
1067            let classes = 'flex absolute top-10 right-3';
1068
1069            if (field.element.dataset.validationIconDisabled === 'true') {
1070                return;
1071            }
1072
1073            if (field.element.dataset.validationIconClasses) {
1074                classes = field.element.dataset.validationIconClasses
1075            }
1076
1077            const iconWrapper = document.createElement('div');
1078            iconWrapper.classList.add.apply(iconWrapper.classList, classes.split(' '));
1079            iconWrapper.innerHTML = "\u003Csvg\u0020xmlns\u003D\u0022http\u003A\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg\u0022\u0020viewBox\u003D\u00220\u00200\u0020512\u0020512\u0022\u0020class\u003D\u0022icon\u0020fill\u002Dred\u002D500\u0022\u0020width\u003D\u002216\u0022\u0020height\u003D\u002216\u0022\u0020aria\u002Dhidden\u003D\u0022true\u0022\u003E\u003C\u0021\u002D\u002D\u0021\u0020Font\u0020Awesome\u0020Pro\u00206.0.0\u0020by\u0020\u0040fontawesome\u0020\u002D\u0020https\u003A\u002F\u002Ffontawesome.com\u0020License\u0020\u002D\u0020https\u003A\u002F\u002Ffontawesome.com\u002Flicense\u0020\u0028Commercial\u0020License\u0029\u
10790020Copyright\u00202022\u0020Fonticons,\u0020Inc.\u0020\u002D\u002D\u003E\u003Cpath\u0020d\u003D\u0022M256\u00200C114.6\u00200\u00200\u0020114.6\u00200\u0020256s114.6\u0020256\u0020256\u0020256s256\u002D114.6\u0020256\u002D256S397.4\u00200\u0020256\u00200zM256\u0020464c\u002D114.7\u00200\u002D208\u002D93.31\u002D208\u002D208S141.3\u002048\u0020256\u002048s208\u002093.31\u0020208\u0020208S370.7\u0020464\u0020256\u0020464zM359.5\u0020133.7c\u002D10.11\u002D8.578\u002D25.28\u002D7.297\u002D33.83\u00202.828L256\u0020218.8L186.3\u0020136.5C177.8\u0020126.4\u0020162.6\u0020125.1\u0020152.5\u0020133.7C142.4\u0020142.2\u0020141.1\u0020157.4\u0020149.7\u0020167.5L224.6\u0020256l\u002D74.88\u002088.5c\u002D8.562\u002010.11\u002D7.297\u002025.27\u00202.828\u002033.83C157\u0020382.1\u0020162.5\u0020384\u0020167.1\u0020384c6.812\u00200\u002013.59\u002D2.891\u002018.34\u002D8.5L256\u0020293.2l69.67\u002082.34C330.4\u0020381.1\u0020337.2\u0020384\u0020344\u0020384c5.469\u00200\u002010.98\u002D1.859\u002015.48\u002D5.672c10.12\u002D8.562\u002011.39\u002D23.72\u00202.828\u002D33.83L287.4\u0020256l74.88\u002D88.5C370.9\u0020157.4\u0020369.6\u0020142.2\u0020359.5\u0020133.7z\u0022\u002F\u003E\u003C\u002Fsvg\u003E\u000A";
1080            iconWrapper.setAttribute('data-msg-field', field.element.name);
1081
1082            return iconWrapper;
1083        }
1084
1085        function getMessagesWrapper(field, messagesWrapperClassName) {
1086            if (hasMessagesWrapper.call(this, field, messagesWrapperClassName)) {
1087                return this.getMessageContainer(field).querySelector(classNamesToSelector(messagesWrapperClassName));
1088            }
1089
1090            const msgWrapper = document.createElement('ul');
1091            const msgId = generateId.call(this);
1092            msgWrapper.id = msgId;
1093            field.element.setAttribute('aria-errormessage', msgId);
1094            field.element.setAttribute('aria-describedby', msgId);
1095            msgWrapper.classList.add.apply(msgWrapper.classList, messagesWrapperClassName.split(' '));
1096
1097                        const icon = getErrorIcon.call(this, field)
1098            if (icon) {
1099                msgWrapper.appendChild(icon);
1100            }
1101            
1102            if (field.validateOnChange) {
1103                msgWrapper.setAttribute('aria-live', 'polite');
1104            }
1105            this.getMessageContainer(field).appendChild(msgWrapper);
1106
1107            return msgWrapper;
1108        }
1109
1110        function getCheckedValues(field) {
1111            const name = field.element.name.replace(/([\\"])/g, '\\$1');
1112            const elements = field.element.form.querySelectorAll('input[name="' + name + '"]:checked');
1113            return Array.from(elements).map(el => el.value);
1114        }
1115
1116        function escapeHtml(s) {
1117            const div = document.createElement('div')
1118            div.innerText = s;
1119            return div.innerHTML;
1120        }
1121
1122        
1123        function formValidation(formElement, options) {
1124            // Disable browser default validation
1125            if (formElement.tagName === 'FORM') {
1126                formElement.setAttribute('novalidate', '');
1127            } else {
1128                console.error('formValidation can be initialized only on FORM element', formElement);
1129                return;
1130            }
1131
1132            options = Object.assign({
1133                fieldWrapperClassName: 'field-reserved',
1134                messagesWrapperClassName: 'messages text-negative text-sm font-normal mt-1',
1135                validClassName: 'field-success',
1136                invalidClassName: 'field-error',
1137                pageMessagesWrapperSelector: null,
1138                scrollToFirstError: true,
1139                errorIcon: '',
1140            }, options || {});
1141
1142            return {
1143                state: {
1144                    valid: false,
1145                },
1146                fields: {},
1147                idSeq: 0,
1148                idPrefix: formElement.id || 'vld-msg',
1149                setupFields(elements) {
1150                    this.fields = {};
1151                    Array.from(elements).forEach(element => {
1152                        if (elementWillValidate(element)) {
1153                            this.setupField(element);
1154                        }
1155                    });
1156                },
1157                setupField(element) {
1158                    if (! element) return;
1159                    const onChange = !!element.dataset.onChange;
1160                    if (elementWillValidate(element)) {
1161                        const rules = getRules(element);
1162                        if (Object.keys(rules).length > 0) {
1163                            if (this.fields[element.name]) {
1164                                Object.assign(this.fields[element.name].rules, rules);
1165                            } else {
1166                                this.fields[element.name] = {
1167                                    element,
1168                                    rules: rules,
1169                                    validateOnChange: onChange,
1170                                    state: {
1171                                        valid: null,
1172                                        rules: {}
1173                                    }
1174                                }
1175                            }
1176                        }
1177                    } else {
1178                        console.error('Element will not validate', element);
1179                    }
1180                },
1181                onSubmit(event) {
1182                    if (event.target.tagName === 'FORM') {
1183                        event.preventDefault();
1184
1185                        this.validate()
1186                            .then(() => event.target.submit())
1187                            .catch(invalidElements => {});
1188                    }
1189                },
1190                onChange(event) {
1191                    event.target.dataset.onChange = 'true';
1192                    if (!Object.keys(this.fields).length) {
1193                        this.setupFields(formElement.elements);
1194                    }
1195                    if (!Object.keys(this.fields).includes(event.target.name)) {
1196                        this.setupField(event.target);
1197                    }
1198                    const field = this.fields[event.target.name];
1199
1200                    this.validateField(field);
1201                    field && field.element.removeAttribute('data-on-change')
1202                },
1203                validateSafe() {
1204                    return new Promise(resolve => this.validate().then(() => resolve(true)).catch(() => {}))
1205                },
1206                validate() {
1207                    if (!Object.keys(this.fields).length || !Object.keys(this.fields).length !== formElement.elements.length) {
1208                        this.setupFields(formElement.elements);
1209                    }
1210                    return new Promise(async (resolve, reject) => {
1211                        if (formElement.elements) {
1212                                                        await raceSome(this.validateFields(), result => result !== true)
1213                            const invalidFields = Object.values(this.fields).filter(field => !field.state.valid);
1214                            this.state.valid = invalidFields.length === 0;
1215                            if (this.state.valid) {
1216                                resolve();
1217                            } else {
1218                                if (options.scrollToFirstError && invalidFields.length > 0) {
1219                                    invalidFields[0].element.focus()
1220                                    invalidFields[0].element.select && invalidFields[0].element.select();
1221                                }
1222                                reject(invalidFields.map(field => field.element));
1223                            }
1224                        }
1225                    });
1226                },
1227                                validateFields() {
1228                    const fields = Object.values(this.fields);
1229
1230                                        fields.forEach(field => {
1231                        this.getMessageContainer(field).classList.remove(options.validClassName, options.invalidClassName)
1232                    });
1233                                        return fields.map(field => this.validateField(field))
1234                },
1235                                validateField(field) {
1236                                        if (! field || ! elementWillValidate(field.element)) {
1237                        return new Promise(resolve => resolve(true))
1238                    }
1239
1240                    let value;
1241                    if (field.element.type === 'checkbox') {
1242                        value = getCheckedValues(field);
1243                    } else if (field.element.type === 'radio') {
1244                        value = getCheckedValues(field)[0] || undefined;
1245                    } else if (field.element.tagName === 'SELECT' && field.element.multiple) {
1246                        value = Array.from(field.element.selectedOptions).map(opt => opt.value);
1247                    } else {
1248                        value = field.element.value;
1249                    }
1250
1251                    const rules = field.rules || {};
1252
1253                                        field.state.valid = true;
1254                    this.showFieldState(field);
1255
1256                                        if (!elementWillValidate(field.element)) {
1257                        return new Promise(resolve => resolve(true));
1258                    }
1259
1260                
1261                                        const fieldValidations = Object.keys(rules).filter(rule => formValidationRules[rule]).map(async rule => {
1262                        return runValidateFn.call(this, rule, rules[rule], value, field).then(result => {
1263                            field.state.rules[rule] = result;
1264                            return result;
1265                        })
1266                    });
1267
1268                    return new Promise(resolve => {
1269                                                Promise.all(fieldValidations).then(results => {
1270                                                                                    field.state.valid = !elementWillValidate(field.element) || rules.length === 0 || !results.some(isInvalidRuleResult)
1271                            this.showFieldState(field);
1272                            resolve(field.state.valid);
1273                        })
1274                    });
1275                },
1276                getField(event){
1277                    if (!Object.keys(this.fields).length) {
1278                        this.setupFields(formElement.elements);
1279                    }
1280                    if (!Object.keys(this.fields).includes(event.target.name)) {
1281                        this.setupField(event.target);
1282                    }
1283                    return this.fields[event.target.name];
1284                },
1285                getMessagesByField(field) {
1286                    const messages = [];
1287                    const invalidRules = Object.keys(field.state.rules).filter(rule => isInvalidRuleResult(field.state.rules[rule]));
1288
1289                    field.rules && Object.keys(field.rules).forEach((rule) => {
1290                        if (invalidRules.includes(rule)) {
1291                            const customMessage = field.element.getAttribute('data-msg-' + rule);
1292                            const message = customMessage ? customMessage : field.state.rules[rule];
1293                            const ruleOptions = JSON.parse(JSON.stringify(field.rules[rule]));
1294
1295                            if (typeof message === 'undefined' || message === null || (typeof message !== 'string' && ! message.type)) {
1296                                messages.push(hyva.strf('Validation rule "%0" failed.', rule));
1297                            } else if (Array.isArray(ruleOptions)) {
1298                                ruleOptions.unshift(message.type ? message.content : message);
1299                                const content = hyva.strf.apply(null, ruleOptions);
1300                                messages.push(message.type ? {type: message.type, content} : content);
1301                            } else {
1302                                const content = hyva.strf(message.type ? message.content : message, ruleOptions)
1303                                messages.push(message.type ? {type: message.type, content} : content);
1304                            }
1305                        }
1306                    });
1307                    return messages;
1308                },
1309                /** @deprecated */
1310                getFieldWrapper(field) {
1311                                        return this.getMessageContainer(field)
1312                },
1313                getMessageContainer(field) {
1314                    let container;
1315                    const pageSelector = field.element.getAttribute('data-validation-container') || options.pageMessagesContainerSelector;
1316                    if (pageSelector) {
1317                        container = document.querySelector(pageSelector)
1318                            || containerNotFound(pageSelector, field.element)
1319                    } else {
1320                        const containerSelector = classNamesToSelector(options.fieldWrapperClassName);
1321                        container = field.element.closest(containerSelector)
1322                            || createMessageContainer(field.element, options.fieldWrapperClassName)
1323                            || containerNotFound(containerSelector, field.element);
1324                    }
1325
1326                    return container;
1327                },
1328                showFieldState(field) {
1329                    const container = this.getMessageContainer(field),
1330                        hasErrorMessages = hasMessagesWrapper.call(this, field, options.messagesWrapperClassName),
1331                        messages = this.getMessagesByField(field).map(m => {
1332                            return m.type !== 'html' ? escapeHtml(m.type ? m.content : m) : m.content;
1333                        });
1334                    container.classList.toggle(options.validClassName, field.state.valid && ! hasErrorMessages);
1335                    container.classList.toggle(options.invalidClassName, !field.state.valid || hasErrorMessages);
1336                    this.createHtmlErrorMessage(field, messages);
1337
1338                    if (field.state.valid) {
1339                        field.element.removeAttribute('aria-invalid');
1340                    } else {
1341                        field.element.setAttribute('aria-invalid', 'true');
1342                        if (! document.activeElement) {
1343                            field.element.focus();
1344                        }
1345                    }
1346                },
1347                removeMessages(field, messagesClass) {
1348                    if (! hasMessagesWrapper.call(this, field, messagesClass || options.messagesWrapperClassName)) {
1349                        return;
1350                    }
1351
1352                    const msgWrapper = getMessagesWrapper.call(this, field, messagesClass || options.messagesWrapperClassName);
1353                    const messages = msgWrapper.querySelectorAll(`[data-msg-field='${field.element.name}']`);
1354                    Array.from(messages).forEach(msg => msg.remove());
1355                    if (msgWrapper && msgWrapper.childElementCount === 0) {
1356                        field.element.removeAttribute('aria-errormessage');
1357                        field.element.removeAttribute('aria-describedby');
1358                        msgWrapper.remove();
1359                    }
1360                },
1361                createErrorMessage(field, messages) {
1362                    const htmlMessages = (Array.isArray(messages) ? messages : [messages]).map(escapeHtml)
1363                    this.createHtmlErrorMessage(field, htmlMessages);
1364                },
1365                createHtmlErrorMessage(field, messages) {
1366                    this.removeMessages(field, options.messagesWrapperClassName);
1367                    field.element.removeAttribute('aria-errormessage');
1368                    field.element.removeAttribute('aria-describedby');
1369
1370                    if (!field.state.valid) {
1371                        const msgWrapper = this.addHtmlMessages(field, options.messagesWrapperClassName, messages);
1372                        field.element.setAttribute('aria-errormessage', msgWrapper.id);
1373                        field.element.setAttribute('aria-describedby', msgWrapper.id);
1374                    }
1375                },
1376                /** @deprecated */
1377                createMessage(field, message) {
1378                                        return this.addMessages(field, options.messagesWrapperClassName, message);
1379                },
1380                addMessages(field, messagesClass, messages) {
1381                    const htmlMessages = (Array.isArray(messages) ? messages : [messages]).map(escapeHtml)
1382                    return this.addHtmlMessages(field, messagesClass, htmlMessages);
1383                },
1384                addHtmlMessages(field, messagesClass, htmlMessages) {
1385                    const msgWrapper = getMessagesWrapper.call(this, field, messagesClass);
1386
1387                    (Array.isArray(htmlMessages) ? htmlMessages : [htmlMessages]).forEach((htmlMessage) => {
1388                        const li = document.createElement('li');
1389                        li.innerHTML = htmlMessage;
1390                        li.setAttribute('data-msg-field', field.element.name);
1391                        msgWrapper.appendChild(li);
1392                    });
1393
1394                    return msgWrapper;
1395                },
1396                setField(name, value) {
1397                    this.fields[name].element.value = value;
1398                    this.fields[name].element.dispatchEvent((new Event('input')));
1399                    this.validateField(this.fields[name]);
1400                },
1401            }
1402        }
1403
1404        hyva.formValidation = formValidation;
1405        hyva.formValidation.rules = formValidationRules;
1406        hyva.formValidation.setInputAttributeRuleName = (attrName, ruleName) => INPUT_ATTRIBUTE_RULES[attrName] = ruleName || attrName;
1407        hyva.formValidation.setInputTypeRuleName = (typeName, ruleName) => INPUT_TYPE_RULES[typeName] = ruleName || typeName;
1408        hyva.formValidation.addRule = (name, validator) => formValidationRules[name] = validator;
1409    }(window.hyva = window.hyva || {}));
1410</script>
1410
1411
1412<div class="page-wrapper"><div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><section
1413    x-data="initBanner()"
1414    x-show="show"
1415    x-cloak
1416    class="container-fluid w-full bg-primary text-white text-center p-4 relative"
1417>
1418    <div class="justify-center flex gap-2 md:gap-4 text-base text-h3 flex-wrap mx-6">
1419        <h3><a href="https://www.aveve.be/fr/faq/livraison#combien-dois-je-payer-pour-les-frais-d-expedition">Nouveau : commandé avant 12 h, livré le jour ouvrable suivant !*
1420</a></h3>
1421    </div>
1422    <i class="absolute right-3 top-1/2 -translate-y-1/2" @click="closeBanner()">
1423        <svg xmlns="http://www.w3.org/2000/svg" class="fill-white" @click="closeBanner()"
1424             viewBox="0 0 320 512"
1425             width="24"
1426             height="24">
1427            <path
1428                d="M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z"></path>
1429        </svg>
1430    </i>
1431</section>
1432<script>
1433    function initBanner() {
1434        return {
1435            show: !hyva.getCookie('banner-closed'),
1436            closeBanner() {
1437                hyva.setCookie('banner-closed', true);
1438                this.show = false;
1439            },
1440        }
1441    }
1442</script>
1442</div><style>.cmsb28-relative {
1443position: relative
1444}
1445.cmsb28-z-30 {
1446z-index: 30
1447}
1448.cmsb28-col-span-full {
1449grid-column: 1 / -1
1450}
1451.cmsb28-row-span-full {
1452grid-row: 1 / -1
1453}
1454.cmsb28-flex {
1455display: flex
1456}
1457.cmsb28-inline-grid {
1458display: inline-grid
1459}
1460.cmsb28-w-full {
1461width: 100%
1462}
1463.cmsb28-max-w-\[calc\(1472px_\+_56px\)\] {
1464max-width: calc(1472px + 56px)
1465}
1466.cmsb28-grid-cols-1 {
1467grid-template-columns: repeat(1, minmax(0, 1fr))
1468}
1469.cmsb28-grid-rows-1 {
1470grid-template-rows: repeat(1, minmax(0, 1fr))
1471}
1472.cmsb28-items-center {
1473align-items: center
1474}
1475.cmsb28-justify-center {
1476justify-content: center
1477}
1478.cmsb28-gap-2 {
1479gap: 0.5rem
1480}
1481.cmsb28-gap-40 {
1482gap: 10rem
1483}
1484.cmsb28-overflow-hidden {
1485overflow: hidden
1486}
1487.cmsb28-p-1 {
1488padding: 0.25rem
1489}
1490.cmsb28-py-\[5px\] {
1491padding-top: 5px;
1492padding-bottom: 5px
1493}
1494.cmsb28-text-center {
1495text-align: center
1496}
1497.cmsb28-underline {
1498text-decoration-line: underline
1499}
1500.cmsb28-delay-\[-10000ms\] {
1501transition-delay: -10000ms
1502}
1503.cmsb28-delay-\[-15000ms\] {
1504transition-delay: -15000ms
1505}
1506.cmsb28-delay-\[-5000ms\] {
1507transition-delay: -5000ms
1508}
1509.cmsb28-delay-\[0ms\] {
1510transition-delay: 0ms
1511}
1512@media (min-width: 768px) {
1513.cmsb28-md\:mx-auto {
1514margin-left: auto;
1515margin-right: auto
1516}
1517.cmsb28-md\:text-sm {
1518font-size: 0.875rem;
1519line-height: 1.25rem
1520}
1521}
1522@media (min-width: 1024px) {
1523.cmsb28-lg\:mx-14 {
1524margin-left: 3.5rem;
1525margin-right: 3.5rem
1526}
1527.cmsb28-lg\:flex {
1528display: flex
1529}
1530.cmsb28-lg\:w-auto {
1531width: auto
1532}
1533.cmsb28-lg\:animate-none {
1534animation: none
1535}
1536.cmsb28-lg\:justify-between {
1537justify-content: space-between
1538}
1539.cmsb28-lg\:gap-6 {
1540gap: 1.5rem
1541}
1542.cmsb28-lg\:text-left {
1543text-align: left
1544}
1545}</style>
1546<div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><div class="bg-primary-alt1 cmsb28-w-full">
1547  <div class="cmsb28-relative cmsb28-z-30 cmsb28-w-full cmsb28-max-w-[calc(1472px_+_56px)] cmsb28-md:mx-auto text-secondary-alt1 cmsb28-py-[5px] cmsb28-text-center">
1548    <div class="cmsb28-relative cmsb28-inline-grid cmsb28-w-full cmsb28-lg:w-auto cmsb28-grid-cols-1 cmsb28-grid-rows-1 cmsb28-gap-40 cmsb28-overflow-hidden cmsb28-text-center cmsb28-lg:flex cmsb28-lg:gap-6 cmsb28-lg:text-left cmsb28-lg:mx-14 cmsb28-lg:justify-between">
1549      <span class="cmsb28-md:text-sm animate-word fill-secondary-alt1 cmsb28-col-span-full cmsb28-row-span-full cmsb28-flex cmsb28-items-center cmsb28-justify-center cmsb28-gap-2 cmsb28-p-1 cmsb28-delay-[0ms] cmsb28-lg:w-auto cmsb28-lg:animate-none" style="--delay: 0s;">
1550        <svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 512 512">
1551          <!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
1552          <path d="M464 256A208 208 0 1 1 48 256a208 208 0 1 1 416 0zM0 256a256 256 0 1 0 512 0A256 256 0 1 0 0 256zM232 120V256c0 8 4 15.5 10.7 20l96 64c11 7.4 25.9 4.4 33.3-6.7s4.4-25.9-6.7-33.3L280 243.2V120c0-13.3-10.7-24-24-24s-24 10.7-24 24z" />
1553        </svg>
1554        <a href="https://www.aveve.be/fr/faq/livraison#quels-sont-les-frais-denvoi" class="cmsb28-underline">Commandé avant 12 h, livré le jour ouvrable suivant*</a>
1555      </span>
1556      <span class="cmsb28-md:text-sm animate-word fill-secondary-alt1 cmsb28-col-span-full cmsb28-row-span-full cmsb28-flex cmsb28-items-center cmsb28-justify-center cmsb28-gap-2 cmsb28-p-1 cmsb28-delay-[-5000ms] cmsb28-lg:w-auto cmsb28-lg:animate-none" style="--delay: -5s;">
1557        <svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 640 512">
1558          <!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
1559          <path d="M48 0C21.5 0 0 21.5 0 48V368c0 26.5 21.5 48 48 48H64c0 53 43 96 96 96s96-43 96-96H384c0 53 43 96 96 96s96-43 96-96h32c17.7 0 32-14.3 32-32s-14.3-32-32-32V288 256 237.3c0-17-6.7-33.3-18.7-45.3L512 114.7c-12-12-28.3-18.7-45.3-18.7H416V48c0-26.5-21.5-48-48-48H48zM416 160h50.7L544 237.3V256H416V160zM112 416a48 48 0 1 1 96 0 48 48 0 1 1 -96 0zm368-48a48 48 0 1 1 0 96 48 48 0 1 1 0-96z" />
1560        </svg>
1561        <a href="https://www.aveve.be/fr/faq/livraison#quels-sont-les-frais-denvoi" class="cmsb28-underline">Livraison gratuite à partir de 49 € (jusqu'à 59 kg)*</a>
1562      </span>
1563      <span class="cmsb28-md:text-sm animate-word fill-secondary-alt1 cmsb28-col-span-full cmsb28-row-span-full cmsb28-flex cmsb28-items-center cmsb28-justify-center cmsb28-gap-2 cmsb28-p-1 cmsb28-delay-[-10000ms] cmsb28-lg:w-auto cmsb28-lg:animate-none" style="--delay: -10s;">
1564        <svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 512 512">
1565          <!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
1566          <path d="M463.5 224H472c13.3 0 24-10.7 24-24V72c0-9.7-5.8-18.5-14.8-22.2s-19.3-1.7-26.2 5.2L413.4 96.6c-87.6-86.5-228.7-86.2-315.8 1c-87.5 87.5-87.5 229.3 0 316.8s229.3 87.5 316.8 0c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0c-62.5 62.5-163.8 62.5-226.3 0s-62.5-163.8 0-226.3c62.2-62.2 162.7-62.5 225.3-1L327 183c-6.9 6.9-8.9 17.2-5.2 26.2s12.5 14.8 22.2 14.8H463.5z" />
1567        </svg>
1568        <a href="https://www.aveve.be/fr/faq/retour/" class="cmsb28-underline">Retours gratuits</a>
1569      </span>
1570      <span class="cmsb28-md:text-sm animate-word fill-secondary-alt1 cmsb28-col-span-full cmsb28-row-span-full cmsb28-flex cmsb28-items-center cmsb28-justify-center cmsb28-gap-2 cmsb28-p-1 cmsb28-delay-[-15000ms] cmsb28-lg:w-auto cmsb28-lg:animate-none" style="--delay: -15s;">
1571        <svg xmlns="http://www.w3.org/2000/svg" height="18" width="18" viewBox="0 0 576 512">
1572          <!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.-->
1573          <path d="M547.6 103.8L490.3 13.1C485.2 5 476.1 0 466.4 0H109.6C99.9 0 90.8 5 85.7 13.1L28.3 103.8c-29.6 46.8-3.4 111.9 51.9 119.4c4 .5 8.1 .8 12.1 .8c26.1 0 49.3-11.4 65.2-29c15.9 17.6 39.1 29 65.2 29c26.1 0 49.3-11.4 65.2-29c15.9 17.6 39.1 29 65.2 29c26.2 0 49.3-11.4 65.2-29c16 17.6 39.1 29 65.2 29c4.1 0 8.1-.3 12.1-.8c55.5-7.4 81.8-72.5 52.1-119.4zM499.7 254.9l-.1 0c-5.3 .7-10.7 1.1-16.2 1.1c-12.4 0-24.3-1.9-35.4-5.3V384H128V250.6c-11.2 3.5-23.2 5.4-35.6 5.4c-5.5 0-11-.4-16.3-1.1l-.1 0c-4.1-.6-8.1-1.3-12-2.3V384v64c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V384 252.6c-4 1-8 1.8-12.3 2.3z" />
1574        </svg>
1575        Retrait dans > 200 magasins
1576      </span>
1577    </div>
1578  </div>
1579</div></div><header class="page-header"><a class="action skip sr-only focus:not-sr-only focus:absolute focus:z-40 focu
1579s:bg-white
1580   contentarea"
1581   href="#contentarea">
1582    <span>
1583        Skip to Content    </span>
1584</a>
1585<script>
1586    function initHeader () {
1587        return {
1588            isMobile: false,
1589            searchOpen: false,
1590            cart: {},
1591            getData(data) {
1592                if (data.cart) { this.cart = data.cart }
1593            },
1594            checkIsMobileResolution: function () {
1595                this.isMobile = window.outerWidth < 1024
1596            },
1597            openSearch(value) {
1598                if (this.isMobile) {
1599                    window.dispatchEvent(new CustomEvent('open-search-mobile-modal', {detail: {
1600                        isMobile: value,
1601                    }}));
1602                    this.searchOpen = value;
1603                }
1604            }
1605        }
1606    }
1607</script>
1607
1608
1609<!-- Nav Items -->
1610<div x-data="initHeader()"
1611     class="border-b border-gray border-opacity-20"
1612     @keydown.window.escape="openSearch(false)"
1613     x-init="checkIsMobileResolution()"
1614     @resize.window.debounce="checkIsMobileResolution()"
1615     @visibilitychange.window.debounce="checkIsMobileResolution()"
1616     @close-search-desktop-modal.window="searchOpen = false"
1617>
1618    <div id="header"
1619         class="z-30 w-full max-w-[calc(1472px_+_56px)] mx-auto relative"
1620         @private-content-loaded.window="getData(event.detail.data)"
1621    >
1622        <div class="flex items-center flex-wrap justify-center lg:justify-between items-center py-4 lg:pb-0 px-4 lg:px-0 lg:mx-14 items-center">
1623
1624            <!--Logo-->
1625            <div class="w-1/3 lg:w-auto order-2 lg:align-left lg:order-none">
1626                <div class="lg:w-fit">
1627                    <div class="w-full flex justify-center">
1628            <a class="no-underline hover:no-underline w-[105px]"
1629           href="https://www.aveve.be/fr/"
1630           title="Aveve"
1631           aria-label="Logo Aveve">
1632            <img src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/images/logo.svg"
1633                 title="Aveve"
1634                 alt="Aveve"
1635                 width="105"
1636                 height="62"
1637                 class="h-auto w-full max-w-[70px] lg:max-w-[105px] m-auto"
1638            />
1639            <span class="sr-only">Aveve</span>
1640        </a>
1641    </div>
1642                </div>
1643            </div>
1644            <!--Search-->
1645            <div class="hidden z-30 w-1/3 lg:w-auto flex grow order-3 lg:mx-6 lg:order-none"
1646                 id="search-content-container"
1647                 :class="{ 'lg:block': searchOpen, 'hidden lg:block': !searchOpen }"
1648            >
1649                
1650<script>
1651    function initMiniSearchComponent() {
1652        "use strict";
1653
1654        return {
1655            getTitleUrl(title) {
1656                switch (title) {
1657                    case 'Assortiment':
1658                    case 'Gamme': return 'https://www.aveve.be/fr/catalogsearch/result/?q=';
1659                    case 'Inspiratie':
1660                    case 'Inspiration': return 'https://www.aveve.be/fr/arvesta_search/result/?q=';
1661                    default: return null;
1662                }
1663            },
1664            translations: {
1665                getDifficultyTranslation(difficulty) {
1666                    switch (difficulty){
1667                        case 'Easy':
1668                            return 'Facile';
1669                        case 'Medium':
1670                            return 'Moyen';
1671                        case 'Hard':
1672                            return 'Difficile';
1673                        default:
1674                            return difficulty;
1675                    }
1676                },
1677                getTypeTranslation(type) {
1678                    switch (type){
1679                        case 'basic_page':
1680                            return 'Article';
1681                        case 'workshop':
1682                            return 'Atelier';
1683                        case 'demo':
1684                            return 'Démo';
1685                        case 'recipe':
1686                            return 'Recette';
1687                        case 'store':
1688                            return 'Magasin';
1689                        default:
1690                            return type;
1691                    }
1692                },
1693            },
1694            isMobile: false,
1695            show:true,
1696            formSelector: "#search_mini_form",
1697            url: "https://www.aveve.be/fr/search/ajax/suggest/",
1698            destinationSelector: "#search_autocomplete",
1699            templates: {"content":{"title":"Inspiration","template":"Arvesta_Search::autocomplete\/content.phtml"},"term":{"title":"Search terms","template":"Hyva_SmileElasticsuite::core\/autocomplete\/term.phtml"},"product":{"title":"Gamme","template":"Hyva_SmileElasticsuite::catalog\/autocomplete\/product.phtml"},"category":{"title":"Cat\u00e9gories","template":"Hyva_SmileElasticsuite::catalog\/autocomplete\/category.phtml"},"product_attribute":{"title":"Attributes","template":"Hyva_SmileElasticsuite::catalog\/autocomplete\/product_attribute.phtml","titleRenderer":"renderEsAutocompleteTitleAttribute"},"cms_page":{"title":"Cms page","template":"Hyva_SmileElasticsuite::cms-search\/autocomplete\/cms.phtml"}},
1700            priceFormat: {"pattern":"\u20ac%s","precision":2,"requiredPrecision":2,"decimalSymbol":",","groupSymbol":"\u202f","groupLength":3,"integerRequired":false},
1701            minSearchLength: 2,
1702            searchResultsByType: {},
1703            searchResultsCountByType: {},
1704            currentRequest: null,
1705            updateIsShow(value) {
1706                this.show = value;
1707            },
1708            checkIsMobileResolution: function () {
1709                this.isMobile = window.outerWidth < 1024
1710            },
1711            close() {
1712                this.show = false;
1713                window.dispatchEvent(new CustomEvent('close-search-desktop-modal', {detail: {
1714                    show: false,
1715                }}));
1716            },
1717            getSearchResults: function () {
1718                this.searchResultsByType = {};
1719                let value = document.querySelector('#search').value.trim();
1720
1721                if (3 > value.length) {
1722                  return false;
1723               }
1724
1725                if (value.length < parseInt(this.minSearchLength, 10)) {
1726                    this.searchResultsByType = [];
1727
1728                    return false;
1729                }
1730
1731                let url = this.url + '?' + new URLSearchParams({
1732                    q: document.querySelector('#search').value,
1733                    _: Date.now()
1734                }).toString();
1735
1736                if (this.currentRequest !== null) {
1737                    this.currentRequest.abort();
1738                }
1739                this.currentRequest = new AbortController();
1740
1741                fetch(url, {
1742                    method: 'GET',
1743                    signal: this.currentRequest.signal,
1744                }).then((response) => {
1745                    if (response.ok) {
1746                        this.show = true;
1747                        return response.json();
1748                    }
1749                }).then((data) => {
1750                    if (!data.some(el => el.type === 'content')) {
1751                        data.push({type: "content"});
1752                    }
1753
1754                    if (!data.some(el => el.type === 'product')){
1755                         data.push({type: "product"});
1756                    }
1757
1758                    this.searchResultsByType = data
1759                        .filter((result) => (result.type !== "term" && result.type !== "count"))
1760                        .reduce((acc, result) => {
1761                            if (! acc[result.type]) acc[result.type] = [];
1762                            acc[result.type].push(result);
1763                            return acc;
1764                        }, {});
1765                    this.searchResultsCountByType = data
1766                        .sort((a, b) => b['type'] > a['type'] ? 1 : -1 )
1767                        .filter((result) => (result.type === "count"))
1768                        .reduce((acc, result) => {
1769                            acc[result.content_type] = result.value;
1770                            return acc;
1771                        }, {});
1772                }).catch((error) => {
1773                });
1774            },
1775            getCount: function (type) {
1776                return this.searchResultsCountByType[type] ?? 0;
1777            },
1778        }
1779    }
1780</script>
1780
1781
1782<div
1783    x-data="initMiniSearchComponent()"
1784    id="search-content"
1785    class="lg:max-w-[614px] lg:w-full mx-auto lg:mr-[max(2rem,_10%)]"
1786    x-show="true"
1787    @open-search-mobile-modal.window="updateIsShow($event.detail.isMobile)"
1788    x-init="checkIsMobileResolution()"
1789    @resize.window.debounce="checkIsMobileResolution()"
1790    @visibilitychange.window.debounce="checkIsMobileResolution()"
1791>
1792    <div @click.outside="close()">
1793        <div :class="show ? 'fixed lg:static w-full md:w-2/3 lg:w-full h-screen lg:h-auto right-0 top-0 flex lg:block flex-col bg-white lg:bg-transparent' : ''">
1794            <!-- top bar -->
1795            <div x-cloak x-show="show" class="lg:hidden h-16 border-[1px] border-gray/10 bg:white flex items-center justify-between z-50">
1796                <div class="ml-4 md:hidden max-w-[50px]">
1797                    <div class="w-full flex justify-center">
1798            <a class="no-underline hover:no-underline w-[105px]"
1799           href="https://www.aveve.be/fr/"
1800           title="Aveve"
1801           aria-label="Logo Aveve">
1802            <img src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/images/logo.svg"
1803                 title="Aveve"
1804                 alt="Aveve"
1805                 width="105"
1806                 height="62"
1807                 class="h-auto w-full max-w-[70px] lg:max-w-[105px] m-auto"
1808            />
1809            <span class="sr-only">Aveve</span>
1810        </a>
1811    </div>
1812                </div>
1813                <h4 class="hidden md:block text-h4 ml-4">Recherche</h4>
1814                <div @click="close(); document.documentElement.classList.remove('disable-scroll');">
1815                    <i class="p-2">
1816                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon mr-4" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z"/></svg>
1817                    </i>
1818                </div>
1819            </div>
1820
1821            <!-- Gray zone -->
1822            <div x-cloak @click="close()" x-show="show" class="hidden md:block lg:hidden fixed w-1/3 h-screen left-0 top-0 bg-gray/[.5]"></div>
1823
1824            <!-- Form -->
1825            <form class="form minisearch p-4 md:p-6 lg:p-0 lg:flex lg:justify-end lg:w-full"
1826                  id="search_mini_form"
1827                  action="https://www.aveve.be/fr/catalogsearch/result/"
1828                  method="get">
1829                <label class="sr-only" for="search">
1830                    Recherche                </label>
1831                <div class="relative flex justify-end w-full lg:m-0 mb-6">
1832                    <button tabindex="-1" aria-label="Recherche" class="cursor-pointer absolute right-0 top-0 bg-secondary-alt1 lg:bg-transparent h-full w-12 flex justify-center items-center rounded-r-sm overflow-hidden">
1833                        <i>
1834                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon fill-white lg:fill-black" width="15" height="15" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M504.1 471l-134-134C399.1 301.5 415.1 256.8 415.1 208c0-114.9-93.13-208-208-208S-.0002 93.13-.0002 208S93.12 416 207.1 416c48.79 0 93.55-16.91 129-45.04l134 134C475.7 509.7 481.9 512 488 512s12.28-2.344 16.97-7.031C514.3 495.6 514.3 480.4 504.1 471zM48 208c0-88.22 71.78-160 160-160s160 71.78 160 160s-71.78 160-160 160S48 296.2 48 208z"/></svg>
1835                        </i>
1836                    </button>
1837                    <input id="search"
1838                           x-cloak
1839                           x-on:input.debounce="getSearchResults()"
1840                           x-ref="searchInput"
1841                           type="search"
1842                           x-show="!(isMobile && !show)"
1843                           class="form-text-input w-full font-semibold text-opacity-40 focus:text-opacity-100 text-sm leading-normal
1844                               transition-all appearance-none text-gray"
1845                           autocapitalize="off" autocomplete="off" autocorrect="off"
1846                           name="q"
1847                           value=""
1848                           placeholder="Recherche"
1849                           maxlength="128"
1850                    />
1851                </div>
1852
1853                <!-- results -->
1854                <div x-cloak id="search_autocomplete"
1855                     x-show="show && Object.values(searchResultsByType).length > 0"
1856                     class="search-autocomplete lg:absolute lg:w-full lg:top-[88px] z-30 lg:-left-1/2 lg:translate-x-1/2 flex">
1857                    <div class="bg-white lg:rounded-md lg:border-[1px] lg:border-gray/10 lg:w-10/12 mx-auto" @click.outside="close()">
1858                        <div class="lg:p-6 z-50 w-full grid grid-cols-1 lg:rounded-md bg-white"
1859                             :class="3 > Object.values(searchResultsByType).length ? 'lg:grid-cols-2 lg:gap-[72px]' : 'lg:grid-cols-3 lg:gap-14'">
1860                            <template x-for="searchResultByType in Object.values(searchResultsByType)">
1861                                <div class="mb-3">
1862                                    <template x-if="searchResultByType.hasOwnProperty(0) && templates[searchResultByType[0].type].title && templates[searchResultByType[0].type].titleRenderer === undefined">
1863                                        <div>
1864                                            <template x-if="getTitleUrl(templates[searchResultByType[0].type].title)" >
1865                                                <a :href="getTitleUrl(templates[searchResultByType[0].type].title) + $refs.searchInput.value"
1866                                                   :class="{'pointer-events-none': getCount(searchResultByType[0].type) === 0}"
1867                                                >
1868                                                    <div class="flex items-baseline gap-1">
1869                                                        <div class="font-semibold text-primary transition-all lg:text-black lg:text-h4 lg:hover:text-primary font-bold mb-3" x-text="templates[searchResultByType[0].type].title"></div>
1870                                                        <span class="text-sm text-gray">(<span class="text-gray" x-text="getCount(searchResultByType[0].type)"></span>)</span>
1871                                                    </div>
1872                                                </a>
1873                                            </template>
1874                                            <template x-if="!getTitleUrl(templates[searchResultByType[0].type].title)" >
1875                                                <div class="flex items-baseline gap-1">
1876                                                    <div class="font-semibold text-primary lg:text-black lg:text-h4 font-bold mb-3" x-text="templates[searchResultByType[0].type].title"></div>
1877                                                    <span class="text-sm text-gray">(<span class="text-gray" x-text="(Object.values(searchResultByType).length)"></span>)</span>
1878                                                </div>
1879                                            </template>
1880                                        </div>
1881                                    </template>
1882
1883                                    <div>
1884                                        <template x-for="(searchResult, index) in searchResultByType" :key="index">
1885                                            <div class="hover:bg-gray-100">
1886                                                <template x-if="searchResult['title']">
1887                                                    <div>
1888                                                                                                                    
1889<div>
1890    <template x-if="searchResult['type'] === 'content'">
1891        <a class="flex items-start pb-3 mb-3 text-sm w-full border-gray/[0.2]"
1892           :class="index+1 === searchResultByType.slice(0, 3).length ? '' : 'border-b'"
1893           :href="searchResult['url']">
1894            <template x-if="'store' !== searchResult['content_type']">
1895                <img class="w-14 h-14 mr-2 rounded-md object-cover" :src="searchResult['image'] + '?w=200&h=200&fm=jpg&fl=progressive&q=80'" :alt="searchResult['title']">
1896            </template>
1897            <div class="flex flex-col w-full items-start gap-1">
1898                <div class="w-full flex items-start lg:flex-wrap">
1899                    <span class="text-sm px-1 mr-2 rounded-sm bg-primary text-white" x-text="translations.getTypeTranslation(searchResult['content_type'])"></span>
1900                    <span class="font-semibold text-sm" x-text="searchResult['title']"></span>
1901                </div>
1902                <span class="text-sm line-clamp-1" x-text="searchResult['description']"></span>
1903                <div class="w-full flex items-center text-gray flex-wrap">
1904                    <div>
1905                        <template x-if="searchResult['start_date']">
1906                            <div class="text-gray flex items-center">
1907                                <i><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon mr-1 fill-gray" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M152 64H296V24C296 10.75 306.7 0 320 0C333.3 0 344 10.75 344 24V64H384C419.3 64 448 92.65 448 128V448C448 483.3 419.3 512 384 512H64C28.65 512 0 483.3 0 448V128C0 92.65 28.65 64 64 64H104V24C104 10.75 114.7 0 128 0C141.3 0 152 10.75 152 24V64zM48 448C48 456.8 55.16 464 64 464H384C392.8 464 400 456.8 400 448V192H48V448z"/></svg>
1908</i>
1909                                <span class="text-xs mr-3" x-text="searchResult['start_date']"></span>
1910                            </div>
1911                        </template>
1912                    </div>
1913                    <div>
1914                        <template x-if="searchResult['location'] && searchResult['location']['street'] && searchResult['location']['postcode'] && searchResult['location']['city']">
1915                            <div class="text-gray flex items-center">
1916                                <i><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" class="icon mr-1 fill-gray" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M272 192C272 236.2 236.2 272 192 272C147.8 272 112 236.2 112 192C112 147.8 147.8 112 192 112C236.2 112 272 147.8 272 192zM192 160C174.3 160 160 174.3 160 192C160 209.7 174.3 224 192 224C209.7 224 224 209.7 224 192C224 174.3 209.7 160 192 160zM384 192C384 279.4 267 435 215.7 499.2C203.4 514.5 180.6 514.5 168.3 499.2C116.1 435 0 279.4 0 192C0 85.96 85.96 0 192 0C298 0 384 85.96 384 192H384zM192 48C112.5 48 48 112.5 48 192C48 204.4 52.49 223.6 63.3 249.2C73.78 274 88.66 301.4 105.8 329.1C134.2 375.3 167.2 419.1 192 451.7C216.8 419.1 249.8 375.3 278.2 329.1C295.3 301.4 310.2 274 320.7 249.2C331.5 223.6 336 204.4 336 192C336 112.5 271.5 48 192 48V48z"/></svg>
1917</i>
1918                                <span class="text-xs"><span x-text="searchResult['location']['street']"></span>, <span x-text="searchResult['location']['postcode']"></span> <span x-text="searchResult['location']['city']"></span></span>
1919                            </div>
1920                        </template>
1921                    </div>
1922                    <template x-if="'recipe' === searchResult['content_type']">
1923                        <div class="flex flex-row">
1924                            <template x-if="searchResult['duration']">
1925                                <div class="text-gray flex items-center mr-3">
1926                                    <i><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon mr-1" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M280 248.7L339.1 338.7C347.3 349.7 344.3 364.6 333.3 371.1C322.3 379.3 307.4 376.3 300 365.3L236 269.3C233.4 265.4 232 260.7 232 256V120C232 106.7 242.7 96 256 96C269.3 96 280 106.7 280 120L280 248.7zM512 256C512 397.4 397.4 512 256 512C114.6 512 0 397.4 0 256C0 114.6 114.6 0 256 0C397.4 0 512 114.6 512 256zM256 48C141.1 48 48 141.1 48 256C48 370.9 141.1 464 256 464C370.9 464 464 370.9 464 256C464 141.1 370.9 48 256 48z"/></svg>
1927</i>
1928                                    <span class="text-sm" x-text="searchResult['duration']"></span>
1929                                </div>
1930                            </template>
1931                            <template x-if="searchResult['difficulty']">
1932                                <div class="text-gray flex items-center mr-3">
1933                                    <i><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon mr-1" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M448 71.3C448 71.53 448 71.77 448 72V488C448 494.4 445.5 500.5 440.1 504.1C436.5 509.5 430.4 512 424 512C417.6 512 411.5 509.5 407 504.1C402.5 500.5 400 494.4 400 488V352H351.2C342.8 352 334.4 350.3 326.6 347.1C318.9 343.8 311.8 339.1 305.8 333.1C299.9 327.1 295.2 320 291.1 312.2C288.8 304.4 287.2 296 287.2 287.6L288 173.8C287.1 136.9 299.1 100.8 319.7 70.28C340.4 39.71 369.8 16.04 404.1 2.336C407.9 .7942 411.9 .001 416 .0003C424.5 .0003 432.6 3.372 438.6 9.373C444.6 15.37 448 23.51 448 32V71.3zM400 58.08C380.4 70.33 364.2 87.39 352.1 107.6C341.8 127.9 335.9 150.7 336 173.8L335.2 288C335.2 292.2 336.9 296.3 339.9 299.3C342.9 302.3 346.1 304 351.2 304H399L400 58.08zM240.1 7.029C245.5 11.53 248 17.63 248 24V184C247.1 207.3 238.7 229.7 222.2 246.2C205.7 262.7 183.3 271.1 160 272H152V488C152 494.4 149.5 500.5 144.1 504.1C140.5 509.5 134.4 512 128 512C121.6 512 115.5 509.5 111 504.1C106.5 500.5 104 494.4 104 488V272H96C72.67 271.1 50.29 262.7 33.79 246.2C17.29 229.7 8.017 207.3 8 184V24C8 17.63 10.53 11.53 15.03 7.029C19.53 2.529 25.63 0 32 0C38.37 0 44.47 2.529 48.97 7.029C53.47 11.53 56 17.63 56 24V144H104V25.6C104 19.23 106.5 13.13 111 8.629C115.5 4.129 121.6 1.6 128 1.6C134.4 1.6 140.5 4.129 144.1 8.629C149.5 13.13 152 19.23 152 25.6V144H200V24C200 17.63 202.5 11.53 207 7.029C211.5 2.529 217.6 0 224 0C230.4 0 236.5 2.529 240.1 7.029zM184.9 214.9C191.9 209 196.7 200.1 198.4 192H57.6C59.32 200.1 64.08 209 71.08 214.9C78.08 220.7 86.89 223.9 96 224H160C169.1 223.9 177.9 220.7 184.9 214.9z"/></svg>
1934</i>
1935                                    <span class="text-sm"
1936                                          x-text="translations.getDifficultyTranslation(searchResult['difficulty'])"></span>
1937                                </div>
1938                            </template>
1939                            <template x-if="searchResult['qty_start']">
1940                                <div class="text-gray flex items-center">
1941                                    <i><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon mr-1" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M400 448c0 8.836-7.164 16-16 16H128c-8.836 0-16-7.164-16-16v-64H64v64c0 35.2 28.8 64 64 64h256c35.2 0 64-28.8 64-64v-64h-48V448zM416 32c-20.88 .125-41.13 7-57.75 19.75C334.9 20.5 297.1 0 256 0C213.1 0 177.1 20.5 153.8 51.75C136.7 38.68 116.2 31.1 95.62 31.99c-14.48 0-29.03 3.301-42.49 10.
194101C20.38 58.13-.125 91.5 0 128c0 41.75 64 224 64 224h384c0 0 64-182.3 64-224C512 75 469 32 416 32zM415.1 304h-41.88l25.69-141.3c1.594-8.719-4.383-16.87-13.09-18.46c-8.688-1.312-16.88 4.398-18.45 13.09L341.6 304H272V160c0-8.844-7.156-16-16-16S240 151.2 240 160v144H170.4L143.8 157.3C142.2 148.6 133.1 142.9 125.3 144.2C116.6 145.8 110.6 153.1 112.2 162.7L137.9 304H96.05C71.44 243.2 48.48 145.5 48 127.8C47.94 109.5 58.03 93.09 74.53 84.96C81.15 81.67 88.24 79.99 95.62 79.99c10.53 0 20.53 3.402 28.91 9.838l38.55 29.58L192.2 80.5C207.6 59.85 230.9 48 256 48c25.11 0 48.36 11.85 63.81 32.5l29.1 38.9l38.55-29.56C395.8 83.46 405.7 80.06 416 80c26.47 0 48 21.53 48 47.9C463.5 145.5 440.6 243.2 415.1 304z"/></svg>
1942</i>
1943                                    <span class="text-sm" x-text="searchResult['qty_start']"></span>
1944                                </div>
1945                            </template>
1946                        </div>
1947                    </template>
1948                </div>
1949            </div>
1950        </a>
1951    </template>
1952</div>
1953
1954
1955                                                                                                                    
1956<template x-if="searchResult.type == 'term'">
1957    <a class="w-full block p-2"
1958       x-bind:href="'https://www.aveve.be/fr/catalogsearch/result/?q=' + searchResult.title"
1959       :title="searchResult.title">
1960        <span class="text-sm" x-text="searchResult.title"></span>
1961        <span class="text-sm" x-text="'(' + searchResult.num_results + ')'"></span>
1962    </a>
1963</template>
1964                                                                                                                    
1965<div>
1966    <template x-if="searchResult['type'] === 'product'">
1967        <a class="flex pb-3 mb-3 text-sm w-full border-gray/[0.2] items-start"
1968           :class="index+1 === searchResultByType.slice(0, 3).length ? '' : 'border-b'"
1969           :href="searchResult.url">
1970            <img class="w-14 h-14 mr-2 object-contain aspect-square" :src="searchResult.image + '?w=200&h=200&fm=jpg&fl=progressive&q=80'" :alt="searchResult.title">
1971            <div class="flex flex-col w-full gap-1">
1972                <div class="flex justify-between">
1973                    <span class="text-sm" x-text="searchResult.product_brand"></span>
1974                    <span x-show="searchResult.has_active_offer && (searchResult.has_active_offer.toLowerCase() === 'ja' || searchResult.has_active_offer.toLowerCase() === 'oui')"
1975                          class="bg-promo rounded text-white px-1.5 py-px text-xs uppercase font-semibold">
1976                            promotion                    </span>
1977                </div>
1978                <span class="font-semibold text-sm" x-text="searchResult.title"></span>
1979                <div class="w-full flex items-center justify-between">
1980                    <span class="text-sm text-gray/[0.7]" x-text="searchResult.item_variant_type"></span>
1981                    <div class="text-sm font-normal product-item" x-html="searchResult.price"></div>
1982                </div>
1983            </div>
1984        </a>
1985    </template>
1986</div>
1987                                                                                                                    
1988<template x-if="searchResult['type'] === 'category'">
1989    <div class="flex items-center mb-1 text-sm">
1990        <a class="flex items-start gap-2" :href="searchResult['url']">
1991            <template x-for="breadcrumb in searchResult['breadcrumb']">
1992                <div class="flex gap-2 items-baseline">
1993                    <span x-text="breadcrumb"></span>
1994                    <i><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon fill-primary" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
1995</i>
1996                </div>
1997            </template>
1998            <span x-text="searchResult['title']" ></span>
1999        </a>
2000    </div>
2001</template>
2002                                                                                                                    
2003<template x-if="searchResult.type == 'product_attribute'">
2004    <a class="w-full block p-2" :href="searchResult.url" :title="searchResult.title">
2005        <span class="text-sm" x-text="searchResult.title"></span>
2006        <span class="text-xs uppercase text-gray-500" x-text="searchResult.attribute_label" style="vertical-align: super;"></span>
2007    </a>
2008</template>
2009
2010<script>
2011    function renderEsAutocompleteTitleAttribute(data)
2012    {
2013        data = data.filter(function(item) {
2014            return item.type === 'product_attribute';
2015        }).map(function(item) {
2016            return item['attribute_label']
2017        }).reduce(function(prev, item) {
2018            if (item in prev) {
2019                prev[item]++;
2020            } else {
2021                prev[item] = 1;
2022            }
2023            return prev;
2024        }, {});
2025
2026        data = Object.entries(data).sort(function(item1, item2) {
2027            return item2[1] - item1[1]
2028        }).map(function(item) {return item[0]});
2029
2030        if (data.length > 2) {
2031            data = data.slice(0, 2);
2032            data.push('...');
2033        }
2034
2035        return data.join(', ');
2036    }
2037</script>
2037
2038                                                                                                                    
2039<template x-if="searchResult.type == 'cms_page'">
2040    <a class="w-full block p-2" :href="searchResult.url" :title="searchResult.title">
2041        <span class="text-sm" x-text="searchResult.title"></span>
2042    </a>
2043</template>
2044                                                                                                            </div>
2045                                                </template>
2046                                                <template x-if="'product' === searchResult['type'] && !searchResult['title']">
2047                                                    <span>Aucun produit trouvé</span>
2048                                                </template>
2049                                                <template x-if="'content' === searchResult['type'] && !searchResult['title']">
2050                                                    <span>Aucun contenu trouvé</span>
2051                                                </template>
2052                                            </div>
2053                                        </template>
2054                                    </div>
2055
2056                                </div>
2057                            </template>
2058                        </div>
2059                                                <button class="btn btn-secondary w-full lg:w-1/3 mx-auto lg:mb-10"
2060                                @focusout="close()">
2061                            Afficher les résultats pour toutes les catégories                        </button>
2062                    </div>
2063                </div>
2064
2065            </form>
2066        </div>
2067    </div>
2068</div>
2069            </div>
2070            <!--buttons-->
2071            <div class="flex items-center gap-10 w-1/3 lg:w-auto justify-end order-4 lg:order-none">
2072                <a class="box-border text-sm font-normal link-navigation header-page-store-page-btn hidden lg:flex flex-col items-center gap-1"
2073                   href="https&#x3A;&#x2F;&#x2F;www.aveve.be&#x2F;fr&#x2F;magasins&#x2F;">
2074                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M272 192C272 236.2 236.2 272 192 272C147.8 272 112 236.2 112 192C112 147.8 147.8 112 192 112C236.2 112 272 147.8 272 192zM192 160C174.3 160 160 174.3 160 192C160 209.7 174.3 224 192 224C209.7 224 224 209.7 224 192C224 174.3 209.7 160 192 160zM384 192C384 279.4 267 435 215.7 499.2C203.4 514.5 180.6 514.5 168.3 499.2C116.1 435 0 279.4 0 192C0 85.96 85.96 0 192 0C298 0 384 85.96 384 192H384zM192 48C112.5 48 48 112.5 48 192C48 204.4 52.49 223.6 63.3 249.2C73.78 274 88.66 301.4 105.8 329.1C134.2 375.3 167.2 419.1 192 451.7C216.8 419.1 249.8 375.3 278.2 329.1C295.3 301.4 310.2 274 320.7 249.2C331.5 223.6 336 204.4 336 192C336 112.5 271.5 48 192 48V48z"/></svg>
2075                    Magasins                </a>
2076
2077                <div class="flex gap-5">
2078                    <!--Search Icon-->
2079                    <button id="menu-search-icon"
2080                            class="inline-block lg:hidden no-underline box-border lg:z-20
2081                                xl:absolute xl:right-5 xl:top-1/2 xl:-translate-y-1/2"
2082                            @click.prevent="openSearch(true);
2083                            $nextTick(function () { document.querySelector('#search').select();});
2084                            document.documentElement.classList.add('disable-scroll');"
2085                    >
2086                        <span class="sr-only label">
2087                            Recherche                        </span>
2088                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M504.1 471l-134-134C399.1 301.5 415.1 256.8 415.1 208c0-114.9-93.13-208-208-208S-.0002 93.13-.0002 208S93.12 416 207.1 416c48.79 0 93.55-16.91 129-45.04l134 134C475.7 509.7 481.9 512 488 512s12.28-2.344 16.97-7.031C514.3 495.6 514.3 480.4 504.1 471zM48 208c0-88.22 71.78-160 160-160s160 71.78 160 160s-71.78 160-160 160S48 296.2 48 208z"/>
2088</svg>
2089                    </button>
2090
2091                    <!--Customer Icon & Dropdown-->
2092                    <!-- Desktop profile button -->
2093<a  href="https&#x3A;&#x2F;&#x2F;www.aveve.be&#x2F;fr&#x2F;customer&#x2F;account&#x2F;"
2094    id="customer-menu"
2095    class="flex flex-row lg:flex-col items-center text-sm font-normal link-navigation lg:gap-1"
2096    aria-haspopup="true"
2097    aria-expanded="true"
2098    aria-label="My&#x20;Account"
2099    x-data="{ firstName: '' }"
2100    @private-content-loaded.window="firstName = $event.detail.data.customer.firstname;"
2101    >
2102    <div class="relative">
2103        <i>
2104            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon hidden lg:block" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M256 112c-48.6 0-88 39.4-88 88C168 248.6 207.4 288 256 288s88-39.4 88-88C344 151.4 304.6 112 256 112zM256 240c-22.06 0-40-17.95-40-40C216 177.9 233.9 160 256 160s40 17.94 40 40C296 222.1 278.1 240 256 240zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-46.73 0-89.76-15.68-124.5-41.79C148.8 389 182.4 368 220.2 368h71.69c37.75 0 71.31 21.01 88.68 54.21C345.8 448.3 302.7 464 256 464zM416.2 388.5C389.2 346.3 343.2 320 291.8 320H220.2c-51.36 0-97.35 26.25-124.4 68.48C65.96 352.5 48 306.3 48 256c0-114.7 93.31-208 208-208s208 93.31 208 208C464 306.3 446 352.5 416.2 388.5z"/></svg>
2105            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon lg:hidden" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M256 112c-48.6 0-88 39.4-88 88C168 248.6 207.4 288 256 288s88-39.4 88-88C344 151.4 304.6 112 256 112zM256 240c-22.06 0-40-17.95-40-40C216 177.9 233.9 160 256 160s40 17.94 40 40C296 222.1 278.1 240 256 240zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-46.73 0-89.76-15.68-124.5-41.79C148.8 389 182.4 368 220.2 368h71.69c37.75 0 71.31 21.01 88.68 54.21C345.8 448.3 302.7 464 256 464zM416.2 388.5C389.2 346.3 343.2 320 291.8 320H220.2c-51.36 0-97.35 26.25-124.4 68.48C65.96 352.5 48 306.3 48 256c0-114.7 93.31-208 208-208s208 93.31 208 208C464 306.3 446 352.5 416.2 388.5z"/></svg>
2106        </i>
2107        <i x-cloak x-show="firstName" class="absolute -top-1 -right-1 rounded-full bg-primary w-[12px] h-[12px] flex items-center justify-center text-white">
2108            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="7" height="7" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M440.1 103C450.3 112.4 450.3 127.6 440.1 136.1L176.1 400.1C167.6 410.3 152.4 410.3 143 400.1L7.029 264.1C-2.343 255.6-2.343 240.4 7.029 231C16.4 221.7 31.6 221.7 40.97 231L160 350.1L407 103C416.4 93.66 431.6 93.66 440.1 103V103z"/></svg>
2109        </i>
2110    </div>
2111
2112    <span class="customer-name box-border hidden lg:block" x-show="!firstName">MyAveve</span>
2113    <span class="customer-name box-border hidden lg:block" x-show="firstName" x-bind="firstName" x-text="firstName"></span>
2114</a>
2115
2116                    <!--Cart Icon-->
2117                    <a id="menu-cart-icon" class="hidden"
2118                       @click.prevent.stop="$dispatch('toggle-cart',{});"                    >
2119                    </a>
2120                    <a id="menu-cart"
2121                       class="hover:text-primary relative inline-block no-underline md:box-border flex flex-col items-center justify-center gap-1"
2122                       href="https://www.aveve.be/fr/checkout/cart/index/"
2123                    >
2124                        <span class="sr-only label">
2125                            Panier                        </span>
2126                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon hidden lg:block" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M96 0C107.5 0 117.4 8.19 119.6 19.51L121.1 32H541.8C562.1 32 578.3 52.25 572.6 72.66L518.6 264.7C514.7 278.5 502.1 288 487.8 288H170.7L179.9 336H488C501.3 336 512 346.7 512 360C512 373.3 501.3 384 488 384H159.1C148.5 384 138.6 375.8 136.4 364.5L76.14 48H24C10.75 48 0 37.25 0 24C0 10.75 10.75 0 24 0H96zM475.6 240L520.6 80H131.1L161.6 240H475.6zM128 464C128 437.5 149.5 416 176 416C202.5 416 224 437.5 224 464C224 490.5 202.5 512 176 512C149.5 512 128 490.5 128 464zM512 464C512 490.5 490.5 512 464 512C437.5 512 416 490.5 416 464
2126C416 437.5 437.5 416 464 416C490.5 416 512 437.5 512 464z"/></svg>
2127                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon lg:hidden" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M96 0C107.5 0 117.4 8.19 119.6 19.51L121.1 32H541.8C562.1 32 578.3 52.25 572.6 72.66L518.6 264.7C514.7 278.5 502.1 288 487.8 288H170.7L179.9 336H488C501.3 336 512 346.7 512 360C512 373.3 501.3 384 488 384H159.1C148.5 384 138.6 375.8 136.4 364.5L76.14 48H24C10.75 48 0 37.25 0 24C0 10.75 10.75 0 24 0H96zM475.6 240L520.6 80H131.1L161.6 240H475.6zM128 464C128 437.5 149.5 416 176 416C202.5 416 224 437.5 224 464C224 490.5 202.5 512 176 512C149.5 512 128 490.5 128 464zM512 464C512 490.5 490.5 512 464 512C437.5 512 416 490.5 416 464C416 437.5 437.5 416 464 416C490.5 416 512 437.5 512 464z"/></svg>
2128                        <span x-text="cart.summary_count"
2129                              class="absolute top-0 right-1/2 translate-x-1/2 hidden w-4 h-4 -mt-4 -mr-2 text-xs font-semibold
2130                            leading-none text-white uppercase transform translate-y-1/2 rounded-full bg-primary"
2131                              :class="{
2132                            'hidden': !cart.summary_count,
2133                            'flex justify-center items-center': cart.summary_count }"
2134                        ></span>
2135                        <span class="text-sm font-normal link-navigation hidden lg:block">Panier</span>
2136                    </a>
2137                </div>
2138            </div>
2139
2140            <!--Main Navigation-->
2141            <div class="w-1/3 lg:w-full order-1 lg:order-none">
2142                <div x-data="initMenuMobile_6ab4f73f18115()"
2143     class="flex z-20 order-1 w-1/2 navigation lg:hidden"
2144     @private-content-loaded.window="getData(event.detail.data);"
2145>
2146    <div class="backdrop z-10"
2147         x-show="open"
2148         x-cloak
2149         @click="open = false; toggleScroll()"
2150         x-transition:enter="ease-in-out duration-500"
2151         x-transition:enter-start="opacity-0"
2152         x-transition:enter-end="opacity-100"
2153         x-transition:leave="ease-in-out duration-500"
2154         x-transition:leave-start="opacity-100"
2155         x-transition:leave-end="opacity-0"
2156         aria-label="Close panel"></div>
2157
2158    <div class="flex items-baseline justify-between menu-icon">
2159        <div class="flex justify-end w-full">
2160            <a @click="$dispatch('toggle-mobile-menu')"
2161               class="flex items-center cursor-pointer"
2162               :class="{'justify-center': !open}">
2163                <div :class="{ 'hidden' : open, 'block': !open }">
2164                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="20" height="20" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M0 88C0 74.75 10.75 64 24 64H424C437.3 64 448 74.75 448 88C448 101.3 437.3 112 424 112H24C10.75 112 0 101.3 0 88zM0 248C0 234.7 10.75 224 24 224H424C437.3 224 448 234.7 448 248C448 261.3 437.3 272 424 272H24C10.75 272 0 261.3 0 248zM424 432H24C10.75 432 0 421.3 0 408C0 394.7 10.75 384 24 384H424C437.3 384 448 394.7 448 408C448 421.3 437.3 432 424 432z"/></svg>
2165                </div>
2166            </a>
2167        </div>
2168    </div>
2169
2170    <!-- mobile -->
2171    <div class="z-40"
2172         id="menu-overlay"
2173         :class="{'overflow-y-auto h-full fixed top-0 left-0 w-[85%]' : open}"
2174         @toggle-mobile-menu.window="open = !open; toggleScroll()"
2175         @keydown.window.escape="open=false; toggleScroll()"
2176    >
2177        <nav class="hidden absolute bg-white flex flex-wrap flex-col w-full min-h-screen overflow-y-auto overflow-x-hidden duration-150 ease-in-out transform transition-display"
2178            :class="{ 'hidden' : !open }">
2179
2180
2181            <div id="menu-items-wrapper" class="overflow-x-hidden overflow-y-hidden w-full flex flex-wrap pb-6 transition-all">
2182                <a @click="$dispatch('toggle-mobile-menu'); mobilePanelActiveId = 0; mobileSubPanelActiveId = 0"
2183                   class="flex items-center cursor-pointer"
2184                   :class="{'ml-auto h-14 pr-6 bg-secondary-alt1 text-white w-full justify-end': open}">
2185                    <div class="hidden z-20"
2186                         :class="{ 'hidden' : !open, 'block': open }">
2187                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="10" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z"/></svg>
2188                    </div>
2189                </a>
2190                                    <div class="level-0 w-full first:pt-2">
2191                        <span class="flex items-center transition-transform duration-150 ease-in-out transform"
2192                            :class="{
2193                                '-translate-x-full h-0' : mobilePanelActiveId,
2194                                'translate-x-0 h-full' : !mobilePanelActiveId
2195                            }"
2196                            @click="mobilePanelActiveId =
2197                                    mobilePanelActiveId === 'category-node-6' ?
2198                                    0 : 'category-node-6';
2199                                    "
2200                        >
2201                            <a class="flex items-center w-full p-4 pr-0 cursor-pointer font-normal bg-white level-0"
2202                               title="Jardin">
2203                                <span class="pr-5 box-border">
2204                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M436.4 32c-91 0-168.3 67.88-194.6 161.4C204.6 134.6 144 96 75.63 96L0 95.1V120C0 247.9 91.75 352 204.4 352H232v104C232 469.2 242.8 480 255.1 480S280 469.2 280 456V288h27.62C420.2 288 512 183.9 512 56V32H436.4zM204.4 304c-79.25 0-145.1-69.75-155.1-160h26.25c79.25 0 145.1 69.75 155.1 160H204.4zM307.6 240h-26.25c10-90.25 75.87-160 155.1-160h26.25C452.8 170.2 386.9 240 307.6 240z"/></svg>
2205                                </span>
2206                                <span class="pr-1 box-border">
2207                                    Jardin                                </span>
2208                            </a>
2209                                                            <a class="flex pr-6 cursor-pointer box-border">
2210                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
2211                                </a>
2212                                                    </span>
2213                                                    <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
2214                                translate-x-full transform"
2215                                :class="{
2216                                    'translate-x-full h-0' : mobilePanelActiveId !== 'category-node-6',
2217                                    'translate-x-0 h-full z-10' : mobilePanelActiveId === 'category-node-6'
2218                                }"
2219                            >
2220                                <div class="absolute top-[-56px] flex items-center text-white font-semibold pl-6 md:pl-10"
2221                                     @click="mobilePanelActiveId = 0"
2222                                >
2223                                    <span class="pr-[89px] md:pr-[240px] box-border">
2224                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="13" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
2225                                    </span>
2226                                    <a class="flex items-center p-4 cursor-pointer text-white font-semibold">
2227                                        <span class="pr-3 box-border">
2228                                           <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M436.4 32c-91 0-168.3 67.88-194.6 161.4C204.6 134.6 144 96 75.63 96L0 95.1V120C0 247.9 91.75 352 204.4 352H232v104C232 469.2 242.8 480 255.1 480S280 469.2 280 456V288h27.62C420.2 288 512 183.9 512 56V32H436.4zM204.4 304c-79.25 0-145.1-69.75-155.1-160h26.25c79.25 0 145.1 69.75 155.1 160H204.4zM307.6 240h-26.25c10-90.25 75.87-160 155.1-160h26.25C452.8 170.2 386.9 240 307.6 240z"/></svg>
2229                                        </span>
2230                                        Jardin                                    </a>
2231                                </div>
2232                                <div>
2233                                                                            <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2234                                              @click="
2235                                                      selected !== 'category-node-246'
2236                                                                ? selected = 'category-node-246' : selected = null;"
2237                                        >
2238                                                                                            <a title="BBQ"
2239                                                   class="flex items-center w-full font-normal">
2240                                                    BBQ                                                </a>
2241                                                <a class="flex cursor-pointer box-border transition"
2242                                                   :class="{'rotate-180': selected == 'category-node-246', 'rotate-0': selected == null}"
2243                                                >
2244                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2245                                                </a>
2246                                                                                    </span>
2247                                                                                    
2248                                            <div x-ref="container246"
2249                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2250                                                 :style="selected == 'category-node-246'
2251                                                                    ? 'max-height: ' + $refs.container246.scrollHeight + 'px' : ''"
2252                                            >
2253                                                <div class="border-l-2 border-opacity-10 border-gray">
2254                                                                                                            <a href="https://www.aveve.be/fr/jardin/bbq/barbecue"
2255                                                           title="Barbecue"
2256                                                           class="flex items-center w-full px-4 py-3 font-normal">
2257                                                            Barbecue                                                        </a>
2258                                                                                                            <a href="https://www.aveve.be/fr/jardin/bbq/accessoires"
2259                                                           title="Accessoires"
2260                                                           class="flex items-center w-full px-4 py-3 font-normal">
2261                                                            Accessoires                                                        </a>
2262                                                                                                            <a href="https://www.aveve.be/fr/jardin/bbq/entretien"
2263                                                           title="Entretien"
2264                                                           class="flex items-center w-full px-4 py-3 font-normal">
2265                                                            Entretien                                                        </a>
2266                                                                                                            <a href="https://www.aveve.be/fr/jardin/bbq/charbon-de-bois-briquettes"
2267                                                           title="Charbon&#x20;de&#x20;bois&#x20;&amp;&#x20;briquettes"
2268                                                           class="flex items-center w-full px-4 py-3 font-normal">
2269                                                            Charbon de bois &amp; briquettes                                                        </a>
2270                                                                                                            <a href="https://www.aveve.be/fr/jardin/bbq/materiel-d-allumage"
2271                                                           title="Mat&#xE9;riel&#x20;d&#x2019;allumage"
2272                                                           class="flex items-center w-full px-4 py-3 font-normal">
2273                                                            Matériel d’allumage                                                        </a>
2274                                                                                                    </div>
2275
2276                                                <a href="https://www.aveve.be/fr/jardin/bbq"
2277                                                   title="BBQ"
2278                                                   class="flex items-center w-full text-primary font-normal mt-4">
2279                                                    Afficher tous les articles de BBQ                                                </a>
2280                                            </div>
2281                                                                                                                    <sp
2281an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2282                                              @click="
2283                                                      selected !== 'category-node-15'
2284                                                                ? selected = 'category-node-15' : selected = null;"
2285                                        >
2286                                                                                            <a title="Sol&#x20;&amp;&#x20;engrais"
2287                                                   class="flex items-center w-full font-normal">
2288                                                    Sol &amp; engrais                                                </a>
2289                                                <a class="flex cursor-pointer box-border transition"
2290                                                   :class="{'rotate-180': selected == 'category-node-15', 'rotate-0': selected == null}"
2291                                                >
2292                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2293                                                </a>
2294                                                                                    </span>
2295                                                                                    
2296                                            <div x-ref="container15"
2297                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2298                                                 :style="selected == 'category-node-15'
2299                                                                    ? 'max-height: ' + $refs.container15.scrollHeight + 'px' : ''"
2300                                            >
2301                                                <div class="border-l-2 border-opacity-10 border-gray">
2302                                                                                                            <a href="https://www.aveve.be/fr/jardin/sol-engrais/engrais"
2303                                                           title="Engrais"
2304                                                           class="flex items-center w-full px-4 py-3 font-normal">
2305                                                            Engrais                                                        </a>
2306                                                                                                            <a href="https://www.aveve.be/fr/jardin/sol-engrais/terreau"
2307                                                           title="Terreau"
2308                                                           class="flex items-center w-full px-4 py-3 font-normal">
2309                                                            Terreau                                                        </a>
2310                                                                                                            <a href="https://www.aveve.be/fr/jardin/sol-engrais/couvre-sols-ecorce-de-bois"
2311                                                           title="Couvre-sols&#x20;&amp;&#x20;&#xE9;corce&#x20;de&#x20;bois"
2312                                                           class="flex items-center w-full px-4 py-3 font-normal">
2313                                                            Couvre-sols &amp; écorce de bois                                                        </a>
2314                                                                                                            <a href="https://www.aveve.be/fr/jardin/sol-engrais/chaux"
2315                                                           title="Chaux"
2316                                                           class="flex items-center w-full px-4 py-3 font-normal">
2317                                                            Chaux                                                        </a>
2318                                                                                                            <a href="https://www.aveve.be/fr/jardin/sol-engrais/amendement"
2319                                                           title="Amendement"
2320                                                           class="flex items-center w-full px-4 py-3 font-normal">
2321                                                            Amendement                                                        </a>
2322                                                                                                            <a href="https://www.aveve.be/fr/jardin/sol-engrais/epandeurs"
2323                                                           title="&#xC9;pandeurs"
2324                                                           class="flex items-center w-full px-4 py-3 font-normal">
2325                                                            Épandeurs                                                        </a>
2326                                                                                                    </div>
2327
2328                                                <a href="https://www.aveve.be/fr/jardin/sol-engrais"
2329                                                   title="Sol&#x20;&amp;&#x20;engrais"
2330                                                   class="flex items-center w-full text-primary font-normal mt-4">
2331                                                    Afficher tous les articles de Sol &amp; engrais                                                </a>
2332                                            </div>
2333                                                                                                                    <sp
2333an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2334                                              @click="
2335                                                      selected !== 'category-node-33'
2336                                                                ? selected = 'category-node-33' : selected = null;"
2337                                        >
2338                                                                                            <a title="Protection&#x20;des&#x20;plantes"
2339                                                   class="flex items-center w-full font-normal">
2340                                                    Protection des plantes                                                </a>
2341                                                <a class="flex cursor-pointer box-border transition"
2342                                                   :class="{'rotate-180': selected == 'category-node-33', 'rotate-0': selected == null}"
2343                                                >
2344                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2345                                                </a>
2346                                                                                    </span>
2347                                                                                    
2348                                            <div x-ref="container33"
2349                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2350                                                 :style="selected == 'category-node-33'
2351                                                                    ? 'max-height: ' + $refs.container33.scrollHeight + 'px' : ''"
2352                                            >
2353                                                <div class="border-l-2 border-opacity-10 border-gray">
2354                                                                                                            <a href="https://www.aveve.be/fr/jardin/protection-des-plantes/desherbant"
2355                                                           title="D&#xE9;sherbant"
2356                                                           class="flex items-center w-full px-4 py-3 font-normal">
2357                                                            Désherbant                                                        </a>
2358                                                                                                            <a href="https://www.aveve.be/fr/jardin/protection-des-plantes/fongicide"
2359                                                           title="Fongicide"
2360                                                           class="flex items-center w-full px-4 py-3 font-normal">
2361                                                            Fongicide                                                        </a>
2362                                                                                                            <a href="https://www.aveve.be/fr/jardin/protection-des-plantes/insecticides"
2363                                                           title="Insecticides"
2364                                                           class="flex items-center w-full px-4 py-3 font-normal">
2365                                                            Insecticides                                                        </a>
2366                                                                                                            <a href="https://www.aveve.be/fr/jardin/protection-des-plantes/controle-de-la-mousse"
2367                                                           title="Contr&#xF4;le&#x20;de&#x20;la&#x20;mousse"
2368                                                           class="flex items-center w-full px-4 py-3 font-normal">
2369                                                            Contrôle de la mousse                                                        </a>
2370                                                                                                            <a href="https://www.aveve.be/fr/jardin/protection-des-plantes/autres-produits-de-lutte-antiparasitaire"
2371                                                           title="Autres&#x20;produits&#x20;de&#x20;lutte&#x20;antiparasitaire"
2372                                                           class="flex items-center w-full px-4 py-3 font-normal">
2373                                                            Autres produits de lutte antiparasitaire                                                        </a>
2374                                                                                                    </div>
2375
2376                                                <a href="https://www.aveve.be/fr/jardin/protection-des-plantes"
2377                                                   title="Protection&#x20;des&#x20;plantes"
2378                                                   class="flex items-center w-full text-primary font-normal mt-4">
2379                                                    Afficher tous les articles de Protection des plantes                                                </a>
2380                                            </div>
2381                                                                                                                    <sp
2381an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2382                                              @click="
2383                                                      selected !== 'category-node-204'
2384                                                                ? selected = 'category-node-204' : selected = null;"
2385                                        >
2386                                                                                            <a title="Antiparasitaire"
2387                                                   class="flex items-center w-full font-normal">
2388                                                    Antiparasitaire                                                </a>
2389                                                <a class="flex cursor-pointer box-border transition"
2390                                                   :class="{'rotate-180': selected == 'category-node-204', 'rotate-0': selected == null}"
2391                                                >
2392                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2393                                                </a>
2394                                                                                    </span>
2395                                                                                    
2396                                            <div x-ref="container204"
2397                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2398                                                 :style="selected == 'category-node-204'
2399                                                                    ? 'max-height: ' + $refs.container204.scrollHeight + 'px' : ''"
2400                                            >
2401                                                <div class="border-l-2 border-opacity-10 border-gray">
2402                                                                                                            <a href="https://www.aveve.be/fr/jardin/antiparasitaire/souris-rats"
2403                                                           title="Souris&#x20;&amp;&#x20;rats"
2404                                                           class="flex items-center w-full px-4 py-3 font-normal">
2405                                                            Souris &amp; rats                                                        </a>
2406                                                                                                            <a href="https://www.aveve.be/fr/jardin/antiparasitaire/insectes-rampants-volants"
2407                                                           title="Insectes&#x20;rampants&#x20;&amp;&#x20;volants"
2408                                                           class="flex items-center w-full px-4 py-3 font-normal">
2409                                                            Insectes rampants &amp; volants                                                        </a>
2410                                                                                                            <a href="https://www.aveve.be/fr/jardin/antiparasitaire/taupes"
2411                                                           title="Taupes"
2412                                                           class="flex items-center w-full px-4 py-3 font-normal">
2413                                                            Taupes                                                        </a>
2414                                                                                                            <a href="https://www.aveve.be/fr/jardin/antiparasitaire/limaces"
2415                                                           title="Limaces"
2416                                                           class="flex items-center w-full px-4 py-3 font-normal">
2417                                                            Limaces                                                        </a>
2418                                                                                                            <a href="https://www.aveve.be/fr/jardin/antiparasitaire/fourmis"
2419                                                           title="Fourmis"
2420                                                           class="flex items-center w-full px-4 py-3 font-normal">
2421                                                            Fourmis                                                        </a>
2422                                                                                                            <a href="https://www.aveve.be/fr/jardin/antiparasitaire/autres-nuisibles"
2423                                                           title="Autres&#x20;nuisibles"
2424                                                           class="flex items-center w-full px-4 py-3 font-normal">
2425                                                            Autres nuisibles                                                        </a>
2426                                                                                                    </div>
2427
2428                                                <a href="https://www.aveve.be/fr/jardin/antiparasitaire"
2429                                                   title="Antiparasitaire"
2430                                                   class="flex items-center w-full text-primary font-normal mt-4">
2431                                                    Afficher tous les articles de Antiparasitaire                                                </a>
2432                                            </div>
2433                                                                                                                    <sp
2433an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2434                                              @click="
2435                                                      selected !== 'category-node-9'
2436                                                                ? selected = 'category-node-9' : selected = null;"
2437                                        >
2438                                                                                            <a title="Outils&#x20;de&#x20;jardinage"
2439                                                   class="flex items-center w-full font-normal">
2440                                                    Outils de jardinage                                                </a>
2441                                                <a class="flex cursor-pointer box-border transition"
2442                                                   :class="{'rotate-180': selected == 'category-node-9', 'rotate-0': selected == null}"
2443                                                >
2444                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2445                                                </a>
2446                                                                                    </span>
2447                                                                                    
2448                                            <div x-ref="container9"
2449                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2450                                                 :style="selected == 'category-node-9'
2451                                                                    ? 'max-height: ' + $refs.container9.scrollHeight + 'px' : ''"
2452                                            >
2453                                                <div class="border-l-2 border-opacity-10 border-gray">
2454                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outils-de-taille"
2455                                                           title="Outils&#x20;de&#x20;taille"
2456                                                           class="flex items-center w-full px-4 py-3 font-normal">
2457                                                            Outils de taille                                                        </a>
2458                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outils-a-manche"
2459                                                           title="Outils&#x20;&#xE0;&#x20;manche"
2460                                                           class="flex items-center w-full px-4 py-3 font-normal">
2461                                                            Outils à manche                                                        </a>
2462                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outillage-a-main"
2463                                                           title="Outillage&#x20;&#xE0;&#x20;main"
2464                                                           class="flex items-center w-full px-4 py-3 font-normal">
2465                                                            Outillage à main                                                        </a>
2466                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outils-pour-enfants"
2467                                                           title="Outils&#x20;pour&#x20;enfants"
2468                                                           class="flex items-center w-full px-4 py-3 font-normal">
2469                                                            Outils pour enfants                                                        </a>
2470                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/brouettes"
2471                                                           title="Brouettes"
2472                                                           class="flex items-center w-full px-4 py-3 font-normal">
2473                                                            Brouettes                                                        </a>
2474                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/pulverisateurs"
2475                                                           title="Pulv&#xE9;risateurs"
2476                                                           class="flex items-center w-full px-4 py-3 font-normal">
2477                                                            Pulvérisateurs                                                        </a>
2478                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/desherbeurs-thermiques"
2479                                                           title="D&#xE9;sherbeurs&#x20;thermiques"
2480                                                           class="flex items-center w-full px-4 py-3 font-normal">
2481                                                            Désherbeurs thermiques                                                        </a>
2482                                                                                                            <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage/autres-outils"
2483                                                           title="Autres&#x20;outils"
2484                                                           class="flex items-center w-full px-4 py-3 font-normal">
2485                                                            Autres outils                                                        </a>
2486                                                                                                    </div>
2487
2488                                                <a href="https://www.aveve.be/fr/jardin/outils-de-jardinage"
2489                                                   title="Outils&#x20;de&#x20;jardinage"
2490                                                   class="flex items-center w-full text-primary font-normal mt-4">
2491                                                    Afficher tous les articles de Outils de jardinage                                                </a>
2492                                            </div>
2493                                                                                                                    <sp
2493an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2494                                              @click="
2495                                                      selected !== 'category-node-123'
2496                                                                ? selected = 'category-node-123' : selected = null;"
2497                                        >
2498                                                                                            <a title="Machines&#x20;de&#x20;jardinage"
2499                                                   class="flex items-center w-full font-normal">
2500                                                    Machines de jardinage                                                </a>
2501                                                <a class="flex cursor-pointer box-border transition"
2502                                                   :class="{'rotate-180': selected == 'category-node-123', 'rotate-0': selected == null}"
2503                                                >
2504                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2505                                                </a>
2506                                                                                    </span>
2507                                                                                    
2508                                            <div x-ref="container123"
2509                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2510                                                 :style="selected == 'category-node-123'
2511                                                                    ? 'max-height: ' + $refs.container123.scrollHeight + 'px' : ''"
2512                                            >
2513                                                <div class="border-l-2 border-opacity-10 border-gray">
2514                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/tondeuses"
2515                                                           title="Tondeuses"
2516                                                           class="flex items-center w-full px-4 py-3 font-normal">
2517                                                            Tondeuses                                                        </a>
2518                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/scarificateurs-electriques"
2519                                                           title="Scarificateurs&#x20;&#xE9;lectriques"
2520                                                           class="flex items-center w-full px-4 py-3 font-normal">
2521                                                            Scarificateurs électriques                                                        </a>
2522                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/souffleurs-de-feuilles"
2523                                                           title="Souffleurs&#x20;de&#x20;feuilles"
2524                                                           class="flex items-center w-full px-4 py-3 font-normal">
2525                                                            Souffleurs de feuilles                                                        </a>
2526                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/taille-haies"
2527                                                           title="Taille-haies"
2528                                                           class="flex items-center w-full px-4 py-3 font-normal">
2529                                                            Taille-haies                                                        </a>
2530                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/tronconneuses"
2531                                                           title="Tron&#xE7;onneuses"
2532                                                           class="flex items-center w-full px-4 py-3 font-normal">
2533                                                            Tronçonneuses                                                        </a>
2534                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/nettoyeurs-haute-pression"
2535                                                           title="Nettoyeurs&#x20;haute&#x20;pression"
2536                                                           class="flex items-center w-full px-4 py-3 font-normal">
2537                                                            Nettoyeurs haute pression                                                        </a>
2538                                                                                                            <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage/aspirateurs"
2539                                                           title="Aspirateurs"
2540                                                           class="flex items-center w-full px-4 py-3 font-normal">
2541                                                            Aspirateurs                                                        </a>
2542                                                                                                    </div>
2543
2544                                                <a href="https://www.aveve.be/fr/jardin/machines-de-jardinage"
2545                                                   title="Machines&#x20;de&#x20;jardinage"
2546                                                   class="flex items-center w-full text-primary font-normal mt-4">
2547                                                    Afficher tous les articles de Machines de jardinage                                                </a>
2548                                            </div>
2549                                                                                                                    <sp
2549an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2550                                              @click="
2551                                                      selected !== 'category-node-75'
2552                                                                ? selected = 'category-node-75' : selected = null;"
2553                                        >
2554                                                                                            <a title="Serres&#x20;&amp;&#x20;mat&#xE9;riel&#x20;de&#x20;culture"
2555                                                   class="flex items-center w-full font-normal">
2556                                                    Serres &amp; matériel de culture                                                </a>
2557                                                <a class="flex cursor-pointer box-border transition"
2558                                                   :class="{'rotate-180': selected == 'category-node-75', 'rotate-0': selected == null}"
2559                                                >
2560                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2561                                                </a>
2562                                                                                    </span>
2563                                                                                    
2564                                            <div x-ref="container75"
2565                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2566                                                 :style="selected == 'category-node-75'
2567                                                                    ? 'max-height: ' + $refs.container75.scrollHeight + 'px' : ''"
2568                                            >
2569                                                <div class="border-l-2 border-opacity-10 border-gray">
2570                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/fournitures-de-culture"
2571                                                           title="Fournitures&#x20;de&#x20;culture"
2572                                                           class="flex items-center w-full px-4 py-3 font-normal">
2573                                                            Fournitures de culture                                                        </a>
2574                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/carres-potagers"
2575                                                           title="Carr&#xE9;s&#x20;potagers"
2576                                                           class="flex items-center w-full px-4 py-3 font-normal">
2577                                                            Carrés potagers                                                        </a>
2578                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/serres"
2579                                                           title="Serres"
2580                                                           class="flex items-center w-full px-4 py-3 font-normal">
2581                                                            Serres                                                        </a>
2582                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/accessoires-serres"
2583                                                           title="Accessoires&#x20;serres"
2584                                                           class="flex items-center w-full px-4 py-3 font-normal">
2585                                                            Accessoires serres                                                        </a>
2586                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/materiaux-de-fixation-pour-plantes"
2587                                                           title="Mat&#xE9;riaux&#x20;de&#x20;fixation&#x20;pour&#x20;plantes"
2588                                                           class="flex items-center w-full px-4 py-3 font-normal">
2589                                                            Matériaux de fixation pour plantes                                                        </a>
2590                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/toiles-de-sol-films-protecteur"
2591                                                           title="Toiles&#x20;de&#x20;sol&#x20;&amp;&#x20;films&#x20;protecteur"
2592                                                           class="flex items-center w-full px-4 py-3 font-normal">
2593                                                            Toiles de sol &amp; films protecteur                                                        </a>
2594                                                                                                            <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/bacs-a-compost"
2595                                                           title="Bacs&#x20;&#xE0;&#x20;compost"
2596                                                           class="flex items-center w-full px-4 py-3 font-normal">
2597                                                            Bacs à compost                                                        </a>
2598                                                                                                    </div>
2599
2600                                                <a href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture"
2601                                                   title="Serres&#x20;&amp;&#x20;mat&#xE9;riel&#x20;de&#x20;culture"
2602                                                   class="flex items-center w-full text-primary font-normal mt-4">
2603                                                    Afficher tous les articles de Serres &amp; matériel de culture                                                </a>
2604                                            </div>
2605                                                                                                                    <sp
2605an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2606                                              @click="
2607                                                      selected !== 'category-node-51'
2608                                                                ? selected = 'category-node-51' : selected = null;"
2609                                        >
2610                                                                                            <a title="Semences&#x20;&amp;&#x20;bulbes&#x20;&#xE0;&#x20;fleurs"
2611                                                   class="flex items-center w-full font-normal">
2612                                                    Semences &amp; bulbes à fleurs                                                </a>
2613                                                <a class="flex cursor-pointer box-border transition"
2614                                                   :class="{'rotate-180': selected == 'category-node-51', 'rotate-0': selected == null}"
2615                                                >
2616                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2617                                                </a>
2618                                                                                    </span>
2619                                                                                    
2620                                            <div x-ref="container51"
2621                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2622                                                 :style="selected == 'category-node-51'
2623                                                                    ? 'max-height: ' + $refs.container51.scrollHeight + 'px' : ''"
2624                                            >
2625                                                <div class="border-l-2 border-opacity-10 border-gray">
2626                                                                                                            <a href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/semence-de-gazon"
2627                                                           title="Semence&#x20;de&#x20;gazon"
2628                                                           class="flex items-center w-full px-4 py-3 font-normal">
2629                                                            Semence de gazon                                                        </a>
2630                                                                                                            <a href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/semences-de-jardin"
2631                                                           title="Semences&#x20;de&#x20;jardin"
2632                                                           class="flex items-center w-full px-4 py-3 font-normal">
2633                                                            Semences de jardin                                                        </a>
2634                                                                                                            <a href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/bulbes-a-fleurs"
2635                                                           title="Bulbes&#x20;&#xE0;&#x20;fleurs"
2636                                                           class="flex items-center w-full px-4 py-3 font-normal">
2637                                                            Bulbes à fleurs                                                        </a>
2638                                                                                                            <a href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/plants-et-oignons"
2639                                                           title="Plants&#x20;et&#x20;oignons"
2640                                                           class="flex items-center w-full px-4 py-3 font-normal">
2641                                                            Plants et oignons                                                        </a>
2642                                                                                                    </div>
2643
2644                                                <a href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs"
2645                                                   title="Semences&#x20;&amp;&#x20;bulbes&#x20;&#xE0;&#x20;fleurs"
2646                                                   class="flex items-center w-full text-primary font-normal mt-4">
2647                                                    Afficher tous les articles de Semences &amp; bulbes à fleurs                                                </a>
2648                                            </div>
2649                                                                                                                    <sp
2649an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2650                                              @click="
2651                                                      selected !== 'category-node-1060'
2652                                                                ? selected = 'category-node-1060' : selected = null;"
2653                                        >
2654                                                                                            <a title="Plantes"
2655                                                   class="flex items-center w-full font-normal">
2656                                                    Plantes                                                </a>
2657                                                <a class="flex cursor-pointer box-border transition"
2658                                                   :class="{'rotate-180': selected == 'category-node-1060', 'rotate-0': selected == null}"
2659                                                >
2660                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2661                                                </a>
2662                                                                                    </span>
2663                                                                                    
2664                                            <div x-ref="container1060"
2665                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2666                                                 :style="selected == 'category-node-1060'
2667                                                                    ? 'max-height: ' + $refs.container1060.scrollHeight + 'px' : ''"
2668                                            >
2669                                                <div class="border-l-2 border-opacity-10 border-gray">
2670                                                                                                            <a href="https://www.aveve.be/fr/jardin/plantes/plantes-d-exterieur"
2671                                                           title="Plantes&#x20;d&#x27;ext&#xE9;rieur"
2672                                                           class="flex items-center w-full px-4 py-3 font-normal">
2673                                                            Plantes d&#039;extérieur                                                        </a>
2674                                                                                                            <a href="https://www.aveve.be/fr/jardin/plantes/plantes-d-interieur"
2675                                                           title="Plantes&#x20;d&#x27;int&#xE9;rieur"
2676                                                           class="flex items-center w-full px-4 py-3 font-normal">
2677                                                            Plantes d&#039;intérieur                                                        </a>
2678                                                                                                            <a href="https://www.aveve.be/fr/jardin/plantes/herbes"
2679                                                           title="Herbes"
2680                                                           class="flex items-center w-full px-4 py-3 font-normal">
2681                                                            Herbes                                                        </a>
2682                                                                                                    </div>
2683
2684                                                <a href="https://www.aveve.be/fr/jardin/plantes"
2685                                                   title="Plantes"
2686                                                   class="flex items-center w-full text-primary font-normal mt-4">
2687                                                    Afficher tous les articles de Plantes                                                </a>
2688                                            </div>
2689                                                                                                                    <sp
2689an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2690                                              @click="
2691                                                      selected !== 'category-node-150'
2692                                                                ? selected = 'category-node-150' : selected = null;"
2693                                        >
2694                                                                                            <a title="Arrosage"
2695                                                   class="flex items-center w-full font-normal">
2696                                                    Arrosage                                                </a>
2697                                                <a class="flex cursor-pointer box-border transition"
2698                                                   :class="{'rotate-180': selected == 'category-node-150', 'rotate-0': selected == null}"
2699                                                >
2700                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2701                                                </a>
2702                                                                                    </span>
2703                                                                                    
2704                                            <div x-ref="container150"
2705                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2706                                                 :style="selected == 'category-node-150'
2707                                                                    ? 'max-height: ' + $refs.container150.scrollHeight + 'px' : ''"
2708                                            >
2709                                                <div class="border-l-2 border-opacity-10 border-gray">
2710                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/arrosoirs"
2711                                                           title="Arrosoirs"
2712                                                           class="flex items-center w-full px-4 py-3 font-normal">
2713                                                            Arrosoirs                                                        </a>
2714                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/tuyaux-d-arrosage"
2715                                                           title="Tuyaux&#x20;d&#x2019;arrosage"
2716                                                           class="flex items-center w-full px-4 py-3 font-normal">
2717                                                            Tuyaux d’arrosage                                                        </a>
2718                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/tonneaux-de-pluie"
2719                                                           title="Tonneaux&#x20;de&#x20;pluie"
2720                                                           class="flex items-center w-full px-4 py-3 font-normal">
2721                                                            Tonneaux de pluie                                                        </a>
2722                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/raccords-de-tuyaux"
2723                                                           title="Raccords&#x20;de&#x20;tuyaux"
2724                                                           class="flex items-center w-full px-4 py-3 font-normal">
2725                                                            Raccords de tuyaux                                                        </a>
2726                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/arrosage-automatique"
2727                                                           title="Arrosage&#x20;automatique"
2728                                                           class="flex items-center w-full px-4 py-3 font-normal">
2729                                                            Arrosage automatique                                                        </a>
2730                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/arroseurs-de-jardin"
2731                                                           title="Arroseurs&#x20;de&#x20;jardin"
2732                                                           class="flex items-center w-full px-4 py-3 font-normal">
2733                                                            Arroseurs de jardin                                                        </a>
2734                                                                                                            <a href="https://www.aveve.be/fr/jardin/arrosage/pompes-a-eau"
2735                                                           title="Pompes&#x20;&#xE0;&#x20;eau"
2736                                                           class="flex items-center w-full px-4 py-3 font-normal">
2737                                                            Pompes à eau                                                        </a>
2738                                                                                                    </div>
2739
2740                                                <a href="https://www.aveve.be/fr/jardin/arrosage"
2741                                                   title="Arrosage"
2742                                                   class="flex items-center w-full text-primary font-normal mt-4">
2743                                                    Afficher tous les articles de Arrosage                                                </a>
2744                                            </div>
2745                                                                                                                    <sp
2745an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2746                                              @click="
2747                                                      selected !== 'category-node-177'
2748                                                                ? selected = 'category-node-177' : selected = null;"
2749                                        >
2750                                                                                            <a title="Pots&#x20;de&#x20;fleurs&#x20;&amp;&#x20;jardini&#xE8;res"
2751                                                   class="flex items-center w-full font-normal">
2752                                                    Pots de fleurs &amp; jardinières                                                </a>
2753                                                <a class="flex cursor-pointer box-border transition"
2754                                                   :class="{'rotate-180': selected == 'category-node-177', 'rotate-0': selected == null}"
2755                                                >
2756                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2757                                                </a>
2758                                                                                    </span>
2759                                                                                    
2760                                            <div x-ref="container177"
2761                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2762                                                 :style="selected == 'category-node-177'
2763                                                                    ? 'max-height: ' + $refs.container177.scrollHeight + 'px' : ''"
2764                                            >
2765                                                <div class="border-l-2 border-opacity-10 border-gray">
2766                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/pots-de-fleurs"
2767                                                           title="Pots&#x20;de&#x20;fleurs"
2768                                                           class="flex items-center w-full px-4 py-3 font-normal">
2769                                                            Pots de fleurs                                                        </a>
2770                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/jardiniere"
2771                                                           title="Jardini&#xE8;re"
2772                                                           class="flex items-center w-full px-4 py-3 font-normal">
2773                                                            Jardinière                                                        </a>
2774                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/pots-suspendus"
2775                                                           title="Pots&#x20;suspendus"
2776                                                           class="flex items-center w-full px-4 py-3 font-normal">
2777                                                            Pots suspendus                                                        </a>
2778                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/sous-plat-pots-de-fleurs"
2779                                                           title="Sous-plat&#x20;pots&#x20;de&#x20;fleurs"
2780                                                           class="flex items-center w-full px-4 py-3 font-normal">
2781                                                            Sous-plat pots de fleurs                                                        </a>
2782                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/hydrogranules"
2783                                                           title="Hydrogranul&#xE9;s"
2784                                                           class="flex items-center w-full px-4 py-3 font-normal">
2785                                                            Hydrogranulés                                                        </a>
2786                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/
2786accessoires"
2787                                                           title="Accessoires"
2788                                                           class="flex items-center w-full px-4 py-3 font-normal">
2789                                                            Accessoires                                                        </a>
2790                                                                                                            <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/paniers-a-plantes"
2791                                                           title="Paniers&#x20;&#xE0;&#x20;plantes"
2792                                                           class="flex items-center w-full px-4 py-3 font-normal">
2793                                                            Paniers à plantes                                                        </a>
2794                                                                                                    </div>
2795
2796                                                <a href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres"
2797                                                   title="Pots&#x20;de&#x20;fleurs&#x20;&amp;&#x20;jardini&#xE8;res"
2798                                                   class="flex items-center w-full text-primary font-normal mt-4">
2799                                                    Afficher tous les articles de Pots de fleurs &amp; jardinières                                                </a>
2800                                            </div>
2801                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2802                                              @click="
2803                                                      selected !== 'category-node-904'
2804                                                                ? selected = 'category-node-904' : selected = null;"
2805                                        >
2806                                                                                            <a title="Autre&#x20;cat&#xE9;gories"
2807                                                   class="flex items-center w-full font-normal">
2808                                                    Autre catégories                                                </a>
2809                                                <a class="flex cursor-pointer box-border transition"
2810                                                   :class="{'rotate-180': selected == 'category-node-904', 'rotate-0': selected == null}"
2811                                                >
2812                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2813                                                </a>
2814                                                                                    </span>
2815                                                                                    
2816                                            <div x-ref="container904"
2817                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2818                                                 :style="selected == 'category-node-904'
2819                                                                    ? 'max-height: ' + $refs.container904.scrollHeight + 'px' : ''"
2820                                            >
2821                                                <div class="border-l-2 border-opacity-10 border-gray">
2822                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/vetements-de-jardin"
2823                                                           title="V&#xEA;tements&#x20;de&#x20;jardin"
2824                                                           class="flex items-center w-full px-4 py-3 font-normal">
2825                                                            Vêtements de jardin                                                        </a>
2826                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/fleurs-artificielles"
2827                                                           title="Fleurs&#x20;artificielles"
2828                                                           class="flex items-center w-full px-4 py-3 font-normal">
2829                                                            Fleurs artificielles                                                        </a>
2830                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/entretien-nettoyage-droguerie"
2831                                                           title="Entretien,&#x20;nettoyage&#x20;&amp;&#x20;droguerie"
2832                                                           class="flex items-center w-full px-4 py-3 font-normal">
2833                                                            Entretien, nettoyage &amp; droguerie                                                        </a>
2834                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/combustibles"
2835                                                           title="Combustibles"
2836                                                           class="flex items-center w-full px-4 py-3 font-normal">
2837                                                            Combustibles                                                        </a>
2838                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/amenagement-de-jardin-clotures"
2839                                                           title="Am&#xE9;nagement&#x20;de&#x20;jardin&#x20;&amp;&#x20;cl&#xF4;tures"
2840                                                           class="flex items-center w-full px-4 py-3 font-normal">
2841                                                            Aménagement de jardin &amp; clôtures                                                        </a>
2842                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/eclairage-de-jardin-chauffage-de
2842-terrasse"
2843                                                           title="&#xC9;clairage&#x20;de&#x20;jardin&#x20;&amp;&#x20;chauffage&#x20;de&#x20;terrasse"
2844                                                           class="flex items-center w-full px-4 py-3 font-normal">
2845                                                            Éclairage de jardin &amp; chauffage de terrasse                                                        </a>
2846                                                                                                            <a href="https://www.aveve.be/fr/jardin/autre-categories/piscine-etang"
2847                                                           title="Piscine&#x20;&amp;&#x20;&#xE9;tang"
2848                                                           class="flex items-center w-full px-4 py-3 font-normal">
2849                                                            Piscine &amp; étang                                                        </a>
2850                                                                                                    </div>
2851
2852                                                <a href="https://www.aveve.be/fr/jardin/autre-categories"
2853                                                   title="Autre&#x20;cat&#xE9;gories"
2854                                                   class="flex items-center w-full text-primary font-normal mt-4">
2855                                                    Afficher tous les articles de Autre catégories                                                </a>
2856                                            </div>
2857                                                                                                            </div>
2858                            </div>
2859                                            </div>
2860                                    <div class="level-0 w-full first:pt-2">
2861                        <span class="flex items-center transition-transform duration-150 ease-in-out transform"
2862                            :class="{
2863                                '-translate-x-full h-0' : mobilePanelActiveId,
2864                                'translate-x-0 h-full' : !mobilePanelActiveId
2865                            }"
2866                            @click="mobilePanelActiveId =
2867                                    mobilePanelActiveId === 'category-node-345' ?
2868                                    0 : 'category-node-345';
2869                                    "
2870                        >
2871                            <a class="flex items-center w-full p-4 pr-0 cursor-pointer font-normal bg-white level-0"
2872                               title="Animaux">
2873                                <span class="pr-5 box-border">
2874                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M74.89 286.8c29.12-7 44.25-40.75 33.87-75.37C99.64 181 73.88 159.1 48.01 159.1c-3.625 0-7.24 .3849-10.86 1.26c-29.12 7-44.25 40.75-33.87 75.37c9.124 30.38 34.88 51.38 60.76 51.38C67.65 288 71.26 287.6 74.89 286.8zM318.5 190.6C322.1 191.5 325.7 192 329.3 192c27.75 0 56.16-26.88 66.66-65.25c11.87-43.38-3.625-85.25-34.5-93.37C357.9 32.5 354.3 32 350.7 32c-27.75 0-56.16 26.75-66.66 65.25C272.1 140.6 287.6 182.5 318.5 190.6zM474.9 161.3c-3.625-.875-7.24-1.26-10.86-1.26c-25.87 0-51.63 21.01-60.75 51.38c-10.37 34.63 4.75 68.37 33.87 75.37c3.625 .875 7.238 1.259 10.86 1.259c25.87 0 51.63-21.01 60.76-51.38C519.1 202 503.1 168.3 474.9 161.3zM182.7 192c3.625 0 7.207-.5006 10.83-1.376C224.4 182.5 239.9 140.6 228 97.25C217.5 58.88 189.1 32 161.3 32C157.7 32 154.1 32.5 150.5 33.38c-30.87 8.125-46.37 49.1-34.5 93.37C126.5 165.1 154.9 192 182.7 192zM256 224c-79.37 0-191.1 122.7-191.1 200.2C64.02 459.1 90.76 480 135.8 480C184.6 480 216.9 454.9 256 454.9C295.5 454.9 327.9 480 376.2 480c44.1 0 71.74-20.87 71.74-55.75C447.1 346.8 335.4 224 256 224zM399.7 427.1C398.9 428.1 392.1 432 376.2 432c-17.75 0-33.25-5.125-51.37-11.12c-19.87-6.5-42.37-14-68.87-14c-26.25 0-48.62 7.5-68.37 14C169.5 426.9 153.8 432 135.8 432c-15.87 0-22.62-3.875-23.37-4.625c-.125-.25-.375-1.25-.375-3.125C112 370.1 204.9 272 256 272s143.1 98.13 143.1 152.2C399.1 426.1 399.7 427.1 399.7 427.1z"/></svg>
2875                                </span>
2876                                <span class="pr-1 box-border">
2877                                    Animaux                                </span>
2878                            </a>
2879                                                            <a class="flex pr-6 cursor-pointer box-border">
2880                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
2881                                </a>
2882                                                    </span>
2883                                                    <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
2884                                translate-x-full transform"
2885                                :class="{
2886                                    'translate-x-full h-0' : mobilePanelActiveId !== 'category-node-345',
2887                                    'translate-x-0 h-full z-10' : mobilePanelActiveId === 'category-node-345'
2888                                }"
2889                            >
2890                                <div class="absolute top-[-56px] flex items-center text-white font-semibold pl-6 md:pl-10"
2891                                     @click="mobilePanelActiveId = 0"
2892                                >
2893                                    <span class="pr-[89px] md:pr-[240px] box-border">
2894                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="13" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
2895                                    </span>
2896                                    <a class="flex items-center p-4 cursor-pointer text-white font-semibold">
2897                                        <span class="pr-3 box-border">
2898                                           <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M74.89 286.8c29.12-7 44.25-40.75 33.87-75.37C99.64 181 73.88 159.1 48.01 159.1c-3.625 0-7.24 .3849-10.86 1.26c-29.12 7-44.25 40.75-33.87 75.37c9.124 30.38 34.88 51.38 60.76 51.38C67.65 288 71.26 287.6 74.89 286.8zM318.5 190.6C322.1 191.5 325.7 192 329.3 192c27.75 0 56.16-26.88 66.66-65.25c11.87-43.38-3.625-85.25-34.5-93.37C357.9 32.5 354.3 32 350.7 32c-27.75 0-56.16 26.75-66.66 65.25C272.1 140.6 287.6 182.5 318.5 190.6zM474.9 161.3c-3.625-.875-7.24-1.26-10.86-1.26c-25.87 0-51.63 21.01-60.75 51.38c-10.37 34.63 4.75 68.37 33.87 75.37c3.625 .875 7.238 1.259 10.86 1.259c25.87 0 51.63-21.01 60.76-51.38C519.1 202 503.1 168.3 474.9 161.3zM182.7 192c3.625 0 7.207-.5006 10.83-1.376C224.4 182.5 239.9 140.6 228 97.25C217.5 58.88 189.1 32 161.3 32C157.7 32 154.1 32.5 150.5 33.38c-30.87 8.125-46.37 49.1-34.5 93.37C126.5 165.1 154.9 192 182.7 192zM256 224c-79.37 0-191.1 122.7-191.1 200.2C64.02 459.1 90.76 480 135.8 480C184.6 480 216.9 454.9 256 454.9C295.5 454.9 327.9 480 376.2 480c44.1 0 71.74-20.87 71.74-55.75C447.1 346.8 335.4 224 256 224zM399.7 427.1C398.9 428.1 392.1 432 376.2 432c-17.75 0-33.25-5.125-51.37-11.12c-19.87-6.5-42.37-14-68.87-14c-26.25 0-48.62 7.5-68.37 14C169.5 426.9 153.8 432 135.8 432c-15.87 0-22.62-3.875-23.37-4.625c-.125-.25-.375-1.25-.375-3.125C112 370.1 204.9 272 256 272s143.1 98.13 143.1 152.2C399.1 426.1 399.7 427.1 399.7 427.1z"/></svg>
2899                                        </span>
2900                                        Animaux                                    </a>
2901                                </div>
2902                                <div>
2903                                                                            <sp
2903an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2904                                              @click="
2905                                                      selected !== 'category-node-393'
2906                                                                ? selected = 'category-node-393' : selected = null;"
2907                                        >
2908                                                                                            <a title="Chien"
2909                                                   class="flex items-center w-full font-normal">
2910                                                    Chien                                                </a>
2911                                                <a class="flex cursor-pointer box-border transition"
2912                                                   :class="{'rotate-180': selected == 'category-node-393', 'rotate-0': selected == null}"
2913                                                >
2914                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2915                                                </a>
2916                                                                                    </span>
2917                                                                                    
2918                                            <div x-ref="container393"
2919                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2920                                                 :style="selected == 'category-node-393'
2921                                                                    ? 'max-height: ' + $refs.container393.scrollHeight + 'px' : ''"
2922                                            >
2923                                                <div class="border-l-2 border-opacity-10 border-gray">
2924                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/aliments"
2925                                                           title="Aliments"
2926                                                           class="flex items-center w-full px-4 py-3 font-normal">
2927                                                            Aliments                                                        </a>
2928                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/snacks"
2929                                                           title="Snacks"
2930                                                           class="flex items-center w-full px-4 py-3 font-normal">
2931                                                            Snacks                                                        </a>
2932                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/complements-alimentaires"
2933                                                           title="Compl&#xE9;ments&#x20;alimentaires"
2934                                                           class="flex items-center w-full px-4 py-3 font-normal">
2935                                                            Compléments alimentaires                                                        </a>
2936                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/jouets"
2937                                                           title="Jouets"
2938                                                           class="flex items-center w-full px-4 py-3 font-normal">
2939                                                            Jouets                                                        </a>
2940                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/colliers-et-laisse
2940s"
2941                                                           title="Colliers&#x20;et&#x20;laisses"
2942                                                           class="flex items-center w-full px-4 py-3 font-normal">
2943                                                            Colliers et laisses                                                        </a>
2944                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/medailles-pour-chiens"
2945                                                           title="M&#xE9;dailles&#x20;pour&#x20;chiens"
2946                                                           class="flex items-center w-full px-4 py-3 font-normal">
2947                                                            Médailles pour chiens                                                        </a>
2948                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/cages-coussins-transport"
2949                                                           title="Cages,&#x20;coussins&#x20;&amp;&#x20;transport"
2950                                                           class="flex items-center w-full px-4 py-3 font-normal">
2951                                                            Cages, coussins &amp; transport                                                        </a>
2952                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/mangeoires-abreuvoirs"
2953                                                           title="Mangeoires&#x20;&amp;&#x20;abreuvoirs"
2954                                                           class="flex items-center w-full px-4 py-3 font-normal">
2955                                                            Mangeoires &amp; abreuvoirs                                                        </a>
2956                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/produits-de-soin"
2957                                                           title="Produits&#x20;de&#x20;soin"
2958                                                           class="flex items-center w-full px-4 py-3 font-normal">
2959                                                            Produits de soin                                                        </a>
2960                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/cooling"
2961                                                           title="Cooling"
2962                                                           class="flex items-center w-full px-4 py-3 font-normal">
2963                                                            Cooling                                                        </a>
2964                                                                                                            <a href="https://www.aveve.be/fr/animaux/chien/visibilite-dans-l-obscurite"
2965                                                           title="Visibilit&#xE9;&#x20;dans&#x20;l&#x2019;obscurit&#xE9;"
2966                                                           class="flex items-center w-full px-4 py-3 font-normal">
2967                                                            Visibilité dans l’obscurité                                                        </a>
2968                                                                                                    </div>
2969
2970                                                <a href="https://www.aveve.be/fr/animaux/chien"
2971                                                   title="Chien"
2972                                                   class="flex items-center w-full text-primary font-normal mt-4">
2973                                                    Afficher tous les articles de Chien                                                </a>
2974                                            </div>
2975                                                                                                                    <sp
2975an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
2976                                              @click="
2977                                                      selected !== 'category-node-348'
2978                                                                ? selected = 'category-node-348' : selected = null;"
2979                                        >
2980                                                                                            <a title="Chat"
2981                                                   class="flex items-center w-full font-normal">
2982                                                    Chat                                                </a>
2983                                                <a class="flex cursor-pointer box-border transition"
2984                                                   :class="{'rotate-180': selected == 'category-node-348', 'rotate-0': selected == null}"
2985                                                >
2986                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
2987                                                </a>
2988                                                                                    </span>
2989                                                                                    
2990                                            <div x-ref="container348"
2991                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
2992                                                 :style="selected == 'category-node-348'
2993                                                                    ? 'max-height: ' + $refs.container348.scrollHeight + 'px' : ''"
2994                                            >
2995                                                <div class="border-l-2 border-opacity-10 border-gray">
2996                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/aliments"
2997                                                           title="Aliments"
2998                                                           class="flex items-center w-full px-4 py-3 font-normal">
2999                                                            Aliments                                                        </a>
3000                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/snacks"
3001                                                           title="Snacks"
3002                                                           class="flex items-center w-full px-4 py-3 font-normal">
3003                                                            Snacks                                                        </a>
3004                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/complements-alimentaires"
3005                                                           title="Compl&#xE9;ments&#x20;alimentaires"
3006                                                           class="flex items-center w-full px-4 py-3 font-normal">
3007                                                            Compléments alimentaires                                                        </a>
3008                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/litiere-pour-chats-bacs-a-litiere"
3009                                                           title="Liti&#xE8;re&#x20;pour&#x20;chats&#x20;&amp;&#x20;bacs&#x20;&#xE0;&#x20;liti&#xE8;re"
3010                                                           class="flex items-center w-full px-4 py-3 font-normal">
3011                                                            Litière pour chats &amp; bacs à litière                                                        </a>
3012                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/jouets"
3013                                                           title="Jouets"
3014                                                           class="flex items-center w-full px-4 py-3 font-normal">
3015                                                            Jouets                                                        </a>
3016                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/medailles-pour-chats"
3017                                                           title="M&#xE9;dailles&#x20;pour&#x20;chats"
3018                                                           class="flex items-center w-full px-4 py-3 font-normal">
3019                                                            Médailles pour chats                                                        </a>
3020                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/griffoirs-arbres-a-chats"
3021                                                           title="Griffoirs&#x20;&amp;&#x20;arbres&#x20;&#xE0;&#x20;chats"
3022                                                           class="flex items-center w-full px-4 py-3 font-normal">
3023                                                            Griffoirs &amp; arbres à chats                                                        </a>
3024                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/transport-coussins"
3025                                                           title="Trans
3025port&#x20;&amp;&#x20;coussins"
3026                                                           class="flex items-center w-full px-4 py-3 font-normal">
3027                                                            Transport &amp; coussins                                                        </a>
3028                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/mangeoires-abreuvoirs"
3029                                                           title="Mangeoires&#x20;&amp;&#x20;abreuvoirs"
3030                                                           class="flex items-center w-full px-4 py-3 font-normal">
3031                                                            Mangeoires &amp; abreuvoirs                                                        </a>
3032                                                                                                            <a href="https://www.aveve.be/fr/animaux/chat/produits-de-soin"
3033                                                           title="Produits&#x20;de&#x20;soin"
3034                                                           class="flex items-center w-full px-4 py-3 font-normal">
3035                                                            Produits de soin                                                        </a>
3036                                                                                                    </div>
3037
3038                                                <a href="https://www.aveve.be/fr/animaux/chat"
3039                                                   title="Chat"
3040                                                   class="flex items-center w-full text-primary font-normal mt-4">
3041                                                    Afficher tous les articles de Chat                                                </a>
3042                                            </div>
3043                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3044                                              @click="
3045                                                      selected !== 'category-node-441'
3046                                                                ? selected = 'category-node-441' : selected = null;"
3047                                        >
3048                                                                                            <a title="Poule"
3049                                                   class="flex items-center w-full font-normal">
3050                                                    Poule                                                </a>
3051                                                <a class="flex cursor-pointer box-border transition"
3052                                                   :class="{'rotate-180': selected == 'category-node-441', 'rotate-0': selected == null}"
3053                                                >
3054                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3055                                                </a>
3056                                                                                    </span>
3057                                                                                    
3058                                            <div x-ref="container441"
3059                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3060                                                 :style="selected == 'category-node-441'
3061                                                                    ? 'max-height: ' + $refs.container441.scrollHeight + 'px' : ''"
3062                                            >
3063                                                <div class="border-l-2 border-opacity-10 border-gray">
3064                                                                                                            <a href="https://www.aveve.be/fr/animaux/poule/aliments"
3065                                                           title="Aliments"
3066                                                           class="flex items-center w-full px-4 py-3 font-normal">
3067                                                            Aliments                                                        </a>
3068                                                                                                            <a href="https://www.aveve.be/fr/animaux/poule/snacks"
3069                                                           title="Snacks"
3070                                                           class="flex items-center w-full px-4 py-3 font-normal">
3071                                                            Snacks                                                        </a>
3072                                                                                                            <a href="https://www.aveve.be/fr/animaux/poule/poulaillers"
3073                                                           title="Poulaillers"
3074                                                           class="flex items-center w-full px-4 py-3 font-normal">
3075                                                            Poulaillers                                                        </a>
3076                                                                                                            <a href="https://www.aveve.be/fr/animaux/poule/mangeoires-abreuvoirs"
3077                                                           title="Mangeoires&#x20;&amp;&#x20;abreuvoirs"
3078                                                           class="flex items-center w-full px-4 py-3 font-normal">
3079                                                            Mangeoires &amp; abreuvoirs                                                        </a>
3080                                                                                                            <a href="https://www.aveve.be/fr/animaux/poule/produits-de-soin"
3081                                                           title="Produits&#x20;de&#x20;soin"
3082                                                           class="flex items-center w-full px-4 py-3 font-normal">
3083                                                            Produits de soin                                                        </a>
3084                                                                                                            <a href="https://www.aveve.be/fr/animaux/poule/litiere-pour-poules"
3085                                                           title="Liti&#xE8;re&#x20;pour&#x20;poules"
3086                                                           class="flex items-center w-full px-4 py-3 font-normal">
3087                                                            Litière pour poules                                                        </a>
3088                                                                                                    </div>
3089
3090                                                <a href="https://www.aveve.be/fr/animaux/poule"
3091                                                   title="Poule"
3092                                                   class="flex items-center w-full text-primary font-normal mt-4">
3093                                                    Afficher tous les articles de Poule                                                </a>
3094                                            </div>
3095                                                                                                                    <sp
3095an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3096                                              @click="
3097                                                      selected !== 'category-node-465'
3098                                                                ? selected = 'category-node-465' : selected = null;"
3099                                        >
3100                                                                                            <a title="Cheval"
3101                                                   class="flex items-center w-full font-normal">
3102                                                    Cheval                                                </a>
3103                                                <a class="flex cursor-pointer box-border transition"
3104                                                   :class="{'rotate-180': selected == 'category-node-465', 'rotate-0': selected == null}"
3105                                                >
3106                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3107                                                </a>
3108                                                                                    </span>
3109                                                                                    
3110                                            <div x-ref="container465"
3111                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3112                                                 :style="selected == 'category-node-465'
3113                                                                    ? 'max-height: ' + $refs.container465.scrollHeight + 'px' : ''"
3114                                            >
3115                                                <div class="border-l-2 border-opacity-10 border-gray">
3116                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/aliments-foin"
3117                                                           title="Aliments&#x20;&amp;&#x20;foin"
3118                                                           class="flex items-center w-full px-4 py-3 font-normal">
3119                                                            Aliments &amp; foin                                                        </a>
3120                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/snacks"
3121                                                           title="Snacks"
3122                                                           class="flex items-center w-full px-4 py-3 font-normal">
3123                                                            Snacks                                                        </a>
3124                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/complements-alimentaires"
3125                                                           title="Compl&#xE9;ments&#x20;alimentaires"
3126                                                           class="flex items-center w-full px-4 py-3 font-normal">
3127                                                            Compléments alimentaires                                                        </a>
3128                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/produits-de-soin"
3129                                                           title="Produits&#x20;de&#x20;soin"
3130                                                           class="flex items-center w-full px-4 py-3 font-normal">
3131                                                            Produits de soin                                                        </a>
3132                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/nettoyage"
3133                                                           title="Nettoyage"
3134                                                           class="flex items-center w-full px-4 py-3 font-normal">
3135                                                            Nettoyage                                                        </a>
3136                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/litiere-pour-chevaux"
3137                                                           title="Liti&#xE8;re&#x20;pour&#x20;chevaux"
3138                                                           class="flex items-center w-full px-4 py-3 font-normal">
3139                                                            Litière pour chevaux                                                        </a>
3140                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/materiel-d-ecurie"
3141                                                           title="Mat&#xE9;riel&#x20;d&#x2019;&#xE9;curie"
3142                                                           class="flex items-center w-full px-4 py-3 font-normal">
3143                                                            Matériel d’écurie                                                        </a>
3144                                                                                                            <a href="https://www.aveve.be/fr/animaux/cheval/accessoires"
3145                                                           title="Accessoires"
3146                                                           class="flex items-center w-full px-4 py-3 font-normal">
3147                                                            Accessoires                                                        </a>
3148                                                                                                    </div>
3149
3150                                                <a href="https://www.aveve.be/fr/animaux/cheval"
3151                                                   title="Cheval"
3152                                                   class="flex items-center w-full text-primary font-normal mt-4">
3153                                                    Afficher tous les articles de Cheval                                                </a>
3154                                            </div>
3155                                                                                                                    <sp
3155an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3156                                              @click="
3157                                                      selected !== 'category-node-498'
3158                                                                ? selected = 'category-node-498' : selected = null;"
3159                                        >
3160                                                                                            <a title="Lapins&#x20;&amp;&#x20;rongeurs"
3161                                                   class="flex items-center w-full font-normal">
3162                                                    Lapins &amp; rongeurs                                                </a>
3163                                                <a class="flex cursor-pointer box-border transition"
3164                                                   :class="{'rotate-180': selected == 'category-node-498', 'rotate-0': selected == null}"
3165                                                >
3166                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3167                                                </a>
3168                                                                                    </span>
3169                                                                                    
3170                                            <div x-ref="container498"
3171                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3172                                                 :style="selected == 'category-node-498'
3173                                                                    ? 'max-height: ' + $refs.container498.scrollHeight + 'px' : ''"
3174                                            >
3175                                                <div class="border-l-2 border-opacity-10 border-gray">
3176                                                                                                            <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs/aliments-foin"
3177                                                           title="Aliments&#x20;&amp;&#x20;foin"
3178                                                           class="flex items-center w-full px-4 py-3 font-normal">
3179                                                            Aliments &amp; foin                                                        </a>
3180                                                                                                            <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs/snacks"
3181                                                           title="Snacks"
3182                                                           class="flex items-center w-full px-4 py-3 font-normal">
3183                                                            Snacks                                                        </a>
3184                                                                                                            <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs/litiere-pour-lapins-rongeurs"
3185                                                           title="Liti&#xE8;re&#x20;pour&#x20;lapins&#x20;&amp;&#x20;rongeurs"
3186                                                           class="flex items-center w-full px-4 py-3 font-normal">
3187                                                            Litière pour lapins &amp; rongeurs                                                        </a>
3188                                                                                                            <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs/produits-de-soin"
3189                                                           title="Produits&#x20;de&#x20;soin"
3190                                                           class="flex items-center w-full px-4 py-3 font-normal">
3191                                                            Produits de soin                                                        </a>
3192                                                                                                            <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs/mangeoires-abreuvoirs"
3193                                                           title="Mangeoires&#x20;&amp;&#x20;abreuvoirs"
3194                                                           class="flex items-center w-full px-4 py-3 font-normal">
3195                                                            Mangeoires &amp; abreuvoirs                                                        </a>
3196                                                                                                            <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs/cages-pour-rongeurs"
3197                                                           title="Cages&#x20;pour&#x20;
3197rongeurs"
3198                                                           class="flex items-center w-full px-4 py-3 font-normal">
3199                                                            Cages pour rongeurs                                                        </a>
3200                                                                                                    </div>
3201
3202                                                <a href="https://www.aveve.be/fr/animaux/lapins-rongeurs"
3203                                                   title="Lapins&#x20;&amp;&#x20;rongeurs"
3204                                                   class="flex items-center w-full text-primary font-normal mt-4">
3205                                                    Afficher tous les articles de Lapins &amp; rongeurs                                                </a>
3206                                            </div>
3207                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3208                                              @click="
3209                                                      selected !== 'category-node-957'
3210                                                                ? selected = 'category-node-957' : selected = null;"
3211                                        >
3212                                                                                            <a title="Pigeons"
3213                                                   class="flex items-center w-full font-normal">
3214                                                    Pigeons                                                </a>
3215                                                <a class="flex cursor-pointer box-border transition"
3216                                                   :class="{'rotate-180': selected == 'category-node-957', 'rotate-0': selected == null}"
3217                                                >
3218                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3219                                                </a>
3220                                                                                    </span>
3221                                                                                    
3222                                            <div x-ref="container957"
3223                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3224                                                 :style="selected == 'category-node-957'
3225                                                                    ? 'max-height: ' + $refs.container957.scrollHeight + 'px' : ''"
3226                                            >
3227                                                <div class="border-l-2 border-opacity-10 border-gray">
3228                                                                                                            <a href="https://www.aveve.be/fr/animaux/pigeons/aliments"
3229                                                           title="Aliments"
3230                                                           class="flex items-center w-full px-4 py-3 font-normal">
3231                                                            Aliments                                                        </a>
3232                                                                                                            <a href="https://www.aveve.be/fr/animaux/pigeons/supplements"
3233                                                           title="Suppl&#xE9;ments"
3234                                                           class="flex items-center w-full px-4 py-3 font-normal">
3235                                                            Suppléments                                                        </a>
3236                                                                                                            <a href="https://www.aveve.be/fr/animaux/pigeons/accessoires"
3237                                                           title="Accessoires"
3238                                                           class="flex items-center w-full px-4 py-3 font-normal">
3239                                                            Accessoires                                                        </a>
3240                                                                                                    </div>
3241
3242                                                <a href="https://www.aveve.be/fr/animaux/pigeons"
3243                                                   title="Pigeons"
3244                                                   class="flex items-center w-full text-primary font-normal mt-4">
3245                                                    Afficher tous les articles de Pigeons                                                </a>
3246                                            </div>
3247                                                                                                                    <sp
3247an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3248                                              @click="
3249                                                      selected !== 'category-node-519'
3250                                                                ? selected = 'category-node-519' : selected = null;"
3251                                        >
3252                                                                                            <a title="Moutons&#x20;&amp;&#x20;petits&#x20;animaux&#x20;de&#x20;la&#x20;ferme"
3253                                                   class="flex items-center w-full font-normal">
3254                                                    Moutons &amp; petits animaux de la ferme                                                </a>
3255                                                <a class="flex cursor-pointer box-border transition"
3256                                                   :class="{'rotate-180': selected == 'category-node-519', 'rotate-0': selected == null}"
3257                                                >
3258                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3259                                                </a>
3260                                                                                    </span>
3261                                                                                    
3262                                            <div x-ref="container519"
3263                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3264                                                 :style="selected == 'category-node-519'
3265                                                                    ? 'max-height: ' + $refs.container519.scrollHeight + 'px' : ''"
3266                                            >
3267                                                <div class="border-l-2 border-opacity-10 border-gray">
3268                                                                                                            <a href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme/aliments"
3269                                                           title="Aliments"
3270                                                           class="flex items-center w-full px-4 py-3 font-normal">
3271                                                            Aliments                                                        </a>
3272                                                                                                            <a href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme/snacks"
3273                                                           title="Snacks"
3274                                                           class="flex items-center w-full px-4 py-3 font-normal">
3275                                                            Snacks                                                        </a>
3276                                                                                                            <a href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme/produits-de-soin"
3277                                                           title="Produits&#x20;de&#x20;soin"
3278                                                           class="flex items-center w-full px-4 py-3 font-normal">
3279                                                            Produits de soin                                                        </a>
3280                                                                                                    </div>
3281
3282                                                <a href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme"
3283                                                   title="Moutons&#x20;&amp;&#x20;petits&#x20;animaux&#x20;de&#x20;la&#x20;ferme"
3284                                                   class="flex items-center w-full text-primary font-normal mt-4">
3285                                                    Afficher tous les articles de Moutons &amp; petits animaux de la ferme                                                </a>
3286                                            </div>
3287                                                                                                                    <sp
3287an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3288                                              @click="
3289                                                      selected !== 'category-node-543'
3290                                                                ? selected = 'category-node-543' : selected = null;"
3291                                        >
3292                                                                                            <a title="Oiseaux&#x20;d&#x2019;ornement"
3293                                                   class="flex items-center w-full font-normal">
3294                                                    Oiseaux d’ornement                                                </a>
3295                                                <a class="flex cursor-pointer box-border transition"
3296                                                   :class="{'rotate-180': selected == 'category-node-543', 'rotate-0': selected == null}"
3297                                                >
3298                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3299                                                </a>
3300                                                                                    </span>
3301                                                                                    
3302                                            <div x-ref="container543"
3303                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3304                                                 :style="selected == 'category-node-543'
3305                                                                    ? 'max-height: ' + $refs.container543.scrollHeight + 'px' : ''"
3306                                            >
3307                                                <div class="border-l-2 border-opacity-10 border-gray">
3308                                                                                                            <a href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/aliments"
3309                                                           title="Aliments"
3310                                                           class="flex items-center w-full px-4 py-3 font-normal">
3311                                                            Aliments                                                        </a>
3312                                                                                                            <a href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/snacks"
3313                                                           title="Snacks"
3314                                                           class="flex items-center w-full px-4 py-3 font-normal">
3315                                                            Snacks                                                        </a>
3316                                                                                                            <a href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/couvre-sol-pour-cage"
3317                                                           title="Couvre&#x20;sol&#x20;pour&#x20;cage"
3318                                                           class="flex items-center w-full px-4 py-3 font-normal">
3319                                                            Couvre sol pour cage                                                        </a>
3320                                                                                                            <a href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/produits-de-soin"
3321                                                           title="Produits&#x20;de&#x20;soin"
3322                                                           class="flex items-center w-full px-4 py-3 font-normal">
3323                                                            Produits de soin                                                        </a>
3324                                                                                                            <a href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/cages-accessoires"
3325                                                           title="Cages&#x20;&amp;&#x20;accessoires"
3326                                                           class="flex items-center w-full px-4 py-3 font-normal">
3327                                                            Cages &amp; accessoires                                                        </a>
3328                                                                                                    </div>
3329
3330                                                <a href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement"
3331                                                   title="Oiseaux&#x20;d&#x2019;ornement"
3332                                                   class="flex items-center w-full text-primary font-normal mt-4">
3333                                                    Afficher tous les articles de Oiseaux d’ornement                                                </a>
3334                                            </div>
3335                                                                                                                    <sp
3335an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3336                                              @click="
3337                                                      selected !== 'category-node-192'
3338                                                                ? selected = 'category-node-192' : selected = null;"
3339                                        >
3340                                                                                            <a title="Animaux&#x20;du&#x20;jardin"
3341                                                   class="flex items-center w-full font-normal">
3342                                                    Animaux du jardin                                                </a>
3343                                                <a class="flex cursor-pointer box-border transition"
3344                                                   :class="{'rotate-180': selected == 'category-node-192', 'rotate-0': selected == null}"
3345                                                >
3346                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3347                                                </a>
3348                                                                                    </span>
3349                                                                                    
3350                                            <div x-ref="container192"
3351                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3352                                                 :style="selected == 'category-node-192'
3353                                                                    ? 'max-height: ' + $refs.container192.scrollHeight + 'px' : ''"
3354                                            >
3355                                                <div class="border-l-2 border-opacity-10 border-gray">
3356                                                                                                            <a href="https://www.aveve.be/fr/animaux/animaux-du-jardin/aliments-et-snacks"
3357                                                           title="Aliments&#x20;et&#x20;snacks"
3358                                                           class="flex items-center w-full px-4 py-3 font-normal">
3359                                                            Aliments et snacks                                                        </a>
3360                                                                                                            <a href="https://www.aveve.be/fr/animaux/animaux-du-jardin/systemes-d-alimentation"
3361                                                           title="Syst&#xE8;mes&#x20;d&#x2019;alimentation"
3362                                                           class="flex items-center w-full px-4 py-3 font-normal">
3363                                                            Systèmes d’alimentation                                                        </a>
3364                                                                                                            <a href="https://www.aveve.be/fr/animaux/animaux-du-jardin/abris"
3365                                                           title="Abris"
3366                                                           class="flex items-center w-full px-4 py-3 font-normal">
3367                                                            Abris                                                        </a>
3368                                                                                                    </div>
3369
3370                                                <a href="https://www.aveve.be/fr/animaux/animaux-du-jardin"
3371                                                   title="Animaux&#x20;du&#x20;jardin"
3372                                                   class="flex items-center w-full text-primary font-normal mt-4">
3373                                                    Afficher tous les articles de Animaux du jardin                                                </a>
3374                                            </div>
3375                                                                                                                    <sp
3375an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3376                                              @click="
3377                                                      selected !== 'category-node-561'
3378                                                                ? selected = 'category-node-561' : selected = null;"
3379                                        >
3380                                                                                            <a title="Poissons"
3381                                                   class="flex items-center w-full font-normal">
3382                                                    Poissons                                                </a>
3383                                                <a class="flex cursor-pointer box-border transition"
3384                                                   :class="{'rotate-180': selected == 'category-node-561', 'rotate-0': selected == null}"
3385                                                >
3386                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3387                                                </a>
3388                                                                                    </span>
3389                                                                                    
3390                                            <div x-ref="container561"
3391                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3392                                                 :style="selected == 'category-node-561'
3393                                                                    ? 'max-height: ' + $refs.container561.scrollHeight + 'px' : ''"
3394                                            >
3395                                                <div class="border-l-2 border-opacity-10 border-gray">
3396                                                                                                            <a href="https://www.aveve.be/fr/animaux/poissons/aliments"
3397                                                           title="Aliments"
3398                                                           class="flex items-center w-full px-4 py-3 font-normal">
3399                                                            Aliments                                                        </a>
3400                                                                                                    </div>
3401
3402                                                <a href="https://www.aveve.be/fr/animaux/poissons"
3403                                                   title="Poissons"
3404                                                   class="flex items-center w-full text-primary font-normal mt-4">
3405                                                    Afficher tous les articles de Poissons                                                </a>
3406                                            </div>
3407                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3408                                              @click="
3409                                                      selected !== 'category-node-495'
3410                                                                ? selected = 'category-node-495' : selected = null;"
3411                                        >
3412                                                                                            <a title="Cl&#xF4;tures&#x20;pour&#x20;prairies"
3413                                                   class="flex items-center w-full font-normal">
3414                                                    Clôtures pour prairies                                                </a>
3415                                                <a class="flex cursor-pointer box-border transition"
3416                                                   :class="{'rotate-180': selected == 'category-node-495', 'rotate-0': selected == null}"
3417                                                >
3418                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3419                                                </a>
3420                                                                                    </span>
3421                                                                                    
3422                                            <div x-ref="container495"
3423                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3424                                                 :style="selected == 'category-node-495'
3425                                                                    ? 'max-height: ' + $refs.container495.scrollHeight + 'px' : ''"
3426                                            >
3427                                                <div class="border-l-2 border-opacity-10 border-gray">
3428                                                                                                            <a href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/poteau-de-cloture"
3429                                                           title="Poteau&#x20;de&#x20;cl&#xF4;ture"
3430                                                           class="flex items-center w-full px-4 py-3 font-normal">
3431                                                            Poteau de clôture                                                        </a>
3432                                                                                                            <a href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/batteries-piles"
3433                                                           title="Batteries&#x20;&amp;&#x20;piles"
3434                                                           class="flex items-center w-full px-4 py-3 font-normal">
3435                                                            Batteries &amp; piles                                                        </a>
3436                                                                                                            <a href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/isolateurs"
3437                                                           title="Isolateurs"
3438                                                           class="flex items-center w-full px-4 py-3 font-normal">
3439                                                            Isolateurs                                                        </a>
3440                                                                                                            <a href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/poignees-de-porte"
3441                                                           title="Poign&#xE9;es&#x20;de&#x20;porte"
3442                                                           class="flex items-center w-full px-4 py-3 font-normal">
3443                                                            Poignées de porte                                                        </a>
3444                                                                                                            <a href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/ruban-fil-electrique"
3445                                                           title="Ruban&#x20;&amp;&#x20;fil&#x20;&#xE9;lectrique"
3446                                                           class="flex items-center w-full px-4 py-3 font-normal">
3447                                                            Ruban &amp; fil électrique                                                        </a>
3448                                                                                                    </div>
3449
3450                                                <a href="https://www.aveve.be/fr/animaux/clotures-pour-prairies"
3451                                                   title="Cl&#xF4;tures&#x20;pour&#x20;prairies"
3452                                                   class="flex items-center w-full text-primary font-normal mt-4">
3453                                                    Afficher tous les articles de Clôtures pour prairies                                                </a>
3454                                            </div>
3455                                                                                                            </div>
3456                            </div>
3457                                            </div>
3458                                    <div class="level-0 w-full first:pt-2">
3459                        <span class="flex items-center transition-transform duration-150 ease-in-out transform"
3460                            :class="{
3461                                '-translate-x-full h-0' : mobilePanelActiveId,
3462                                'translate-x-0 h-full' : !mobilePanelActiveId
3463                            }"
3464                            @click="mobilePanelActiveId =
3465                                    mobilePanelActiveId === 'category-node-570' ?
3466                                    0 : 'category-node-570';
3467                                    "
3468                        >
3469                            <a class="flex items-center w-full p-4 pr-0 cursor-pointer font-normal bg-white level-0"
3470                               title="D&#xE9;lices">
3471                                <span class="pr-5 box-border">
3472                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M448 71.3C448 71.53 448 71.77 448 72V488C448 494.4 445.5 500.5 440.1 504.1C436.5 509.5 430.4 512 424 512C417.6 512 411.5 509.5 407 504.1C402.5 500.5 400 494.4 400 488V352H351.2C342.8 352 334.4 350.3 326.6 347.1C318.9 343.8 311.8 339.1 305.8 333.1C299.9 327.1 295.2 320 291.1 312.2C288.8 304.4 287.2 296 287.2 287.6L288 173.8C287.1 136.9 299.1 100.8 319.7 70.28C340.4 39.71 369.8 16.04 404.1 2.336C407.9 .7942 411.9 .001 416 .0003C424.5 .0003 432.6 3.372 438.6 9.373C444.6 15.37 448 23.51 448 32V71.3zM400 58.08C380.4 70.33 364.2 87.39 352.1 107.6C341.8 127.9 335.9 150.7 336 173.8L335.2 288C335.2 292.2 336.9 296.3 339.9 299.3C342.9 302.3 346.1 304 351.2 304H399L400 58.08zM240.1 7.029C245.5 11.53 248 17.63 248 24V184C247.1 207.3 238.7 229.7 222.2 246.2C205.7 262.7 183.3 271.1 160 272H152V488C152 494.4 149.5 500.5 144.1 504.1C140.5 509.5 134.4 512 128 512C121.6 512 115.5 509.5 111 504.1C106.5 500.5 104 494.4 104 488V272H96C72.67 271.1 50.29 262.7 33.79 246.2C17.29 229.7 8.017 207.3 8 184V24C8 17.63 10.53 11.53 15.03 7.029C19.53 2.529 25.63 0 32 0C38.37 0 44.47 2.529 48.97 7.029C53.47 11.53 56 17.63 56 24V144H104V25.6C104 19.23 106.5 13.13 111 8.629C115.5 4.129 121.6 1.6 128 1.6C134.4 1.6 140.5 4.129 144.1 8.629C149.5 13.13 152 19.23 152 25.6V144H200V24C200 17.63 202.5 11.53 207 7.029C211.5 2.529 217.6 0 224 0C230.4 0 236.5 2.529 240.1 7.029zM184.9 214.9C191.9 209 196.7 200.1 198.4 192H57.6C59.32 200.1 64.08 209 71.08 214.9C78.08 220.7 86.89 223.9 96 224H160C169.1 223.9 177.9 220.7 184.9 214.9z"/></svg>
3473                                </span>
3474                                <span class="pr-1 box-border">
3475                                    Délices                                </span>
3476                            </a>
3477                                                            <a class="flex pr-6 cursor-pointer box-border">
3478                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
3479                                </a>
3480                                                    </span>
3481                                                    <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
3482                                translate-x-full transform"
3483                                :class="{
3484                                    'translate-x-full h-0' : mobilePanelActiveId !== 'category-node-570',
3485                                    'translate-x-0 h-full z-10' : mobilePanelActiveId === 'category-node-570'
3486                                }"
3487                            >
3488                                <div class="absolute top-[-56px] flex items-center text-white font-semibold pl-6 md:pl-10"
3489                                     @click="mobilePanelActiveId = 0"
3490                                >
3491                                    <span class="pr-[89px] md:pr-[240px] box-border">
3492                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="13" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
3493                                    </span>
3494                                    <a class="flex items-center p-4 cursor-pointer text-white font-semibold">
3495                                        <span class="pr-3 box-border">
3496                                           <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M448 71.3C448 71.53 448 71.77 448 72V488C448 494.4 445.5 500.5 440.1 504.1C436.5 509.5 430.4 512 424 512C417.6 512 411.5 509.5 407 504.1C402.5 500.5 400 494.4 400 488V352H351.2C342.8 352 334.4 350.3 326.6 347.1C318.9 343.8 311.8 339.1 305.8 333.1C299.9 327.1 295.2 320 291.1 312.2C288.8 304.4 287.2 296 287.2 287.6L288 173.8C287.1 136.9 299.1 100.8 319.7 70.28C340.4 39.71 369.8 16.04 404.1 2.336C407.9 .7942 411.9 .001 416 .0003C424.5 .0003 432.6 3.372 438.6 9.373C444.6 15.37 448 23.51 448 32V71.3zM400 58.08C380.4 70.33 364.2 87.39 352.1 107.6C341.8 127.9 335.9 150.7 336 173.8L335.2 288C335.2 292.2 336.9 296.3 339.9 299.3C342.9 302.3 346.1 304 351.2 304H399L400 58.08zM240.1 7.029C245.5 11.53 248 17.63 248 24V184C247.1 207.3 238.7 229.7 222.2 246.2C205.7 262.7 183.3 271.1 160 272H152V488C152 494.4 149.5 500.5 144.1 504.1C140.5 509.5 134.4 512 128 512C121.6 512 115.5 509.5 111 504.1C106.5 500.5 104 494.4 104 488V272H96C72.67 271.1 50.29 262.7 33.79 246.2C17.29 229.7 8.017 207.3 8 184V24C8 17.63 10.53 11.53 15.03 7.029C19.53 2.529 25.63 0 32 0C38.37 0 44.47 2.529 48.97 7.029C53.47 11.53 56 17.63 56 24V144H104V25.6C104 19.23 106.5 13.13 111 8.629C115.5 4.129 121.6 1.6 128 1.6C134.4 1.6 140.5 4.129 144.1 8.629C149.5 13.13 152 19.23 152 25.6V144H200V24C200 17.63 202.5 11.53 207 7.029C211.5 2.529 217.6 0 224 0C230.4 0 236.5 2.529 240.1 7.029zM184.9 214.9C191.9 209 196.7 200.1 198.4 192H57.6C59.32 200.1 64.08 209 71.08 214.9C78.08 220.7 86.89 223.9 96 224H160C169.1 223.9 177.9 220.7 184.9 214.9z"/></svg>
3497                                        </span>
3498                                        Délices                                    </a>
3499                                </div>
3500                                <div>
3501                                                                            <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3502                                              @click="
3503                                                      selected !== 'category-node-591'
3504                                                                ? selected = 'category-node-591' : selected = null;"
3505                                        >
3506                                                                                            <a title="Pain"
3507                                                   class="flex items-center w-full font-normal">
3508                                                    Pain                                                </a>
3509                                                <a class="flex cursor-pointer box-border transition"
3510                                                   :class="{'rotate-180': selected == 'category-node-591', 'rotate-0': selected == null}"
3511                                                >
3512                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3513                                                </a>
3514                                                                                    </span>
3515                                                                                    
3516                                            <div x-ref="container591"
3517                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3518                                                 :style="selected == 'category-node-591'
3519                                                                    ? 'max-height: ' + $refs.container591.scrollHeight + 'px' : ''"
3520                                            >
3521                                                <div class="border-l-2 border-opacity-10 border-gray">
3522                                                                                                            <a href="https://www.aveve.be/fr/delices/pain/mix-all-in-pour-pains"
3523                                                           title="Mix&#x20;All-In&#x20;pour&#x20;pains"
3524                                                           class="flex items-center w-full px-4 py-3 font-normal">
3525                                                            Mix All-In pour pains                                                        </a>
3526                                                                                                            <a href="https://www.aveve.be/fr/delices/pain/mix-pour-pains-de-la-gamme-classic"
3527                                                           title="Mix&#x20;pour&#x20;pains&#x20;de&#x20;la&#x20;gamme&#x20;classic"
3528                                                           class="flex items-center w-full px-4 py-3 font-normal">
3529                                                            Mix pour pains de la gamme classic                                                        </a>
3530                                                                                                            <a href="https://www.aveve.be/fr/delices/pain/mix-pour-pains-bios"
3531                                                           title="Mix&#x20;pour&#x20;pains&#x20;bios"
3532                                                           class="flex items-center w-full px-4 py-3 font-normal">
3533                                                            Mix pour pains bios                                                        </a>
3534                                                                                                            <a href="https://www.aveve.be/fr/delices/pain/farines-adjuvants"
3535                                                           title="Farines&#x20;&amp;&#x20;adjuvants"
3536                                                           class="flex items-center w-full px-4 py-3 font-normal">
3537                                                            Farines &amp; adjuvants                                                        </a>
3538                                                                                                    </div>
3539
3540                                                <a href="https://www.aveve.be/fr/delices/pain"
3541                                                   title="Pain"
3542                                                   class="flex items-center w-full text-primary font-normal mt-4">
3543                                                    Afficher tous les articles de Pain                                                </a>
3544                                            </div>
3545                                                                                                                    <sp
3545an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3546                                              @click="
3547                                                      selected !== 'category-node-609'
3548                                                                ? selected = 'category-node-609' : selected = null;"
3549                                        >
3550                                                                                            <a title="P&#xE2;tisseries&#x20;&amp;&#x20;desserts"
3551                                                   class="flex items-center w-full font-normal">
3552                                                    Pâtisseries &amp; desserts                                                </a>
3553                                                <a class="flex cursor-pointer box-border transition"
3554                                                   :class="{'rotate-180': selected == 'category-node-609', 'rotate-0': selected == null}"
3555                                                >
3556                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3557                                                </a>
3558                                                                                    </span>
3559                                                                                    
3560                                            <div x-ref="container609"
3561                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3562                                                 :style="selected == 'category-node-609'
3563                                                                    ? 'max-height: ' + $refs.container609.scrollHeight + 'px' : ''"
3564                                            >
3565                                                <div class="border-l-2 border-opacity-10 border-gray">
3566                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/cakes"
3567                                                           title="Cakes"
3568                                                           class="flex items-center w-full px-4 py-3 font-normal">
3569                                                            Cakes                                                        </a>
3570                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/crepes"
3571                                                           title="Cr&#xEA;pes"
3572                                                           class="flex items-center w-full px-4 py-3 font-normal">
3573                                                            Crêpes                                                        </a>
3574                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/gaufres"
3575                                                           title="Gaufres"
3576                                                           class="flex items-center w-full px-4 py-3 font-normal">
3577                                                            Gaufres                                                        </a>
3578                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/gateaux-biscuits"
3579                                                           title="G&#xE2;teaux&#x20;&amp;&#x20;biscuits"
3580                                                           class="flex items-center w-full px-4 py-3 font-normal">
3581                                                            Gâteaux &amp; biscuits                                                        </a>
3582                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/cookie
3582s"
3583                                                           title="Cookies"
3584                                                           class="flex items-center w-full px-4 py-3 font-normal">
3585                                                            Cookies                                                        </a>
3586                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/autres-melanges-a-patisserie"
3587                                                           title="Autres&#x20;m&#xE9;langes&#x20;&#xE0;&#x20;p&#xE2;tisserie"
3588                                                           class="flex items-center w-full px-4 py-3 font-normal">
3589                                                            Autres mélanges à pâtisserie                                                        </a>
3590                                                                                                            <a href="https://www.aveve.be/fr/delices/patisseries-desserts/sans-gluten-sans-sucre"
3591                                                           title="Sans&#x20;gluten&#x20;&amp;&#x20;sans&#x20;sucre"
3592                                                           class="flex items-center w-full px-4 py-3 font-normal">
3593                                                            Sans gluten &amp; sans sucre                                                        </a>
3594                                                                                                    </div>
3595
3596                                                <a href="https://www.aveve.be/fr/delices/patisseries-desserts"
3597                                                   title="P&#xE2;tisseries&#x20;&amp;&#x20;desserts"
3598                                                   class="flex items-center w-full text-primary font-normal mt-4">
3599                                                    Afficher tous les articles de Pâtisseries &amp; desserts                                                </a>
3600                                            </div>
3601                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3602                                              @click="
3603                                                      selected !== 'category-node-615'
3604                                                                ? selected = 'category-node-615' : selected = null;"
3605                                        >
3606                                                                                            <a title="Ingr&#xE9;dients&#x20;boulangerie-p&#xE2;tisserie"
3607                                                   class="flex items-center w-full font-normal">
3608                                                    Ingrédients boulangerie-pâtisserie                                                </a>
3609                                                <a class="flex cursor-pointer box-border transition"
3610                                                   :class="{'rotate-180': selected == 'category-node-615', 'rotate-0': selected == null}"
3611                                                >
3612                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3613                                                </a>
3614                                                                                    </span>
3615                                                                                    
3616                                            <div x-ref="container615"
3617                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3618                                                 :style="selected == 'category-node-615'
3619                                                                    ? 'max-height: ' + $refs.container615.scrollHeight + 'px' : ''"
3620                                            >
3621                                                <div class="border-l-2 border-opacity-10 border-gray">
3622                                                                                                            <a href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/sucre-chocolat"
3623                                                           title="Sucre&#x20;&amp;&#x20;chocolat"
3624                                                           class="flex items-center w-full px-4 py-3 font-normal">
3625                                                            Sucre &amp; chocolat                                                        </a>
3626                                                                                                            <a href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/colorants-et-aromes"
3627                                                           title="Colorants&#x20;et&#x20;ar&#xF4;mes"
3628                                                           class="flex items-center w-full px-4 py-3 font-normal">
3629                                                            Colorants et arômes                                                        </a>
3630                                                                                                            <a href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/garnitures-nappages"
3631                                                           title="Garnitures&#x20;&amp;&#x20;nappages"
3632                                                           class="flex items-center w-full px-4 py-3 font-normal">
3633                                                            Garnitures &amp; nappages                                                        </a>
3634                                                                                                            <a href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/levure-poudre-a-lever-spray-de-cuisson"
3635                                                           title="Levure,&#x20;poudre&#x20;&#xE0;&#x20;lever&#x20;&amp;&#x20;spray&#x20;de&#x20;cuisson"
3636                                                           class="flex items-center w-full px-4 py-3 font-normal">
3637                                                            Levure, poudre à lever &amp; spray de cuisson                                                        </a>
3638                                                                                                            <a href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/noix-noyaux-graines"
3639                                                           title="Noix,&#x20;noyaux&#x20;&amp;&#x20;graines"
3640                                                           class="flex items-center w-full px-4 py-3 font-normal">
3641                                                            Noix, noyaux &amp;
3641 graines                                                        </a>
3642                                                                                                    </div>
3643
3644                                                <a href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie"
3645                                                   title="Ingr&#xE9;dients&#x20;boulangerie-p&#xE2;tisserie"
3646                                                   class="flex items-center w-full text-primary font-normal mt-4">
3647                                                    Afficher tous les articles de Ingrédients boulangerie-pâtisserie                                                </a>
3648                                            </div>
3649                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3650                                              @click="
3651                                                      selected !== 'category-node-639'
3652                                                                ? selected = 'category-node-639' : selected = null;"
3653                                        >
3654                                                                                            <a title="Produits&#x20;r&#xE9;gionaux"
3655                                                   class="flex items-center w-full font-normal">
3656                                                    Produits régionaux                                                </a>
3657                                                <a class="flex cursor-pointer box-border transition"
3658                                                   :class="{'rotate-180': selected == 'category-node-639', 'rotate-0': selected == null}"
3659                                                >
3660                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3661                                                </a>
3662                                                                                    </span>
3663                                                                                    
3664                                            <div x-ref="container639"
3665                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3666                                                 :style="selected == 'category-node-639'
3667                                                                    ? 'max-height: ' + $refs.container639.scrollHeight + 'px' : ''"
3668                                            >
3669                                                <div class="border-l-2 border-opacity-10 border-gray">
3670                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-regionaux/sale"
3671                                                           title="Sal&#xE9;"
3672                                                           class="flex items-center w-full px-4 py-3 font-normal">
3673                                                            Salé                                                        </a>
3674                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-regionaux/sucre"
3675                                                           title="Sucr&#xE9;"
3676                                                           class="flex items-center w-full px-4 py-3 font-normal">
3677                                                            Sucré                                                        </a>
3678                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-regionaux/boissons"
3679                                                           title="Boissons"
3680                                                           class="flex items-center w-full px-4 py-3 font-normal">
3681                                                            Boissons                                                        </a>
3682                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-regionaux/petit-dejeuner"
3683                                                           title="Petit-d&#xE9;jeuner"
3684                                                           class="flex items-center w-full px-4 py-3 font-normal">
3685                                                            Petit-déjeuner                                                        </a>
3686                                                                                                    </div>
3687
3688                                                <a href="https://www.aveve.be/fr/delices/produits-regionaux"
3689                                                   title="Produits&#x20;r&#xE9;gionaux"
3690                                                   class="flex items-center w-full text-primary font-normal mt-4">
3691                                                    Afficher tous les articles de Produits régionaux                                                </a>
3692                                            </div>
3693                                                                                                                    <sp
3693an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3694                                              @click="
3695                                                      selected !== 'category-node-871'
3696                                                                ? selected = 'category-node-871' : selected = null;"
3697                                        >
3698                                                                                            <a title="Electro"
3699                                                   class="flex items-center w-full font-normal">
3700                                                    Electro                                                </a>
3701                                                <a class="flex cursor-pointer box-border transition"
3702                                                   :class="{'rotate-180': selected == 'category-node-871', 'rotate-0': selected == null}"
3703                                                >
3704                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3705                                                </a>
3706                                                                                    </span>
3707                                                                                    
3708                                            <div x-ref="container871"
3709                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3710                                                 :style="selected == 'category-node-871'
3711                                                                    ? 'max-height: ' + $refs.container871.scrollHeight + 'px' : ''"
3712                                            >
3713                                                <div class="border-l-2 border-opacity-10 border-gray">
3714                                                                                                            <a href="https://www.aveve.be/fr/delices/electro/machines-a-pain"
3715                                                           title="Machines&#x20;&#xE0;&#x20;pain"
3716                                                           class="flex items-center w-full px-4 py-3 font-normal">
3717                                                            Machines à pain                                                        </a>
3718                                                                                                            <a href="https://www.aveve.be/fr/delices/electro/gaufrier"
3719                                                           title="Gaufrier"
3720                                                           class="flex items-center w-full px-4 py-3 font-normal">
3721                                                            Gaufrier                                                        </a>
3722                                                                                                            <a href="https://www.aveve.be/fr/delices/electro/electro-divers"
3723                                                           title="&#xC9;lectro&#x20;divers"
3724                                                           class="flex items-center w-full px-4 py-3 font-normal">
3725                                                            Électro divers                                                        </a>
3726                                                                                                    </div>
3727
3728                                                <a href="https://www.aveve.be/fr/delices/electro"
3729                                                   title="Electro"
3730                                                   class="flex items-center w-full text-primary font-normal mt-4">
3731                                                    Afficher tous les articles de Electro                                                </a>
3732                                            </div>
3733                                                                                                                    <sp
3733an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3734                                              @click="
3735                                                      selected !== 'category-node-826'
3736                                                                ? selected = 'category-node-826' : selected = null;"
3737                                        >
3738                                                                                            <a title="D&#xE9;coration&#x20;de&#x20;p&#xE2;tisserie"
3739                                                   class="flex items-center w-full font-normal">
3740                                                    Décoration de pâtisserie                                                </a>
3741                                                <a class="flex cursor-pointer box-border transition"
3742                                                   :class="{'rotate-180': selected == 'category-node-826', 'rotate-0': selected == null}"
3743                                                >
3744                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3745                                                </a>
3746                                                                                    </span>
3747                                                                                    
3748                                            <div x-ref="container826"
3749                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3750                                                 :style="selected == 'category-node-826'
3751                                                                    ? 'max-height: ' + $refs.container826.scrollHeight + 'px' : ''"
3752                                            >
3753                                                <div class="border-l-2 border-opacity-10 border-gray">
3754                                                                                                            <a href="https://www.aveve.be/fr/delices/decoration-de-patisserie/deco-comestible-pour-patisserie"
3755                                                           title="D&#xE9;co&#x20;comestible&#x20;pour&#x20;p&#xE2;tisserie"
3756                                                           class="flex items-center w-full px-4 py-3 font-normal">
3757                                                            Déco comestible pour pâtisserie                                                        </a>
3758                                                                                                            <a href="https://www.aveve.be/fr/delices/decoration-de-patisserie/deco-non-comestible-pour-patisserie"
3759                                                           title="D&#xE9;co&#x20;non&#x20;comestible&#x20;pour&#x20;p&#xE2;tisserie"
3760                                                           class="flex items-center w-full px-4 py-3 font-normal">
3761                                                            Déco non comestible pour pâtisserie                                                        </a>
3762                                                                                                    </div>
3763
3764                                                <a href="https://www.aveve.be/fr/delices/decoration-de-patisserie"
3765                                                   title="D&#xE9;coration&#x20;de&#x20;p&#xE2;tisserie"
3766                                                   class="flex items-center w-full text-primary font-normal mt-4">
3767                                                    Afficher tous les articles de Décoration de pâtisserie                                                </a>
3768                                            </div>
3769                                                                                                                    <sp
3769an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3770                                              @click="
3771                                                      selected !== 'category-node-651'
3772                                                                ? selected = 'category-node-651' : selected = null;"
3773                                        >
3774                                                                                            <a title="Produits&#x20;surgel&#xE9;s"
3775                                                   class="flex items-center w-full font-normal">
3776                                                    Produits surgelés                                                </a>
3777                                                <a class="flex cursor-pointer box-border transition"
3778                                                   :class="{'rotate-180': selected == 'category-node-651', 'rotate-0': selected == null}"
3779                                                >
3780                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3781                                                </a>
3782                                                                                    </span>
3783                                                                                    
3784                                            <div x-ref="container651"
3785                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3786                                                 :style="selected == 'category-node-651'
3787                                                                    ? 'max-height: ' + $refs.container651.scrollHeight + 'px' : ''"
3788                                            >
3789                                                <div class="border-l-2 border-opacity-10 border-gray">
3790                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-surgeles/tartes-patisseries"
3791                                                           title="Tartes&#x20;&amp;&#x20;p&#xE2;tisseries"
3792                                                           class="flex items-center w-full px-4 py-3 font-normal">
3793                                                            Tartes &amp; pâtisseries                                                        </a>
3794                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-surgeles/pain"
3795                                                           title="Pain"
3796                                                           class="flex items-center w-full px-4 py-3 font-normal">
3797                                                            Pain                                                        </a>
3798                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-surgeles/viennoiseries"
3799                                                           title="Viennoiseries"
3800                                                           class="flex items-center w-full px-4 py-3 font-normal">
3801                                                            Viennoiseries                                                        </a>
3802                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-surgeles/glaces"
3803                                                           title="Glaces"
3804                                                           class="flex items-center w-full px-4 py-3 font-normal">
3805                                                            Glaces                                                        </a>
3806                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-surgeles/sale"
3807                                                           title="Sal&#xE9;"
3808                                                           class="flex items-center w-full px-4 py-3 font-normal">
3809                                                            Salé                                                        </a>
3810                                                                                                            <a href="https://www.aveve.be/fr/delices/produits-surgeles/sans-gluten"
3811                                                           title="Sans&#x20;gluten"
3812                                                           class="flex items-center w-full px-4 py-3 font-normal">
3813                                                            Sans gluten                                                        </a>
3814                                                                                                    </div>
3815
3816                                                <a href="https://www.aveve.be/fr/delices/produits-surgeles"
3817                                                   title="Produits&#x20;surgel&#xE9;s"
3818                                                   class="flex items-center w-full text-primary font-normal mt-4">
3819                                                    Afficher tous les articles de Produits surgelés                                                </a>
3820                                            </div>
3821                                                                                                                    <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3822                                              @click="
3823                                                      selected !== 'category-node-669'
3824                                                                ? selected = 'category-node-669' : selected = null;"
3825                                        >
3826                                                                                            <a title="Ustensiles&#x20;de&#x20;cuisine"
3827                                                   class="flex items-center w-full font-normal">
3828                                                    Ustensiles de cuisine                                                </a>
3829                                                <a class="flex cursor-pointer box-border transition"
3830                                                   :class="{'rotate-180': selected == 'category-node-669', 'rotate-0': selected == null}"
3831                                                >
3832                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3833                                                </a>
3834                                                                                    </span>
3835                                                                                    
3836                                            <div x-ref="container669"
3837                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3838                                                 :style="selected == 'category-node-669'
3839                                                                    ? 'max-height: ' + $refs.container669.scrollHeight + 'px' : ''"
3840                                            >
3841                                                <div class="border-l-2 border-opacity-10 border-gray">
3842                                                                                                            <a href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/moules-a-patisserie-emporte-pieces"
3843                                                           title="Moules&#x20;&#xE0;&#x20;p&#xE2;tisserie&#x20;&amp;&#x20;emporte-pi&#xE8;ces"
3844                                                           class="flex items-center w-full px-4 py-3 font-normal">
3845                                                            Moules à pâtisserie &amp; emporte-pièces                                                        </a>
3846                                                                                                            <a href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/articles-de-conservation"
3847                                                           title="Articles&#x20;de&#x20;conservation"
3848                                                           class="flex items-center w-full px-4 py-3 font-normal">
3849                                                            Articles de conservation                                                        </a>
3850                                                                                                            <a href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/articles-de-fermentation"
3851                                                           title="Articles&#x20;de&#x20;fermentation"
3852                                                           class="flex items-center w-full px-4 py-3 font-normal">
3853                                                            Articles de fermentation                                                        </a>
3854                                                                                                            <a href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/articles-de-cuisine-divers"
3855                                                           title="Articles&#x20;de&#x20;cuisine&#x20;divers"
3856                                                           class="flex items-center w-full px-4 py-3 font-normal">
3857                                                            Articles de cuisine divers                                                        </a>
3858                                                                                                    </div>
3859
3860                                                <a href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine"
3861                                                   title="Ustensiles&#x20;de&#x20;cuisine"
3862                                                   class="flex items-center w-full text-primary font-normal mt-4">
3863                                                    Afficher tous les articles de Ustensiles de cuisine                                                </a>
3864                                            </div>
3865                                                                                                                    <sp
3865an class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3866                                              @click="
3867                                                      selected !== 'category-node-573'
3868                                                                ? selected = 'category-node-573' : selected = null;"
3869                                        >
3870                                                                                            <a title="Art&#x20;de&#x20;la&#x20;table"
3871                                                   class="flex items-center w-full font-normal">
3872                                                    Art de la table                                                </a>
3873                                                <a class="flex cursor-pointer box-border transition"
3874                                                   :class="{'rotate-180': selected == 'category-node-573', 'rotate-0': selected == null}"
3875                                                >
3876                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="13" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
3877                                                </a>
3878                                                                                    </span>
3879                                                                                    
3880                                            <div x-ref="container573"
3881                                                 class="max-h-0 overflow-hidden transition-all duration-200 ml-4 md:ml-8"
3882                                                 :style="selected == 'category-node-573'
3883                                                                    ? 'max-height: ' + $refs.container573.scrollHeight + 'px' : ''"
3884                                            >
3885                                                <div class="border-l-2 border-opacity-10 border-gray">
3886                                                                                                            <a href="https://www.aveve.be/fr/delices/art-de-la-table/bougies"
3887                                                           title="Bougies"
3888                                                           class="flex items-center w-full px-4 py-3 font-normal">
3889                                                            Bougies                                                        </a>
3890                                                                                                            <a href="https://www.aveve.be/fr/delices/art-de-la-table/decoration-de-table"
3891                                                           title="D&#xE9;coration&#x20;de&#x20;table"
3892                                                           class="flex items-center w-full px-4 py-3 font-normal">
3893                                                            Décoration de table                                                        </a>
3894                                                                                                    </div>
3895
3896                                                <a href="https://www.aveve.be/fr/delices/art-de-la-table"
3897                                                   title="Art&#x20;de&#x20;la&#x20;table"
3898                                                   class="flex items-center w-full text-primary font-normal mt-4">
3899                                                    Afficher tous les articles de Art de la table                                                </a>
3900                                            </div>
3901                                                                                                            </div>
3902                            </div>
3903                                            </div>
3904                
3905                
3906    
3907    <div class="level-0 w-full">
3908        <span class="flex items-center transition-transform duration-150 ease-in-out transform"
3909              :class="{
3910                    '-translate-x-full h-0' : mobilePanelActiveId,
3911                    'translate-x-0 h-full' : !mobilePanelActiveId
3912              }"
3913              @click="mobilePanelActiveId =
3914                      mobilePanelActiveId === 'category-node-6Q3CKVclHEthMXAQVcLEyb' ?
3915                       0 : 'category-node-6Q3CKVclHEthMXAQVcLEyb';"
3916        >
3917            <a class="flex items-center w-full p-4 pr-0 cursor-pointer font-normal bg-white level-0"
3918               title="Inspiration"
3919            >
3920                                    <span class="pr-5 box-border">
3921                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M32 448c-17.67 0-32 14.33-32 32c0 17.67 14.33 32 32 32s32-14.33 32-32C64 462.3 49.67 448 32 448zM144 384C117.5 384 96 405.5 96 432S117.5 480 144 480S192 458.5 192 432S170.5 384 144 384zM370.2 64.08C344.8 24.17 301.6 0 254 0C207.3 0 164.5 23.64 138.9 62.64C61.92 64.8 0 128.4 0 206.6c0 89.4 81.43 162.1 172.6 140.9C193.3 370.6 222.6 384 254 384c31.13 0 60.28-13.16 80.96-35.92c11.32 2.91 22.76 4.381 34.14 4.381C447.9 352.5 512 287.6 512 208.1C512 128.9 448.5 64.69 370.2 64.08zM334.9 297.7c-10.39-4.099-22.39-.2034-28.53 9.34c-11.63 18.1-31.22 28.9-52.4 28.9c-21.24 0-40.84-10.87-52.5-29.07c-4.465-7.009-12.09-10.1-20-10.1c-2.605 0-5.209 .4224-7.783 1.314C162.7 301 152.7 302.9 142.9 302.9c-52.53 0-95.26-43.12-95.26-96.13c0-52.83 42.45-95.86 96.96-95.86c.155 0 .3411 .0156 .5271 .0156l5.054 .5789c9.643 .8136 18.64-4.396 22.98-13c15.81-31.12 46.79-50.44 80.87-50.44c34.82 0 66.11 19.87 81.64 51.85c4.372 8.996 13.8 14.38 23.75 13.33l4.837-.5945c1.612-.219 3.194-.5006 4.868-.5006c52.53 0 95.26 43.12 95.26 96.13C464.4 272.6 399.8 322.9 334.9 297.7z"/></svg>
3922                    </span>
3923                                <span class="pr-1 box-border">
3924                    Inspiration                </span>
3925            </a>
3926                            <a class="flex pr-6 cursor-pointer box-border">
3927                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
3928                </a>
3929                    </span>
3930                    <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
3931                         invisible transform"
3932                :class="{
3933                    'translate-x-full h-0 invisible' : mobilePanelActiveId !== 'category-node-6Q3CKVclHEthMXAQVcLEyb',
3934                    'translate-x-0 visible z-10' : mobilePanelActiveId === 'category-node-6Q3CKVclHEthMXAQVcLEyb'
3935                }"
3936            >
3937                <div class="flex w-full z-10 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
3938                     @click="mobilePanelActiveId = 0; mobileSubPanelActiveId = 0"
3939                >
3940                    <span class="pr-[65px] md:pr-[240px] box-border">
3941                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
3942                    </span>
3943                    <a class="flex items-center p-4 cursor-pointer text-white font-semibold">
3944                                                    <span class="pr-3 box-border">
3945                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M32 448c-17.67 0-32 14.33-32 32c0 17.67 14.33 32 32 32s32-14.33 32-32C64 462.3 49.67 448 32 448zM144 384C117.5 384 96 405.5 96 432S117.5 480 144 480S192 458.5 192 432S170.5 384 144 384zM370.2 64.08C344.8 24.17 301.6 0 254 0C207.3 0 164.5 23.64 138.9 62.64C61.92 64.8 0 128.4 0 206.6c0 89.4 81.43 162.1 172.6 140.9C193.3 370.6 222.6 384 254 384c31.13 0 60.28-13.16 80.96-35.92c11.32 2.91 22.76 4.381 34.14 4.381C447.9 352.5 512 287.6 512 208.1C512 128.9 448.5 64.69 370.2 64.08zM334.9 297.7c-10.39-4.099-22.39-.2034-28.53 9.34c-11.63 18.1-31.22 28.9-52.4 28.9c-21.24 0-40.84-10.87-52.5-29.07c-4.465-7.009-12.09-10.1-20-10.1c-2.605 0-5.209 .4224-7.783 1.314C162.7 301 152.7 302.9 142.9 302.9c-52.53 0-95.26-43.12-95.26-96.13c0-52.83 42.45-95.86 96.96-95.86c.155 0 .3411 .0156 .5271 .0156l5.054 .5789c9.643 .8136 18.64-4.396 22.98-13c15.81-31.12 46.79-50.44 80.87-50.44c34.82 0 66.11 19.87 81.64 51.85c4.372 8.996 13.8 14.38 23.75 13.33l4.837-.5945c1.612-.219 3.194-.5006 4.868-.5006c52.53 0 95.26 43.12 95.26 96.13C464.4 272.6 399.8 322.9 334.9 297.7z"/></svg>
3946                            </span>
3947                                                Inspiration                    </a>
3948                </div>
3949
3950                                                                                <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
3951                              :class="{
3952                                    'translate-x-0' : mobilePanelActiveId,
3953                                    '-translate-x-full h-0' : !mobilePanelActiveId,
3954                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
3955                              }"
3956                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-yPCvFK2yQau7OhuzlpHkx' ?
3957                                      0 : 'category-node-yPCvFK2yQau7OhuzlpHkx';"
3958                        >
3959                                                            <a title="Gourmandises"
3960                                   class="flex items-center w-full font-normal"
3961                                >
3962                                    <span class="text-base">
3963                                        Gourmandises                                    </span>
3964                                </a>
3965                                <a class="flex pr-6 cursor-pointer box-border">
3966                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
3967                                </a>
3968                                                    </span>
3969                    
3970                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
3971                            translate-x-full invisible transform"
3972                             :class="{
3973                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-yPCvFK2yQau7OhuzlpHkx',
3974                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-yPCvFK2yQau7OhuzlpHkx'
3975                            }"
3976                        >
3977                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
3978                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
3979                                         mobileSubPanelActiveId = 0"
3980                            >
3981                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
3982
3983                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
3984                                                                        Gourmandises                                </a>
3985                            </div>
3986
3987                            <div>
3988                                                                                                            
3989                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
3990                                              @click="selected !== '2WZkfc9IuRoBu6CxOEzQcJ'
3991                                                        ? selected = '2WZkfc9IuRoBu6CxOEzQcJ' : selected = null;"
3992                                        >
3993                                                                                                                                                                                                <a href="https://www.aveve.be/fr/recettes"
3994                                                       title="Recettes"
3995                                                       class="flex items-center w-full transition"
3996                                                    >
3997                                                        Recettes                                                    </a>
3998                                                                                                                                    </span>
3999                                                                                                                                                                                        
4000                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4001                                              @click="selected !== '5NriuvWxwBAm8VX9kUOgUX'
4002                                                        ? selected = '5NriuvWxwBAm8VX9kUOgUX' : selected = null;"
4003                                        >
4004                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/gourmandises/fete"
4005                                                       title="C&#x2019;est&#x20;la&#x20;f&#xEA;te"
4006                                                       class="flex items-center w-full transition"
4007                                                    >
4008                                                        C’est la fête                                                    </a>
4009                                                                                                                                    </span>
4010                                                                                                                                                                                        
4011                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4012                                              @click="selected !== '4QaFmhnzw4SKIo05ApWciy'
4013                                                        ? selected = '4QaFmhnzw4SKIo05ApWciy' : selected = null;"
4014                                        >
4015                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/gourmandises/boulangerie-maison"
4016                                                       title="Boulangerie&#x20;maison&#x20;"
4017                                                       class="flex items-center w-full transition"
4018                                                    >
4019                                                        Boulangerie maison                                                     </a>
4020                                                                                                                                    </span>
4021                                                                                                                                                                                        
4022                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4023                                              @click="selected !== '6plMKGcol40bDWFkyQgsj'
4024                                                        ? selected = '6plMKGcol40bDWFkyQgsj' : selected = null;"
4025                                        >
4026                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4026piration/gourmandises/rapide-et-sain"
4027                                                       title="Rapide&#x20;et&#x20;sain&#x20;&#x20;"
4028                                                       class="flex items-center w-full transition"
4029                                                    >
4030                                                        Rapide et sain                                                      </a>
4031                                                                                                                                    </span>
4032                                                                                                                                                                                        
4033                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4034                                              @click="selected !== '5t57RacjYGL2kLwq3KAdbR'
4035                                                        ? selected = '5t57RacjYGL2kLwq3KAdbR' : selected = null;"
4036                                        >
4037                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/gourmandises/kids-in-the-kitchen"
4038                                                       title="Kids&#x20;in&#x20;the&#x20;kitchen"
4039                                                       class="flex items-center w-full transition"
4040                                                    >
4041                                                        Kids in the kitchen                                                    </a>
4042                                                                                                                                    </span>
4043                                                                                                                                                                                        
4044                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4045                                              @click="selected !== '5xCexojwWNg04rizxlDF2V'
4046                                                        ? selected = '5xCexojwWNg04rizxlDF2V' : selected = null;"
4047                                        >
4048                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/gourmandises/delicieusement-durable"
4049                                                       title="D&#xE9;licieusement&#x20;durable"
4050                                                       class="flex items-center w-full transition"
4051                                                    >
4052                                                        Délicieusement durable                                                    </a>
4053                                                                                                                                    </span>
4054                                                                                                            
4055                                                                                                    <a href="https://www.aveve.be/fr/inspiration/gourmandises"
4056                                       title="Gourmandises"
4057                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4058                                    >
4059                                        Afficher tous les articles de Gourmandises                                    </a>
4060                                                            </div>
4061                        </div>
4062                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4063                              :class="{
4064                                    'translate-x-0' : mobilePanelActiveId,
4065                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4066                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4067                              }"
4068                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-65zCnd7PxfxIVj0O0z4wMD' ?
4069                                      0 : 'category-node-65zCnd7PxfxIVj0O0z4wMD';"
4070                        >
4071                                                            <a title="Jardin&#x20;&#xE9;cologique"
4072                                   class="flex items-center w-full font-normal"
4073                                >
4074                                    <span class="text-base">
4075                                        Jardin écologique                                    </span>
4076                                </a>
4077                                <a class="flex pr-6 cursor-pointer box-border">
4078                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4079                                </a>
4080                                                    </span>
4081                    
4082                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4083                            translate-x-full invisible transform"
4084                             :class="{
4085                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-65zCnd7PxfxIVj0O0z4wMD',
4086                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-65zCnd7PxfxIVj0O0z4wMD'
4087                            }"
4088                        >
4089                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4090                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4091                                         mobileSubPanelActiveId = 0"
4092                            >
4093                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4094
4095                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4096                                                                        Jardin écologique                                </a>
4097                            </div>
4098
4099                            <div>
4100                                                                                                            
4101                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4102                                              @click="selected !== '3i7t5c7mZHhPSXO80eWSOw'
4103                                                        ? selected = '3i7t5c7mZHhPSXO80eWSOw' : selected = null;"
4104                                        >
4105                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4105piration/jardin/jardin-ecologique/un-bon-depart"
4106                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4107                                                       class="flex items-center w-full transition"
4108                                                    >
4109                                                        Un bon départ                                                    </a>
4110                                                                                                                                    </span>
4111                                                                                                            
4112                                                                                                    <a href="https://www.aveve.be/fr/inspiration/jardin/jardin-ecologique"
4113                                       title="Jardin&#x20;&#xE9;cologique"
4114                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4115                                    >
4116                                        Afficher tous les articles de Jardin écologique                                    </a>
4117                                                            </div>
4118                        </div>
4119                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4120                              :class="{
4121                                    'translate-x-0' : mobilePanelActiveId,
4122                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4123                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4124                              }"
4125                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-52zNOGJoBEeMOvpZssDn4h' ?
4126                                      0 : 'category-node-52zNOGJoBEeMOvpZssDn4h';"
4127                        >
4128                                                            <a title="Potager"
4129                                   class="flex items-center w-full font-normal"
4130                                >
4131                                    <span class="text-base">
4132                                        Potager                                    </span>
4133                                </a>
4134                                <a class="flex pr-6 cursor-pointer box-border">
4135                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4136                                </a>
4137                                                    </span>
4138                    
4139                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4140                            translate-x-full invisible transform"
4141                             :class="{
4142                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-52zNOGJoBEeMOvpZssDn4h',
4143                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-52zNOGJoBEeMOvpZssDn4h'
4144                            }"
4145                        >
4146                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4147                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4148                                         mobileSubPanelActiveId = 0"
4149                            >
4150                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4151
4152                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4153                                                                        Potager                                </a>
4154                            </div>
4155
4156                            <div>
4157                                                                                                            
4158                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4159                                              @click="selected !== '6eVfOZc7PIPIrYDSJIoORl'
4160                                                        ? selected = '6eVfOZc7PIPIrYDSJIoORl' : selected = null;"
4161                                        >
4162                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/potager/un-bon-depart"
4163                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4164                                                       class="flex items-center w-full transition"
4165                                                    >
4166                                                        Un bon départ                                                    </a>
4167                                                                                                                                    </span>
4168                                                                                                                                                                                        
4169                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4170                                              @click="selected !== '1XUaRJNvOjCIqKAWxzAuz4'
4171                                                        ? selected = '1XUaRJNvOjCIqKAWxzAuz4' : selected = null;"
4172                                        >
4173                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/potager/entretien-et-soins"
4174                                                       title="Entretien&#x20;et&#x20;soins"
4175                                                       class="flex items-center w-full transition"
4176                                                    >
4177                                                        Entretien et soins                                                    </a>
4178                                                                                                                                    </span>
4179                                                                                                            
4180                                                                                                    <a href="https://www.aveve.be/fr/inspiration/jardin/potager"
4181                                       title="Potager"
4182                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4183                                    >
4184                                        Afficher tous les articles de Potager                                    </a>
4185                                                            </div>
4186                        </div>
4187                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4188                              :class="{
4189                                    'translate-x-0' : mobilePanelActiveId,
4190                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4191                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4192                              }"
4193                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-o21gv0zn8dh2C70PFUPVV' ?
4194                                      0 : 'category-node-o21gv0zn8dh2C70PFUPVV';"
4195                        >
4196                                                            <a title="Jardin&#x20;d&#x27;herbe"
4197                                   class="flex items-center w-full font-normal"
4198                                >
4199                                    <span class="text-base">
4200                                        Jardin d&#039;herbe                                    </span>
4201                                </a>
4202                                <a class="flex pr-6 cursor-pointer box-border">
4203                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4204                                </a>
4205                                                    </span>
4206                    
4207                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4208                            translate-x-full invisible transform"
4209                             :class="{
4210                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-o21gv0zn8dh2C70PFUPVV',
4211                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-o21gv0zn8dh2C70PFUPVV'
4212                            }"
4213                        >
4214                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4215                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4216                                         mobileSubPanelActiveId = 0"
4217                            >
4218                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4219
4220                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4221                                                                        Jardin d&#039;herbe                                </a>
4222                            </div>
4223
4224                            <div>
4225                                                                                                            
4226                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4227                                              @click="selected !== '6En9VAXFrA9rRhBEFX82AC'
4228                                                        ? selected = '6En9VAXFrA9rRhBEFX82AC' : selected = null;"
4229                                        >
4230                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/jardin-dherbe/un-bon-depart"
4231                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4232                                                       class="flex items-center w-full transition"
4233                                                    >
4234                                                        Un bon départ                                                    </a>
4235                                                                                                                                    </span>
4236                                                                                                                                                                                        
4237                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4238                                              @click="selected !== '4hRcQSflkcFTuKvOypweoZ'
4239                                                        ? selected = '4hRcQSflkcFTuKvOypweoZ' : selected = null;"
4240                                        >
4241                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/jardin-dherbe/utilisation-des-herbes"
4242                                                       title="Utilisation&#x20;des&#x20;herbes"
4243                                                       class="flex items-center w-full transition"
4244                                                    >
4245                                                        Utilisation des herbes                                                    </a>
4246                                                                                                                                    </span>
4247                                                                                                            
4248                                                                                                    <a href="https://www.aveve.be/fr/inspiration/jardin/jardin-dherbe"
4249                                       title="Jardin&#x20;d&#x27;herbe"
4250                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4251                                    >
4252                                        Afficher tous les articles de Jardin d&#039;herbe                                    </a>
4253                                                            </div>
4254                        </div>
4255                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4256                              :class="{
4257                                    'translate-x-0' : mobilePanelActiveId,
4258                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4259                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4260                              }"
4261                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-6OpHch0wRxhFihrzKZUQQs' ?
4262                                      0 : 'category-node-6OpHch0wRxhFihrzKZUQQs';"
4263                        >
4264                                                            <a title="Fruitiers"
4265                                   class="flex items-center w-full font-normal"
4266                                >
4267                                    <span class="text-base">
4268                                        Fruitiers                                    </span>
4269                                </a>
4270                                <a class="flex pr-6 cursor-pointer box-border">
4271                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4272                                </a>
4273                                                    </span>
4274                    
4275                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4276                            translate-x-full invisible transform"
4277                             :class="{
4278                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-6OpHch0wRxhFihrzKZUQQs',
4279                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-6OpHch0wRxhFihrzKZUQQs'
4280                            }"
4281                        >
4282                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4283                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4284                                         mobileSubPanelActiveId = 0"
4285                            >
4286                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4287
4288                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4289                                                                        Fruitiers                                </a>
4290                            </div>
4291
4292                            <div>
4293                                                                                                            
4294                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4295                                              @click="selected !== '2JwJf1oLrGg1OkIrksN11L'
4296                                                        ? selected = '2JwJf1oLrGg1OkIrksN11L' : selected = null;"
4297                                        >
4298                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/fruitiers/un-bon-depart"
4299                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4300                                                       class="flex items-center w-full transition"
4301                                                    >
4302                                                        Un bon départ                                                    </a>
4303                                                                                                                                    </span>
4304                                                                                                            
4305                                                                                                    <a href="https://www.aveve.be/fr/inspiration/jardin/fruitiers"
4306                                       title="Fruitiers"
4307                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4308                                    >
4309                                        Afficher tous les articles de Fruitiers                                    </a>
4310                                                            </div>
4311                        </div>
4312                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4313                              :class="{
4314                                    'translate-x-0' : mobilePanelActiveId,
4315                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4316                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4317                              }"
4318                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-qLqgaVsSBkg1XYk0DKZsQ' ?
4319                                      0 : 'category-node-qLqgaVsSBkg1XYk0DKZsQ';"
4320                        >
4321                                                            <a title="Pelouse"
4322                                   class="flex items-center w-full font-normal"
4323                                >
4324                                    <span class="text-base">
4325                                        Pelouse                                    </span>
4326                                </a>
4327                                <a class="flex pr-6 cursor-pointer box-border">
4328                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4329                                </a>
4330                                                    </span>
4331                    
4332                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4333                            translate-x-full invisible transform"
4334                             :class="{
4335                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-qLqgaVsSBkg1XYk0DKZsQ',
4336                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-q
4336LqgaVsSBkg1XYk0DKZsQ'
4337                            }"
4338                        >
4339                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4340                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4341                                         mobileSubPanelActiveId = 0"
4342                            >
4343                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4344
4345                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4346                                                                        Pelouse                                </a>
4347                            </div>
4348
4349                            <div>
4350                                                                                                            
4351                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4352                                              @click="selected !== 'grHVGNmeTdjkiZa3vbRWO'
4353                                                        ? selected = 'grHVGNmeTdjkiZa3vbRWO' : selected = null;"
4354                                        >
4355                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/pelouse/un-bon-depart"
4356                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4357                                                       class="flex items-center w-full transition"
4358                                                    >
4359                                                        Un bon départ                                                    </a>
4360                                                                                                                                    </span>
4361                                                                                                                                                                                        
4362                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4363                                              @click="selected !== '2nYGrukJglwEIDNNEk01aI'
4364                                                        ? selected = '2nYGrukJglwEIDNNEk01aI' : selected = null;"
4365                                        >
4366                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/pelouse/entretien-et-soins"
4367                                                       title="Entretien&#x20;et&#x20;soins"
4368                                                       class="flex items-center w-full transition"
4369                                                    >
4370                                                        Entretien et soins                                                    </a>
4371                                                                                                                                    </span>
4372                                                                                                            
4373                                                                                                    <a href="https://www.aveve.be/fr/ins
4373piration/jardin/pelouse"
4374                                       title="Pelouse"
4375                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4376                                    >
4377                                        Afficher tous les articles de Pelouse                                    </a>
4378                                                            </div>
4379                        </div>
4380                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4381                              :class="{
4382                                    'translate-x-0' : mobilePanelActiveId,
4383                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4384                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4385                              }"
4386                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-2TOPr2HeArRch3WkzKCov9' ?
4387                                      0 : 'category-node-2TOPr2HeArRch3WkzKCov9';"
4388                        >
4389                                                            <a title="D&#xE9;tente&#x20;au&#x20;jardin"
4390                                   class="flex items-center w-full font-normal"
4391                                >
4392                                    <span class="text-base">
4393                                        Détente au jardin                                    </span>
4394                                </a>
4395                                <a class="flex pr-6 cursor-pointer box-border">
4396                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4397                                </a>
4398                                                    </span>
4399                    
4400                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4401                            translate-x-full invisible transform"
4402                             :class="{
4403                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-2TOPr2HeArRch3WkzKCov9',
4404                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-2TOPr2HeArRch3WkzKCov9'
4405                            }"
4406                        >
4407                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4408                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4409                                         mobileSubPanelActiveId = 0"
4410                            >
4411                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4412
4413                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4414                                                                        Détente au jardin                                </a>
4415                            </div>
4416
4417                            <div>
4418                                                                                                            
4419                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4420                                              @click="selected !== 'Uj4uFf3wYlbpiaegF4rzM'
4421                                                        ? selected = 'Uj4uFf3wYlbpiaegF4rzM' : selected = null;"
4422                                        >
4423                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/bbq"
4424                                                       title="BBQ"
4425                                                       class="flex items-center w-full transition"
4426                                                    >
4427                                                        BBQ                                                    </a>
4428                                                                                                                                    </span>
4429                                                                                                                                                                                        
4430                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4431                                              @click="selected !== '4OKG2HDMAfr4ZN06q8A7AD'
4432                                                        ? selected = '4OKG2HDMAfr4ZN06q8A7AD' : selected = null;"
4433                                        >
4434                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/plantes-ornementales"
4435                                                       title="Plantes&#x20;ornementales"
4436                                                       class="flex items-center w-full transition"
4437                                                    >
4438                                                        Plantes ornementales                                                    </a>
4439                                                                                                                                    </span>
4440                                                                                                                                                                                        
4441                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4442                                              @click="selected !== '3o7IxmT1Uv1E6KYRLLeQOV'
4443                                                        ? selected = '3o7IxmT1Uv1E6KYRLLeQOV' : selected = null;"
4444                                        >
4445                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/plantes-de-terrasse"
4446                                                       title="Plantes&#x20;de&#x20;terrasse"
4447                                                       class="flex items-center w-full transition"
4448                                                    >
4449                                                        Plantes de terrasse                                                    </a>
4450                                                                                                                                    </span>
4451                                                                                                                                                                                        
4452                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4453                                              @click="selected !== 'crS3reQZIDDm6YlCECsVl'
4454                                                        ? selected = 'crS3reQZIDDm6YlCECsVl' : selected = null;"
4455                                        >
4456                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4456piration/jardin/detente-au-jardin/problemes-au-jardin"
4457                                                       title="Probl&#xE8;mes&#x20;au&#x20;jardin"
4458                                                       class="flex items-center w-full transition"
4459                                                    >
4460                                                        Problèmes au jardin                                                    </a>
4461                                                                                                                                    </span>
4462                                                                                                            
4463                                                                                                    <a href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin"
4464                                       title="D&#xE9;tente&#x20;au&#x20;jardin"
4465                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4466                                    >
4467                                        Afficher tous les articles de Détente au jardin                                    </a>
4468                                                            </div>
4469                        </div>
4470                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4471                              :class="{
4472                                    'translate-x-0' : mobilePanelActiveId,
4473                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4474                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4475                              }"
4476                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-3ZmOYuGSA3rVAyiWueGqqL' ?
4477                                      0 : 'category-node-3ZmOYuGSA3rVAyiWueGqqL';"
4478                        >
4479                                                            <a title="La&#x20;vie&#x20;en&#x20;vert"
4480                                   class="flex items-center w-full font-normal"
4481                                >
4482                                    <span class="text-base">
4483                                        La vie en vert                                    </span>
4484                                </a>
4485                                <a class="flex pr-6 cursor-pointer box-border">
4486                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4487                                </a>
4488                                                    </span>
4489                    
4490                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4491                            translate-x-full invisible transform"
4492                             :class="{
4493                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-3ZmOYuGSA3rVAyiWueGqqL',
4494                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-3ZmOYuGSA3rVAyiWueGqqL'
4495                            }"
4496                        >
4497                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4498                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4499                                         mobileSubPanelActiveId = 0"
4500                            >
4501                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4502
4503                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4504                                                                        La vie en vert                                </a>
4505                            </div>
4506
4507                            <div>
4508                                                                                                            
4509                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4510                                              @click="selected !== '3PahlbkWbGekRe389C6zcI'
4511                                                        ? selected = '3PahlbkWbGekRe389C6zcI' : selected = null;"
4512                                        >
4513                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert/un-bon-depart"
4514                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4515                                                       class="flex items-center w-full transition"
4516                                                    >
4517                                                        Un bon départ                                                    </a>
4518                                                                                                                                    </span>
4519                                                                                                                                                                                        
4520                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4521                                              @click="selected !== '7ADOl4Mb9Y6fCzytdp5ayN'
4522                                                        ? selected = '7ADOl4Mb9Y6fCzytdp5ayN' : selected = null;"
4523                                        >
4524                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert/entretien-et-soins"
4525                                                       title="Entretien&#x20;et&#x20;soins"
4526                                                       class="flex items-center w-full transition"
4527                                                    >
4528                                                        Entretien et soins                                                    </a>
4529                                                                                                                                    </span>
4530                                                                                                                                                                                        
4531                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4532                                              @click="selected !== 'aTLfA0aNe19qJwyiiMdkl'
4533                                                        ? selected = 'aTLfA0aNe19qJwyiiMdkl' : selected = null;"
4534                                        >
4535                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert/tendances"
4536                                                       title="&#x20;Tendances"
4537                                                       class="flex items-center w-full transition"
4538                                                    >
4539                                                         Tendances                                                    </a>
4540                                                                                                                                    </span>
4541                                                                                                            
4542                                                                                                    <a href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert"
4543                                       title="La&#x20;vie&#x20;en&#x20;vert"
4544                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4545                                    >
4546                                        Afficher tous les articles de La vie en vert                                    </a>
4547                                                            </div>
4548                        </div>
4549                                                                                                    <sp
4549an class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4550                              :class="{
4551                                    'translate-x-0' : mobilePanelActiveId,
4552                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4553                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4554                              }"
4555                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-6x4mK4NKLaMY22RqA80S45' ?
4556                                      0 : 'category-node-6x4mK4NKLaMY22RqA80S45';"
4557                        >
4558                                                            <a title="Chien"
4559                                   class="flex items-center w-full font-normal"
4560                                >
4561                                    <span class="text-base">
4562                                        Chien                                    </span>
4563                                </a>
4564                                <a class="flex pr-6 cursor-pointer box-border">
4565                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4566                                </a>
4567                                                    </span>
4568                    
4569                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4570                            translate-x-full invisible transform"
4571                             :class="{
4572                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-6x4mK4NKLaMY22RqA80S45',
4573                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-6x4mK4NKLaMY22RqA80S45'
4574                            }"
4575                        >
4576                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4577                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4578                                         mobileSubPanelActiveId = 0"
4579                            >
4580                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4581
4582                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4583                                                                        Chien                                </a>
4584                            </div>
4585
4586                            <div>
4587                                                                                                            
4588                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4589                                              @click="selected !== '2SQMQ0ghQzUyDFTjdjuiKE'
4590                                                        ? selected = '2SQMQ0ghQzUyDFTjdjuiKE' : selected = null;"
4591                                        >
4592                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4592piration/animaux/chien/un-bon-départ"
4593                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4594                                                       class="flex items-center w-full transition"
4595                                                    >
4596                                                        Un bon départ                                                    </a>
4597                                                                                                                                    </span>
4598                                                                                                                                                                                        
4599                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4600                                              @click="selected !== '12wdUwjqwpZnhLgBVPAWWA'
4601                                                        ? selected = '12wdUwjqwpZnhLgBVPAWWA' : selected = null;"
4602                                        >
4603                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chien/connaissez-votre-animal"
4604                                                       title="Connaissez&#x20;votre&#x20;animal"
4605                                                       class="flex items-center w-full transition"
4606                                                    >
4607                                                        Connaissez votre animal                                                    </a>
4608                                                                                                                                    </span>
4609                                                                                                                                                                                        
4610                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4611                                              @click="selected !== '6unLcNKIDZWJSZvcjQDTys'
4612                                                        ? selected = '6unLcNKIDZWJSZvcjQDTys' : selected = null;"
4613                                        >
4614                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chien/conseils-pratiques"
4615                                                       title="Conseils&#x20;pratiques"
4616                                                       class="flex items-center w-full transition"
4617                                                    >
4618                                                        Conseils pratiques                                                    </a>
4619                                                                                                                                    </span>
4620                                                                                                                                                                                        
4621                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4622                                              @click="selected !== 'YIZ0ze9DsVsYHh1ouVuvP'
4623                                                        ? selected = 'YIZ0ze9DsVsYHh1ouVuvP' : selected = null;"
4624                                        >
4625                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chien/gatez-les"
4626                                                       title="G&#xE2;tez-les"
4627                                                       class="flex items-center w-full transition"
4628                                                    >
4629                                                        Gâtez-les                                                    </a>
4630                                                                                                                                    </span>
4631                                                                                                                                                                                        
4632                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4633                                              @click="selected !== '3P9qK0Kui9FHkTAKORtBwT'
4634                                                        ? selected = '3P9qK0Kui9FHkTAKORtBwT' : selected = null;"
4635                                        >
4636                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chien/que-mange-votre-animal"
4637                                                       title="Que&#x20;mange&#x20;votre&#x20;animal"
4638                                                       class="flex items-center w-full transition"
4639                                                    >
4640                                                        Que mange votre animal                                                    </a>
4641                                                                                                                                    </span>
4642                                                                                                            
4643                                                                                                    <a href="https://www.aveve.be/fr/inspiration/animaux/chien"
4644                                       title="Chien"
4645                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4646                                    >
4647                                        Afficher tous les articles de Chien                                    </a>
4648                                                            </div>
4649                        </div>
4650                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4651                              :class="{
4652                                    'translate-x-0' : mobilePanelActiveId,
4653                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4654                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4655                              }"
4656                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-2AJqgiRjYalzWzqSrm3bcI' ?
4657                                      0 : 'category-node-2AJqgiRjYalzWzqSrm3bcI';"
4658                        >
4659                                                            <a title="Chat"
4660                                   class="flex items-center w-full font-normal"
4661                                >
4662                                    <span class="text-base">
4663                                        Chat                                    </span>
4664                                </a>
4665                                <a class="flex pr-6 cursor-pointer box-border">
4666                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4667                                </a>
4668                                                    </span>
4669                    
4670                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4671                            translate-x-full invisible transform"
4672                             :class="{
4673                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-2AJqgiRjYalzWzqSrm3bcI',
4674                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-2AJqgiRjYalzWzqSrm3bcI'
4675                            }"
4676                        >
4677                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4678                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4679                                         mobileSubPanelActiveId = 0"
4680                            >
4681                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4682
4683                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4684                                                                        Chat                                </a>
4685                            </div>
4686
4687                            <div>
4688                                                                                                            
4689                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4690                                              @click="selected !== '4EjSpff06r5YGfkoUQi5C5'
4691                                                        ? selected = '4EjSpff06r5YGfkoUQi5C5' : selected = null;"
4692                                        >
4693                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chat/un-bon-depart"
4694                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4695                                                       class="flex items-center w-full transition"
4696                                                    >
4697                                                        Un bon départ                                                    </a>
4698                                                                                                                                    </span>
4699                                                                                                                                                                                        
4700                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4701                                              @click="selected !== '74beOFJkzmu6I9NC1R2Pby'
4702                                                        ? selected = '74beOFJkzmu6I9NC1R2Pby' : selected = null;"
4703                                        >
4704                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chat/connaissez-votre-animal"
4705                                                       title="Connaissez&#x20;votre&#x20;animal"
4706                                                       class="flex items-center w-full transition"
4707                                                    >
4708                                                        Connaissez votre animal                                                    </a>
4709                                                                                                                                    </span>
4710                                                                                                                                                                                        
4711                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4712                                              @click="selected !== 'DJoLs9K1kDsRkTBLcvG5v'
4713                                                        ? selected = 'DJoLs9K1kDsRkTBLcvG5v' : selected = null;"
4714                                        >
4715                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chat/conseils-pratiques"
4716                                                       title="Conseils&#x20;pratiques"
4717                                                       class="flex items-center w-full transition"
4718                                                    >
4719                                                        Conseils pratiques                                                    </a>
4720                                                                                                                                    </span>
4721                                                                                                                                                                                        
4722                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4723                                              @click="selected !== '17y9RsxlWxIyFoKlcGcfFr'
4724                                                        ? selected = '17y9RsxlWxIyFoKlcGcfFr' : selected = null;"
4725                                        >
4726                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4726piration/animaux/chat/gatez-les"
4727                                                       title="G&#xE2;tez-les"
4728                                                       class="flex items-center w-full transition"
4729                                                    >
4730                                                        Gâtez-les                                                    </a>
4731                                                                                                                                    </span>
4732                                                                                                                                                                                        
4733                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4734                                              @click="selected !== '6gsMWJHke7YMMJ6uQhZINI'
4735                                                        ? selected = '6gsMWJHke7YMMJ6uQhZINI' : selected = null;"
4736                                        >
4737                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/chat/que-mange-votre-animal"
4738                                                       title="Que&#x20;mange&#x20;votre&#x20;animal"
4739                                                       class="flex items-center w-full transition"
4740                                                    >
4741                                                        Que mange votre animal                                                    </a>
4742                                                                                                                                    </span>
4743                                                                                                            
4744                                                                                                    <a href="https://www.aveve.be/fr/inspiration/animaux/chat"
4745                                       title="Chat"
4746                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4747                                    >
4748                                        Afficher tous les articles de Chat                                    </a>
4749                                                            </div>
4750                        </div>
4751                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4752                              :class="{
4753                                    'translate-x-0' : mobilePanelActiveId,
4754                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4755                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4756                              }"
4757                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-2QvrGhZH3TbtKS7ecIHKtH' ?
4758                                      0 : 'category-node-2QvrGhZH3TbtKS7ecIHKtH';"
4759                        >
4760                                                            <a title="Poule"
4761                                   class="flex items-center w-full font-normal"
4762                                >
4763                                    <span class="text-base">
4764                                        Poule                                    </span>
4765                                </a>
4766                                <a class="flex pr-6 cursor-pointer box-border">
4767                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4768                                </a>
4769                                                    </span>
4770                    
4771                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4772                            translate-x-full invisible transform"
4773                             :class="{
4774                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-2QvrGhZH3TbtKS7ecIHKtH',
4775                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-2QvrGhZH3TbtKS7ecIHKtH'
4776                            }"
4777                        >
4778                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4779                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4780                                         mobileSubPanelActiveId = 0"
4781                            >
4782                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4783
4784                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4785                                                                        Poule                                </a>
4786                            </div>
4787
4788                            <div>
4789                                                                                                            
4790                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4791                                              @click="selected !== '4wS9MZCRgsGQ8kLlusUpXI'
4792                                                        ? selected = '4wS9MZCRgsGQ8kLlusUpXI' : selected = null;"
4793                                        >
4794                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/poule/un-bon-depart"
4795                                                       title="Un&#x20;bon&#x20;d&#xE9;part"
4796                                                       class="flex items-center w-full transition"
4797                                                    >
4798                                                        Un bon départ                                                    </a>
4799                                                                                                                                    </span>
4800                                                                                                                                                                                        
4801                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4802                                              @click="selected !== '2L7bWCGO6EFQwWaydC0Xw0'
4803                                                        ? selected = '2L7bWCGO6EFQwWaydC0Xw0' : selected = null;"
4804                                        >
4805                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/poule/connaissez-votre-animal"
4806                                                       title="Connaissez&#x20;votre&#x20;animal"
4807                                                       class="flex items-center w-full transition"
4808                                                    >
4809                                                        Connaissez votre animal                                                    </a>
4810                                                                                                                                    </span>
4811                                                                                                                                                                                        
4812                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4813                                              @click="selected !== '6cx07XUW6mBNjjoGL6k1Kg'
4814                                                        ? selected = '6cx07XUW6mBNjjoGL6k1Kg' : selected = null;"
4815                                        >
4816                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/poule/conseils-pratiques"
4817                                                       title="Conseils&#x20;pratiques"
4818                                                       class="flex items-center w-full transition"
4819                                                    >
4820                                                        Conseils pratiques                                                    </a>
4821                                                                                                                                    </span>
4822                                                                                                                                                                                        
4823                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4824                                              @click="selected !== '1GQ4lfqOouaaaTYrWzORwP'
4825                                                        ? selected = '1GQ4lfqOouaaaTYrWzORwP' : selected = null;"
4826                                        >
4827                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4827piration/animaux/poule/que-mange-votre-animal"
4828                                                       title="Que&#x20;mange&#x20;votre&#x20;animal"
4829                                                       class="flex items-center w-full transition"
4830                                                    >
4831                                                        Que mange votre animal                                                    </a>
4832                                                                                                                                    </span>
4833                                                                                                            
4834                                                                                                    <a href="https://www.aveve.be/fr/inspiration/animaux/poule"
4835                                       title="Poule"
4836                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4837                                    >
4838                                        Afficher tous les articles de Poule                                    </a>
4839                                                            </div>
4840                        </div>
4841                                                                                                    <span class="flex items-center pl-4 pt-6 pb-2 md:pl-8"
4842                              :class="{
4843                                    'translate-x-0' : mobilePanelActiveId,
4844                                    '-translate-x-full h-0' : !mobilePanelActiveId,
4845                                    'translate-x-[-100%] hidden' : mobileSubPanelActiveId
4846                              }"
4847                              @click="mobileSubPanelActiveId = mobileSubPanelActiveId === 'category-node-6WAQoGI6Udm6nEy4VLuiyJ' ?
4848                                      0 : 'category-node-6WAQoGI6Udm6nEy4VLuiyJ';"
4849                        >
4850                                                            <a title="Autres&#x20;animaux"
4851                                   class="flex items-center w-full font-normal"
4852                                >
4853                                    <span class="text-base">
4854                                        Autres animaux                                    </span>
4855                                </a>
4856                                <a class="flex pr-6 cursor-pointer box-border">
4857                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M113.3 47.41l183.1 191.1c4.469 4.625 6.688 10.62 6.688 16.59s-2.219 11.97-6.688 16.59l-183.1 191.1c-9.152 9.594-24.34 9.906-33.9 .7187c-9.625-9.125-9.938-24.38-.7187-33.91l168-175.4L78.71 80.6c-9.219-9.5-8.906-24.78 .7187-33.91C88.99 37.5 104.2 37.82 113.3 47.41z"/></svg>
4858                                </a>
4859                                                    </span>
4860                    
4861                                            <div class="relative top-0 right-0 w-full transition-transform duration-200 ease-in-out
4862                            translate-x-full invisible transform"
4863                             :class="{
4864                                'translate-x-full h-0 invisible ' : mobileSubPanelActiveId !== 'category-node-6WAQoGI6Udm6nEy4VLuiyJ',
4865                                'translate-x-0 h-full visible z-10' : mobileSubPanelActiveId === 'category-node-6WAQoGI6Udm6nEy4VLuiyJ'
4866                            }"
4867                        >
4868                            <div class="flex w-full z-30 absolute top-[-56px] bg-secondary-alt1 items-center text-white font-semibold pl-6 md:pl-10"
4869                                 @click="mobilePanelActiveId = 'category-node-6Q3CKVclHEthMXAQVcLEyb',
4870                                         mobileSubPanelActiveId = 0"
4871                            >
4872                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="7" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M206.7 464.6l-183.1-191.1C18.22 267.1 16 261.1 16 256s2.219-11.97 6.688-16.59l183.1-191.1c9.152-9.594 24.34-9.906 33.9-.7187c9.625 9.125 9.938 24.37 .7187 33.91L73.24 256l168 175.4c9.219 9.5 8.906 24.78-.7187 33.91C231 474.5 215.8 474.2 206.7 464.6z"/></svg>
4873
4874                                <a class="flex items-center p-4 pl-[81px] md:pl-[240px] box-border cursor-pointer text-white font-semibold">
4875                                                                        Autres animaux                                </a>
4876                            </div>
4877
4878                            <div>
4879                                                                                                            
4880                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4881                                              @click="selected !== '5FJBlU4rAPvfJR3EjflnZ8'
4882                                                        ? selected = '5FJBlU4rAPvfJR3EjflnZ8' : selected = null;"
4883                                        >
4884                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/cheval"
4885                                                       title="Cheval"
4886                                                       class="flex items-center w-full transition"
4887                                                    >
4888                                                        Cheval                                                    </a>
4889                                                                                                                                    </span>
4890                                                                                                                                                                                        
4891                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4892                                              @click="selected !== '61pZpCoCHaG3PFhsKHLvLX'
4893                                                        ? selected = '61pZpCoCHaG3PFhsKHLvLX' : selected = null;"
4894                                        >
4895                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/mouton"
4896                                                       title="Mouton"
4897                                                       class="flex items-center w-full transition"
4898                                                    >
4899                                                        Mouton                                                    </a>
4900                                                                                                                                    </span>
4901                                                                                                                                                                                        
4902                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4903                                              @click="selected !== '2gggPCzCeOweFDF8pv1MSE'
4904                                                        ? selected = '2gggPCzCeOweFDF8pv1MSE' : selected = null;"
4905                                        >
4906                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/lapin-et-lapin-nain"
4907                                                       title="Lapin&#x20;et&#x20;lapin&#x20;nain"
4908                                                       class="flex items-center w-full transition"
4909                                                    >
4910                                                        Lapin et lapin nain                                                    </a>
4911                                                                                                                                    </span>
4912                                                                                                                                                                                        
4913                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4914                                              @click="selected !== '6Vd0mkTI4A39OUrNj2jZfZ'
4915                                                        ? selected = '6Vd0mkTI4A39OUrNj2jZfZ' : selected = null;"
4916                                        >
4917                                                                                                                                                                                                <a href="https://www.aveve.be/fr/ins
4917piration/animaux/rongeurs"
4918                                                       title="Rongeurs"
4919                                                       class="flex items-center w-full transition"
4920                                                    >
4921                                                        Rongeurs                                                    </a>
4922                                                                                                                                    </span>
4923                                                                                                                                                                                        
4924                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4925                                              @click="selected !== 'Q2b3QrPv2HzwR540uPhIb'
4926                                                        ? selected = 'Q2b3QrPv2HzwR540uPhIb' : selected = null;"
4927                                        >
4928                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/oiseau-d-ornement"
4929                                                       title="Oiseau&#x20;d&#x27;ornement&#x20;"
4930                                                       class="flex items-center w-full transition"
4931                                                    >
4932                                                        Oiseau d&#039;ornement                                                     </a>
4933                                                                                                                                    </span>
4934                                                                                                                                                                                        
4935                                        <span class="flex items-center font-normal pl-4 pr-6 pt-6 pb-2 md:px-8"
4936                                              @click="selected !== '4UmQXUFnZQ7aSAn7nyXbZI'
4937                                                        ? selected = '4UmQXUFnZQ7aSAn7nyXbZI' : selected = null;"
4938                                        >
4939                                                                                                                                                                                                <a href="https://www.aveve.be/fr/inspiration/animaux/poissons"
4940                                                       title="Poissons"
4941                                                       class="flex items-center w-full transition"
4942                                                    >
4943                                                        Poissons                                                    </a>
4944                                                                                                                                    </span>
4945                                                                                                            
4946                                                                                                    <a href="https://www.aveve.be/fr/inspiration/animaux/autres-animaux"
4947                                       title="Autres&#x20;animaux"
4948                                       class="flex items-center w-full font-normal text-primary pl-4 pt-6 md:pl-8"
4949                                    >
4950                                        Afficher tous les articles de Autres animaux                                    </a>
4951                                                            </div>
4952                        </div>
4953                                                </div>
4954            </div>
4955                
4956    
4957    <div class="level-0 w-full">
4958        <span class="flex items-center transition-transform duration-150 ease-in-out transform"
4959              :class="{
4960                    '-translate-x-full h-0' : mobilePanelActiveId,
4961                    'translate-x-0 h-full' : !mobilePanelActiveId
4962              }"
4963        >
4964            <a class="flex items-center w-full p-4 pr-0 cursor-pointer font-normal bg-white level-0"
4965               title="Chèque-cadeau"
4966               href="https://www.aveve.be/fr/cheque-cadeau"
4967            >
4968                <span class="pr-5 box-border">
4969                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M256 85.46L280.1 44.45C296.3 16.91 325.9 0 357.8 0H360C408.6 0 448 39.4 448 88C448 102.4 444.5 115.1 438.4 128H464C490.5 128 512 149.5 512 176V240C512 260.9 498.6 278.7 480 285.3V448C480 483.3 451.3 512 416 512H96C60.65 512 32 483.3 32 448V285.3C13.36 278.7 0 260.9 0 240V176C0 149.5 21.49 128 48 128H73.6C67.46 115.1 64 102.4 64 88C64 39.4 103.4 0 152 0H154.2C186.1 0 215.7 16.91 231.9 44.45L256 85.46zM288 176V240H464V176H288zM224 176H48V240H224V176zM224 288H80V448C80 456.8 87.16 464 96 464H224V288zM288 464H416C424.8 464 432 456.8 432 448V288H288V464zM360 128C382.1 128 400 110.1 400 88C400 65.91 382.1 48 360 48H357.8C342.9 48 329.1 55.91 321.5 68.78L286.7 128H360zM225.3 128L190.5 68.78C182.9 55.91 169.1 48 154.2 48H152C129.9 48 112 65.91 112 88C112 110.1 129.9 128 152 128H225.3z"/></svg>
4970                </span>
4971                <span class="pr-1 box-border">
4972                    Chèque-cadeau                </span>
4973            </a>
4974        </span>
4975    </div>
4976                
4977    
4978    <div class="level-0 w-full">
4979        <span class="flex items-center transition-transform duration-150 ease-in-out transform"
4980              :class="{
4981                    '-translate-x-full h-0' : mobilePanelActiveId,
4982                    'translate-x-0 h-full' : !mobilePanelActiveId
4983              }"
4984                       >
4985            <a class="flex items-center w-full p-4 pr-0 cursor-pointer font-normal bg-white level-0 text-promo"
4986               title="Promotions"
4987                                    href="https://www.aveve.be/fr/promotions"
4988                            >
4989                                    <span class="pr-5 box-border">
4990                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M80 144C80 126.3 94.33 112 112 112C129.7 112 144 126.3 144 144C144 161.7 129.7 176 112 176C94.33 176 80 161.7 80 144zM197.5 32C214.5 32 230.7 38.74 242.7 50.75L418.7 226.7C443.7 251.7 443.7 292.3 418.7 317.3L285.3 450.7C260.3 475.7 219.7 475.7 194.7 450.7L18.75 274.7C6.743 262.7 0 246.5 0 229.5V80C0 53.49 21.49 32 48 32L197.5 32zM52.69 240.8L228.7 416.8C234.9 423.1 245.1 423.1 251.3 416.8L384.8 283.3C391.1 277.1 391.1 266.9 384.8 260.7L208.8 84.69C205.8 81.69 201.7 80 197.5 80H48V229.5C48 233.7 49.69 237.8 52.69 240.8L52.69 240.8z"/></svg>
4991                    </span>
4992                                <span class="pr-1 box-border">
4993                    Promotions                </span>
4994            </a>
4995                    </span>
4996            </div>
4997            </div>
4998            <div class="flex flex-wrap grow w-full bg-white">
4999                <div class="bg-primary-alt1 px-6 pt-5 pb-4 w-full">
5000                    <a class="flex items-center w-full no-underline mb-6 mt-1"
5001                       href="https://www.aveve.be/fr/checkout/cart/index/"
5002                    >
5003                        <div class="relative h-6">
5004                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M96 0C107.5 0 117.4 8.19 119.6 19.51L121.1 32H541.8C562.1 32 578.3 52.25 572.6 72.66L518.6 264.7C514.7 278.5 502.1 288 487.8 288H170.7L179.9 336H488C501.3 336 512 346.7 512 360C512 373.3 501.3 384 488 384H159.1C148.5 384 138.6 375.8 136.4 364.5L76.14 48H24C10.75 48 0 37.25 0 24C0 10.75 10.75 0 24 0H96zM475.6 240L520.6 80H131.1L161.6 240H475.6zM128 464C128 437.5 149.5 416 176 416C202.5 416 224 437.5 224 464C224 490.5 202.5 512 176 512C149.5 512 128 490.5 128 464zM512 464C512 490.5 490.5 512 464 512C437.5 512 416 490.5 416 464
5004C416 437.5 437.5 416 464 416C490.5 416 512 437.5 512 464z"/></svg>
5005
5006                            <span x-text="cart.summary_count"
5007                                  class="absolute top-[2px] right-[-2px] hidden w-3.5 h-3.5 -mt-4 -mr-2 text-[9px] font-semibold
5008                                leading-none text-white uppercase transform -translate-x-1
5009                                translate-y-1/2 rounded-full bg-primary"
5010                                  :class="{
5011                                'hidden': !cart.summary_count,
5012                                'flex justify-center items-center': cart.summary_count }"
5013                            ></span>
5014                        </div>
5015
5016                        <span class="label pl-5 font-normal">
5017                            Votre panier                        </span>
5018                    </a>
5019
5020                    <a class="link-navigation flex items-center w-full mb-6"
5021                       href="https&#x3A;&#x2F;&#x2F;www.aveve.be&#x2F;fr&#x2F;magasins&#x2F;">
5022                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M483.4 224C463.8 224 445.8 217.5 431.3 206.8C426.5 203.3 422.2 199.4 418.3 195C414.4 199.3 410.1 203.2 405.4 206.7C390.9 217.5 372.8 224 353.1 224C333.5 224 315.6 217.6 301.1 206.1C296.3 203.4 291.9 199.4 287.9 195C283.9 199.4 279.5 203.4 274.7 206.1C260.2 217.6 242.3 224 222.7 224C203.2 224 185.2 217.6 170.7 206.1C165.9 203.4 161.5 199.4 157.6 195C153.6 199.4 149.1 203.4 144.3 206.1C129.9 217.6 111.1 223.1 92.41 224C92.39 224 92.38 224 92.36 224C88.3 224 84.21 223.7 80.24 223.2C24.92 215.8-1.255 150.6 28.33 103.8L85.66 13.13C90.76 4.979 99.87 0 109.6 0H466.4C476.1 0 485.2 4.978 490.3 13.13L547.6 103.8C577.3 150.7 551 215.8 495.5 223.2C491.6 223.7 487.6 223.1 483.5 224C483.5 224 483.5 224 483.4 224H483.4zM455.6 48H120.4L68.91 129.5C63.12 138.6 62.57 149.9 66.65 159.6C70.57 168.8 77.67 174.4 86.56 175.6C88.57 175.9 90.54 176 92.36 176C104.2 176 114.6 170.9 121.9 162.8C131 152.8 143.1 147 157.6 147C171.1 147 184.1 152.8 193.2 162.8C200.5 170.9 210.9 176 222.7 176C234.6 176 244.1 170.9 252.3 162.8C261.4 152.8 274.3 147 287.9 147C301.5 147 314.4 152.8 323.5 162.8C330.8 170.9 341.3 176 353.1 176C364.9 176 375.3 170.9 382.6 162.8C391.7 152.8 404.6 147 418.2 147C431.7 147 444.7 152.7 453.8 162.8C461.2 170.9 471.7 176 483.4 176C485.4 176 487.3 175.9 489.3 175.6C498.3 174.4 505.4 168.8 509.3 159.6C513.4 149.1 512.9 138.7 507.1 129.5L455.6 48zM464 336V254.4C470.3 255.5 476.8 256 483.4 256C489 256 494.4 255.6 499.7 254.9L499.7 254.9C503.1 254.4 508 253.6 512 252.6V448C512 483.3 483.3 512 448 512H128C92.66 512 64 483.3 64 448V252.6C67.87 253.6 71.86 254.4 75.97 254.9L76.09 254.9C81.35 255.6 86.83 256 92.36 256C99.06 256 105.6 255.4 112 254.4V336H464zM464 384H112V448C112 456.8 119.2 464 128 464H448C456.8 464 464 456.8 464 448V384z"/></svg>
5023
5024                        <span class="pl-5 font-normal">
5025                            Magasins                        </span>
5026                    </a>
5027
5028                    <div class="customer-link-mobile w-full mb-6">
5029                        <!-- BLOCK customer.menu.mobile --><!-- Desktop profile button -->
5030<a  href="https&#x3A;&#x2F;&#x2F;www.aveve.be&#x2F;fr&#x2F;customer&#x2F;account&#x2F;"
5031    id="customer-menu"
5032    class="flex flex-row lg:flex-col items-center text-sm font-normal link-navigation lg:gap-1"
5033    aria-haspopup="true"
5034    aria-expanded="true"
5035    aria-label="My&#x20;Account"
5036    x-data="{ firstName: '' }"
5037    @private-content-loaded.window="firstName = $event.detail.data.customer.firstname;"
5038    >
5039    <div class="relative">
5040        <i>
5041            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon hidden lg:block" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M256 112c-48.6 0-88 39.4-88 88C168 248.6 207.4 288 256 288s88-39.4 88-88C344 151.4 304.6 112 256 112zM256 240c-22.06 0-40-17.95-40-40C216 177.9 233.9 160 256 160s40 17.94 40 40C296 222.1 278.1 240 256 240zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-46.73 0-89.76-15.68-124.5-41.79C148.8 389 182.4 368 220.2 368h71.69c37.75 0 71.31 21.01 88.68 54.21C345.8 448.3 302.7 464 256 464zM416.2 388.5C389.2 346.3 343.2 320 291.8 320H220.2c-51.36 0-97.35 26.25-124.4 68.48C65.96 352.5 48 306.3 48 256c0-114.7 93.31-208 208-208s208 93.31 208 208C464 306.3 446 352.5 416.2 388.5z"/></svg>
5042            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon lg:hidden" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M256 112c-48.6 0-88 39.4-88 88C168 248.6 207.4 288 256 288s88-39.4 88-88C344 151.4 304.6 112 256 112zM256 240c-22.06 0-40-17.95-40-40C216 177.9 233.9 160 256 160s40 17.94 40 40C296 222.1 278.1 240 256 240zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-46.73 0-89.76-15.68-124.5-41.79C148.8 389 182.4 368 220.2 368h71.69c37.75 0 71.31 21.01 88.68 54.21C345.8 448.3 302.7 464 256 464zM416.2 388.5C389.2 346.3 343.2 320 291.8 320H220.2c-51.36 0-97.35 26.25-124.4 68.48C65.96 352.5 48 306.3 48 256c0-114.7 93.31-208 208-208s208 93.31 208 208C464 306.3 446 352.5 416.2 388.5z"/></svg>
5043        </i>
5044        <i x-cloak x-show="firstName" class="absolute -top-1 -right-1 rounded-full bg-primary w-[12px] h-[12px] flex items-center justify-center text-white">
5045            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="7" height="7" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M440.1 103C450.3 112.4 450.3 127.6 440.1 136.1L176.1 400.1C167.6 410.3 152.4 410.3 143 400.1L7.029 264.1C-2.343 255.6-2.343 240.4 7.029 23
50451C16.4 221.7 31.6 221.7 40.97 231L160 350.1L407 103C416.4 93.66 431.6 93.66 440.1 103V103z"/></svg>
5046        </i>
5047    </div>
5048
5049    <span class="customer-name box-border hidden lg:block" x-show="!firstName">MyAveve</span>
5050    <span class="customer-name box-border hidden lg:block" x-show="firstName" x-bind="firstName" x-text="firstName"></span>
5051</a>
5052<!-- /BLOCK customer.menu.mobile -->                    </div>
5053
5054                    <div class="switch-language-mobile w-full">
5055                                    <span class="text-gray font-semibold text-lg w-full pb-2 md:pb-2.5"
5056              id="language-picker-description">
5057            Langue        </span>
5058        <div class="relative flex gap-1 "
5059                    x-data="initLanguageSwitcher()" @language-switcher.window="initializeData($event.detail)"
5060            >
5061                <template x-if="show">
5062            
5063            <div class="flex">
5064                                                                <a lang="NL"
5065                       hreflang="NL"
5066                                                    :href="getHrefByLangId('1')"
5067                                                                       aria-label="NL language"
5068                       tabindex="0"
5069                       role="button"
5070                       class="focus:outline-none focus:shadow-none focus:ring-0 transition flex items-center justify-center rounded-sm text-primary text-sm border border-primary w-10 h-8 btn-focus hover:bg-secondary-alt1 hover:text-white hover:border-secondary-alt1 focus:border-secondary-alt1 focus:bg-secondary-alt1 focus:text-white focus:border-secondary-alt1">
5071                        NL                    </a>
5072                                                                                <a lang="FR"
5073                       hreflang="FR"
5074                       href="javascript:void(0)"
5075                       aria-label="FR language"
5076                       tabindex="0"
5077                       role="button"
5078                       aria-pressed="true"
5079                       class="focus:outline-none focus:shadow-none focus:ring-0 transition flex items-center justify-center bg-primary text-white rounded-sm uppercase text-sm w-10 h-8 btn-focus border focus:border-current focus:bg-secondary-alt1 focus:text-white focus:border-secondary-alt1">
5080                        FR                    </a>
5081                                        </div>
5082                    </template>
5083    
5084                            
5084<script defer>
5085                function initLanguageSwitcher() {
5086                    return {
5087                        langDetails: {},
5088                        show: false,
5089                        initializeData(detail) {
5090                            if (this.show) {
5091                                return;
5092                            }
5093
5094                            this.show = true;
5095                            if (typeof detail === 'object') {
5096                                this.langDetails = detail;
5097                            }
5098                        },
5099                        getHrefByLangId(langId) {
5100                            return this.langDetails[langId] ?? '';
5101                        },
5102                    }
5103                }
5104            </script>
5104
5105            </div>
5106                    </div>
5107                </div>
5108            </div>
5109        </nav>
5110    </div>
5111</div>
5112<script>
5113    'use strict';
5114
5115    const initMenuMobile_6ab4f73f18115 = () => {
5116        return {
5117            mobilePanelActiveId: null,
5118            mobileSubPanelActiveId: null,
5119            open: false,
5120            selected: null,
5121            cart: {},
5122            getData(data) {
5123                if (data.cart) { this.cart = data.cart }
5124            },
5125            toggleScroll() {
5126                this.open === false ? document.documentElement.classList.remove('disable-scroll') : document.documentElement.classList.add('disable-scroll');
5127            }
5128        }
5129    }
5130</script>
5130
5131
5132<div x-data="initMenuDesktop_6ab4f73f75516()"
5133     @resize.window="init()"
5134     class="z-20 order-2 navigation hidden lg:w-full lg:block pb-4 mt-8 3xl:relative"
5135     id="desktop-nav"
5136     @mouseleave="setPanelInactive('');"
5137>
5138    <div x-ref="nav-desktop" class="hidden lg:block lg:min-h-0">
5139        <nav class="w-full flex justify-between z-30">
5140                        <div
5141                id="category-node-6"
5142                @mouseenter="setCurrentHoverPanel('category-node-6')"
5143                                    @mouseenter.debounce.500ms="setPanelActive('category-node-6')"
5144                            >
5145                <div class="transition">
5146                    <span class="flex items-center box-border flex-col relative">
5147                        <a
5148                            class="hover:text-primary level-0 hover-help flex items-center w-full text-base font-normal cursor-pointer transition gap-1"
5149                            tabindex="0"
5150                                                            role="link"
5151                                @keydown.enter="setCurrentHoverPanel('category-node-6'); setPanelActive('category-node-6');"
5152                                                        title="Jardin"
5153                        >
5154                            <span>
5155                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M436.4 32c-91 0-168.3 67.88-194.6 161.4C204.6 134.6 144 96 75.63 96L0 95.1V120C0 247.9 91.75 352 204.4 352H232v104C232 469.2 242.8 480 255.1 480S280 469.2 280 456V288h27.62C420.2 288 512 183.9 512 56V32H436.4zM204.4 304c-79.25 0-145.1-69.75-155.1-160h26.25c79.25 0 145.1 69.75 155.1 160H204.4zM307.6 240h-26.25c10-90.25 75.87-160 155.1-160h26.25C452.8 170.2 386.9 240 307.6 240z"/></svg>
5156                            </span>
5157                            Jardin                                                            <span class="box-border ml-1 transition-transform transform duration-300 ease-in-out"
5158                                      :class="{'rotate-180' : hoverPanelActiveId === 'category-node-6'}">
5159                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="10" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
5160                                </span>
5161                                                    </a>
5162
5163                                                <div
5164                            x-cloak=""
5165                            x-show="hoverPanelActiveId === 'category-node-6'"
5166                            class="z-40 absolute top-full"
5167                            id="category-node-6">
5168                            <svg class="fill-[rgb(var(--color-navigation-background))]" width="44" height="23" viewBox="0 0 44 23" xmlns="http://www.w3.org/2000/svg"><path d="M20.6655 1.1956C21.425 0.515105 22.575 0.515107 23.3345 1.1956L43.2196 19.0104C44.5865 20.2349 43.7202 22.5 41.885 22.5H2.11497C0.279765 22.5 -0.586462 20.2349 0.780425 19.0104L20.6655 1.1956Z"/></svg>
5169                        </div>
5170                                            </span>
5171
5172                                            <template x-if="hoverPanelActiveId === 'category-node-6'">
5173                            <div class="absolute flex z-30 left-0 mt-4 lg:mx-14 w-[100vw] 3xl:ml-0 3xl:w-full">
5174                                <div class="z-30 -ml-[100vw] w-[200vw] h-full absolute bg-[rgb(var(--color-navigation-background))] 3xl:w-[102%] 3xl:ml-[-2%]"></div>
5175                                <div class="z-30 py-11 flex flex-row max-w-[calc(1472px_+_56px)]">
5176                                                                        <div class="flex flex-wrap content-start word-break gap-y-8 mr-6 w-full"
5177                                                                                    x-bind:style="'width: ' + width"
5178                                                                            >
5179                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5180                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/bbq"
5181                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">BBQ</a>
5182                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5183                                                                                                            <li>
5184                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5185                                                               href="https://www.aveve.be/fr/jardin/bbq/barbecue">Barbecue</a>
5186                                                        </li>
5187                                                                                                            <li>
5188                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5189                                                               href="https://www.aveve.be/fr/jardin/bbq/accessoires">Accessoires</a>
5190                                                        </li>
5191                                                                                                            <li>
5192                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5193                                                               href="https://www.aveve.be/fr/jardin/bbq/entretien">Entretien</a>
5194                                                        </li>
5195                                                                                                            <li>
5196                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5197                                                               href="https://www.aveve.be/fr/jardin/bbq/charbon-de-bois-briquettes">Charbon de bois & briquettes</a>
5198                                                        </li>
5199                                                                                                            <li>
5200                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5201                                                               href="https://www.aveve.be/fr/jardin/bbq/materiel-d-allumage">Matériel d’allumage</a>
5202                                                        </li>
5203                                                                                                    </ol>
5204                                            </div>
5205                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5206                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/sol-engrais"
5207                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Sol & engrais</a>
5208                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5209                                                                                                            <li>
5210                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5211                                                               href="https://www.aveve.be/fr/jardin/sol-engrais/engrais">Engrais</a>
5212                                                        </li>
5213                                                                                                            <li>
5214                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5215                                                               href="https://www.aveve.be/fr/jardin/sol-engrais/terreau">Terreau</a>
5216                                                        </li>
5217                                                                                                            <li>
5218                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5219                                                               href="https://www.aveve.be/fr/jardin/sol-engrais/couvre-sols-ecorce-de-bois">Couvre-sols & écorce de bois</a>
5220                                                        </li>
5221                                                                                                            <li>
5222                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5223                                                               href="https://www.aveve.be/fr/jardin/sol-engrais/chaux">Chaux</a>
5224                                                        </li>
5225                                                                                                            <li>
5226                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5227                                                               href="https://www.aveve.be/fr/jardin/sol-engrais/amendement">Amendement</a>
5228                                                        </li>
5229                                                                                                            <li>
5230                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5231                                                               href="https://www.aveve.be/fr/jardin/sol-engrais/epandeurs">Épandeurs</a>
5232                                                        </li>
5233                                                                                                    </ol>
5234                                            </div>
5235                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5236                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/protection-des-plantes"
5237                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Protection des plantes</a>
5238                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5239                                                                                                            <li>
5240                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5241                                                               href="https://www.aveve.be/fr/jardin/protection-des-plantes/desherbant">Désherbant</a>
5242                                                        </li>
5243                                                                                                            <li>
5244                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5245                                                               href="https://www.aveve.be/fr/jardin/protection-des-plantes/fongicide">Fongicide</a>
5246                                                        </li>
5247                                                                                                            <li>
5248                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5249                                                               href="https://www.aveve.be/fr/jardin/protection-des-plantes/insecticides">Insecticides</a>
5250                                                        </li>
5251                                                                                                            <li>
5252                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5253                                                               href="https://www.aveve.be/fr/jardin/protection-des-plantes/controle-de-la-mousse">Contrôle de la mousse</a>
5254                                                        </li>
5255                                                                                                            <li>
5256                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5257                                                               href="https://www.aveve.be/fr/jardin/protection-des-plantes/autres-produits-de-lutte-antiparasitaire">Autres produits de lutte antiparasitaire</a>
5258                                                        </li>
5259                                                                                                    </ol>
5260                                            </div>
5261                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5262                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/antiparasitaire"
5263                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Antiparasitaire</a>
5264                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5265                                                                                                            <li>
5266                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5267                                                               href="https://www.aveve.be/fr/jardin/antiparasitaire/souris-rats">Souris & rats</a>
5268                                                        </li>
5269                                                                                                            <li>
5270                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5271                                                               href="https://www.aveve.be/fr/jardin/antiparasitaire/insectes-rampants-volants">Insectes rampants & volants</a>
5272                                                        </li>
5273                                                                                                            <li>
5274                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5275                                                               href="https://www.aveve.be/fr/jardin/antiparasitaire/taupes">Taupes</a>
5276                                                        </li>
5277                                                                                                            <li>
5278                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5279                                                               href="https://www.aveve.be/fr/jardin/antiparasitaire/limaces">Limaces</a>
5280                                                        </li>
5281                                                                                                            <li>
5282                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5283                                                               href="https://www.aveve.be/fr/jardin/antiparasitaire/fourmis">Fourmis</a>
5284                               
5284                         </li>
5285                                                                                                            <li>
5286                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5287                                                               href="https://www.aveve.be/fr/jardin/antiparasitaire/autres-nuisibles">Autres nuisibles</a>
5288                                                        </li>
5289                                                                                                    </ol>
5290                                            </div>
5291                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5292                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/outils-de-jardinage"
5293                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Outils de jardinage</a>
5294                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5295                                                                                                            <li>
5296                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5297                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outils-de-taille">Outils de taille</a>
5298                                                        </li>
5299                                                                                                            <li>
5300                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5301                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outils-a-manche">Outils à manche</a>
5302                                                        </li>
5303                                                                                                            <li>
5304                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5305                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outillage-a-main">Outillage à main</a>
5306                                                        </li>
5307                                                                                                            <li>
5308                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5309                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/outils-pour-enfants">Outils pour enfants</a>
5310                                                        </li>
5311                                                                                                            <li>
5312                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5313                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/brouettes">Brouettes</a>
5314                                                        </li>
5315                                                                                                            <li>
5316                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5317                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/pulverisateurs">Pulvérisateurs</a>
5318                                                        </li>
5319                                                                                                            <li>
5320                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5321                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/desherbeurs-thermiques">Désherbeurs thermiques</a>
5322                                                        </li>
5323                                                                                                            <li>
5324                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5325                                                               href="https://www.aveve.be/fr/jardin/outils-de-jardinage/autres-outils">Autres outils</a>
5326                                                        </li>
5327                                                                                                    </ol>
5328                                            </div>
5329                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5330                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/machines-de-jardinage"
5331                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">
5331Machines de jardinage</a>
5332                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5333                                                                                                            <li>
5334                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5335                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/tondeuses">Tondeuses</a>
5336                                                        </li>
5337                                                                                                            <li>
5338                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5339                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/scarificateurs-electriques">Scarificateurs électriques</a>
5340                                                        </li>
5341                                                                                                            <li>
5342                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5343                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/souffleurs-de-feuilles">Souffleurs de feuilles</a>
5344                                                        </li>
5345                                                                                                            <li>
5346                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5347                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/taille-haies">Taille-haies</a>
5348                                                        </li>
5349                                                                                                            <li>
5350                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5351                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/tronconneuses">Tronçonneuses</a>
5352                                                        </li>
5353                                                                                                            <li>
5354                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5355                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/nettoyeurs-haute-pression">Nettoyeurs haute pression</a>
5356                                                        </li>
5357                                                                                                            <li>
5358                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5359                                                               href="https://www.aveve.be/fr/jardin/machines-de-jardinage/aspirateurs">Aspirateurs</a>
5360                                                        </li>
5361                                                                                                    </ol>
5362                                            </div>
5363                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5364                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture"
5365                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Serres & matériel de culture</a>
5366                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5367                                                                                                            <li>
5368                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5369                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/fournitures-de-culture">Fournitures de culture</a>
5370                                                        </li>
5371                                                                                                            <li>
5372                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5373                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/carres-potagers">Carrés potagers</a>
5374                                                        </li>
5375                                                                                                            <li>
5376                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5377                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/serres">Serres</a>
5378                                                        </li>
5379                                                                                                            <li>
5380                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5381                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/accessoires-serres">Accessoires serres</a>
5382                                                        </li>
5383                                                                                                            <li>
5384                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5385                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/materiaux-de-fixation-pour-plantes">Matériaux de fixation pour plantes</a>
5386                                                        </li>
5387                                                                                                            <li>
5388                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5389                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/toiles-de-sol-films-protecteur">Toiles de sol & films protecteur</a>
5390                                                        </li>
5391                                                                                                            <li>
5392                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5393                                                               href="https://www.aveve.be/fr/jardin/serres-materiel-de-culture/bacs-a-compost">Bacs à compost</a>
5394                                                        </li>
5395                                                                                                    </ol>
5396                                            </div>
5397                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5398                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs"
5399                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Semences & bulbes à fleurs</a>
5400                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5401                                                                                                            <li>
5402                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5403                                                               href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/semence-de-gazon">Semence de gazon</a>
5404                                                        </li>
5405                                                                                                            <li>
5406                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5407                                                               href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/semences-de-jardin">Semences de jardin</a>
5408                                                        </li>
5409                                                                                                            <li>
5410                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5411                                                               href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/bulbes-a-fleurs">Bulbes à fleurs</a>
5412                                                        </li>
5413                                                                                                            <li>
5414                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5415                                                               href="https://www.aveve.be/fr/jardin/semences-bulbes-a-fleurs/plants-et-oignons">Plants et oignons</a>
5416                                                        </li>
5417                                                                                                    </ol>
5418                                            </div>
5419                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5420                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/plantes"
5421                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Plantes</a>
5422                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5423                                                                                                            <li>
5424                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5425                                                               href="https://www.aveve.be/fr/jardin/plantes/plantes-d-exterieur">Plantes d'extérieur</a>
5426                                                        </li>
5427                                                                                                            <li>
5428                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5429                                                               href="https://www.aveve.be/fr/jardin/plantes/plantes-d-interieur">Plantes d'intérieur</a>
5430                                                        </li>
5431                                                                                                            <li>
5432                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5433                                                               href="https://www.aveve.be/fr/jardin/plantes/herbes">Herbes</a>
5434                                                        </li>
5435                                                                                                    </ol>
5436                                            </div>
5437                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5438                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/arrosage"
5439                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Arrosage</a>
5440                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5441                                                                                                            <li>
5442                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5443                                                               href="https://www.aveve.be/fr/jardin/arrosage/arrosoirs">Arrosoirs</a>
5444                                                        </li>
5445                                                                                                            <li>
5446                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5447                                                               href="https://www.aveve.be/fr/jardin/arrosage/tuyaux-d-arrosage">Tuyaux d’arrosage</a>
5448                                                        </li>
5449                                                                                                            <li>
5450                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5451                                                               href="https://www.aveve.be/fr/jardin/arrosage/tonneaux-de-pluie">Tonneaux de pluie</a>
5452                                                        </li>
5453                                                                                                            <li>
5454                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5455                                                               href="https://www.aveve.be/fr/jardin/arrosage/raccords-de-tuyaux">Raccords de tuyaux</a>
5456                                                        </li>
5457                                                                                                            <li>
5458                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5459                                                               href="https://www.aveve.be/fr/jardin/arrosage/arrosage-automatique">Arrosage automatique</a>
5460                                                        </li>
5461                                                                                                            <li>
5462                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5463                                                               href="https://www.aveve.be/fr/jardin/arrosage/arroseurs-de-jardin">Arroseurs de jardin</a>
5464                                                        </li>
5465                                                                                                            <li>
5466                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5467                                                               href="https://www.aveve.be/fr/jardin/arrosage/pompes-a-eau">Pompes à eau</a>
5468                                                        </li>
5469                                                                                                    </ol>
5470                                            </div>
5471                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5472                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres"
5473                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Pots de fleurs & jardinières</a>
5474                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5475                                                                                       
5475                     <li>
5476                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5477                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/pots-de-fleurs">Pots de fleurs</a>
5478                                                        </li>
5479                                                                                                            <li>
5480                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5481                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/jardiniere">Jardinière</a>
5482                                                        </li>
5483                                                                                                            <li>
5484                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5485                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/pots-suspendus">Pots suspendus</a>
5486                                                        </li>
5487                                                                                                            <li>
5488                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5489                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/sous-plat-pots-de-fleurs">Sous-plat pots de fleurs</a>
5490                                                        </li>
5491                                                                                                            <li>
5492                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5493                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/hydrogranules">Hydrogranulés</a>
5494                                                        </li>
5495                                                                                                            <li>
5496                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5497                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/accessoires">Accessoires</a>
5498                                                        </li>
5499                                                                                                            <li>
5500                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5501                                                               href="https://www.aveve.be/fr/jardin/pots-de-fleurs-jardinieres/paniers-a-plantes">Paniers à plantes</a>
5502                                                        </li>
5503                                                                                                    </ol>
5504                                            </div>
5505                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5506                                                <a id="nav-jardin-main-level-2" href="https://www.aveve.be/fr/jardin/autre-categories"
5507                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Autre catégories</a>
5508                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5509                                                                                                            <li>
5510                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5511                                                               href="https://www.aveve.be/fr/jardin/autre-categories/vetements-de-jardin">Vêtements de jardin</a>
5512                                                        </li>
5513                                                                                                            <li>
5514                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5515                                                               href="https://www.aveve.be/fr/jardin/autre-categories/fleurs-artificielles">Fleurs artificielles</a>
5516                                                        </li>
5517                                                                                                            <li>
5518                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5519                                                               href="https://www.aveve.be/fr/jardin/autre-categories/entretien-nettoyage-droguerie">Entretien, nettoyage & droguerie</a>
5520                                                        </li>
5521                                                                                                            <li>
5522                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5523                                                               href="https://www.aveve.be/fr/jardin/autre-categories/combustibles">Combustibles</a>
5524                                                        </li>
5525                                                                                                            <li>
5526                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5527                                                               href="https://www.aveve.be/fr/jardin/autre-categories/amenagement-de-jardin-clotures">Aménagement de jardin & clôtures</a>
5528                                                        </li>
5529                                                                                                            <li>
5530                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5531                                                               href="https://www.aveve.be/fr/jardin/autre-categories/eclairage-de-jardin-chauffage-de
5531-terrasse">Éclairage de jardin & chauffage de terrasse</a>
5532                                                        </li>
5533                                                                                                            <li>
5534                                                            <a id="nav-jardin-main-level-3" class="hover:text-primary"
5535                                                               href="https://www.aveve.be/fr/jardin/autre-categories/piscine-etang">Piscine & étang</a>
5536                                                        </li>
5537                                                                                                    </ol>
5538                                            </div>
5539                                                                            </div>
5540                                </div>
5541
5542                                                                                                        <div class="bg-secondary-alt1 w-full py-11 z-40 text-white relative">
5543                                        <div class="h-full px-6 mx-23xl:max-w-min 3xl:min-w-fit relative" x-bind:style="'width: ' + sidebarWidth">
5544                                                                                                                                            <section class="flex flex-col">
5545                                                    <p class="font-semibold opacity-60 text-white"></p>
5546                                                    <ul class="text-sm">
5547                                                                                                                    <li class="hover:text-positive">
5548                                                                                                                                <a id="nav-jardin-side-gift" href="https://www.aveve.be/fr/cheque-cadeau">Chèque-cadeau</a>
5549                                                            </li>
5550                                                                                                            </ul>
5551                                                </section>
5552                                                                                                                                                                                        <section class="flex flex-col mt-8">
5553                                                    <p class="font-semibold opacity-60 text-white mb-4">Laissez-vous inspirer</p>
5554
5555                                                    <div class="flex flex-col text-white gap-6">
5556                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
5557                                                                                                                                                                                                                                                                <a id="nav-jardin-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/inspiration/gazon/semer-gazon/">
5558                                                                    <p class="opacity-60"> Semer ou réparer un gazon</p>
5559                                                                    <p class="font-semibold group-hover:text-positive">Quand semer de l’herbe, comment vous y prendre, et quelles sont les différences entre les divers types de semences de gazon ?</p>
5560                                                                </a>
5561                                                            </div>
5562                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
5563                                                                                                                                                                                                                                                                <a id="nav-jardin-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/reduction-de-la-tourbe/">
5564                                                                    <p class="opacity-60">Tourbe</p>
5565                                                                    <p class="font-semibold group-hover:text-positive">Moins de tourbe, c’est meilleur pour le climat</p>
5566                                                                </a>
5567                                                            </div>
5568                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
5569                                                                                                                                                                                                                                                                <a id="nav-jardin-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/ins
5569piration/jardin/">
5570                                                                    <p class="opacity-60">Découvrez nos autres articles d'inspiration</p>
5571                                                                    <p class="font-semibold group-hover:text-positive">Jardin</p>
5572                                                                </a>
5573                                                            </div>
5574                                                                                                            </div>
5575                                                </section>
5576                                                                                                                                                                                        <section class="flex flex-col mt-8">
5577                                                    <p class="font-semibold opacity-60 text-white">Services</p>
5578                                                    <ul class="text-sm">
5579                                                                                                                    <li class="hover:text-positive">
5580                                                                                                                                <a id="nav-jardin-side-services" href="https://www.aveve.be/fr/jardin/sol-engrais/couvre-sols-ecorce-de-bois?product_brand%5B0%5D=Agaris">Écorce de bois en emballage en vrac</a>
5581                                                            </li>
5582                                                                                                                    <li class="hover:text-positive">
5583                                                                                                                                <a id="nav-jardin-side-services" href="https://www.aveve.be/fr/tondeuses-robots">Conseils sur les tondeuses robotisées</a>
5584                                                            </li>
5585                                                                                                                    <li class="hover:text-positive">
5586                                                                                                                                <a id="nav-jardin-side-services" href="https://www.aveve.be/fr/ateliers/">Nos ateliers et démonstrations</a>
5587                                                            </li>
5588                                                                                                            </ul>
5589                                                </section>
5590                                                                                        <i class="absolute right-0 -bottom-10 opacity-40 3xl:pr-5">
5591                                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon w-full" width="127" height="127" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M436.4 32c-91 0-168.3 67.88-194.6 161.4C204.6 134.6 144 96 75.63 96L0 95.1V120C0 247.9 91.75 352 204.4 352H232v104C232 469.2 242.8 480 255.1 480S280 469.2 280 456V288h27.62C420.2 288 512 183.9 512 56V32H436.4zM204.4 304c-79.25 0-145.1-69.75-155.1-160h26.25c79.25 0 145.1 69.75 155.1 160H204.4zM307.6 240h-26.25c10-90.25 75.87-160 155.1-160h26.25C452.8 170.2 386.9 240 307.6 240z"/></svg>
5592                                            </i>
5593                                        </div>
5594                                    </div>
5595                                                            </div>
5596                        </template>
5597                                    </div>
5598            </div>
5599                        <div
5600                id="category-node-345"
5601                @mouseenter="setCurrentHoverPanel('category-node-345')"
5602                                    @mouseenter.debounce.500ms="setPanelActive('category-node-345')"
5603                            >
5604                <div class="transition">
5605                    <span class="flex items-center box-border flex-col relative">
5606                        <a
5607                            class="hover:text-primary level-0 hover-help flex items-center w-full text-base font-normal cursor-pointer transition gap-1"
5608                            tabindex="0"
5609                                                            role="link"
5610                                @keydown.enter="setCurrentHoverPanel('category-node-345'); setPanelActive('category-node-345');"
5611                                                        title="Animaux"
5612                        >
5613                            <span>
5614                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M74.89 286.8c29.12-7 44.25-40.75 33.87-75.37C99.64 181 73.88 159.1 48.01 159.1c-3.625 0-7.24 .3849-10.86 1.26c-29.12 7-44.25 40.75-33.87 75.37c9.124 30.38 34.88 51.38 60.76 51.38C67.65 288 71.26 287.6 74.89 286.8zM318.5 190.6C322.1 191.5 325.7 192 329.3 192c27.75 0 56.16-26.88 66.66-65.25c11.87-43.38-3.625-85.25-34.5-93.37C357.9 32.5 354.3 32 350.7 32c-27.75 0-56.16 26.75-66.66 65.25C272.1 140.6 287.6 182.5 318.5 190.6zM474.9 161.3c-3.625-.875-7.24-1.26-10.86-1.26c-25.87 0-51.63 21.01-60.75 51.38c-10.37 34.63 4.75 68.37 33.87 75.37c3.625 .875 7.238 1.259 10.86 1.259c25.87 0 51.63-21.01 60.76-51.38C519.1 202 503.1 168.3 474.9 161.3zM182.7 192c3.625 0 7.207-.5006 10.83-1.376C224.4 182.5 239.9 140.6 228 97.25C217.5 58.88 189.1 32 161.3 32C157.7 32 154.1 32.5 150.5 33.38c-30.87 8.125-46.37 49.1-34.5 93.37C126.5 165.1 154.9 192 182.7 192zM256 224c-79.37 0-191.1 122.7-191.1 200.2C64.02 459.1 90.76 480 135.8 480C184.6 480 216.9 454.9 256 454.9C295.5 454.9 327.9 480 376.2 480c44.1 0 71.74-20.87 71.74-55.75C447.1 346.8 335.4 224 256 224zM399.7 427.1C398.9 428.1 392.1 432 376.2 432c-17.75 0-33.25-5.125-51.37-11.12c-19.87-6.5-42.37-14-68.87-14c-26.25 0-48.62 7.5-68.37 14C169.5 426.9 153.8 432 135.8 432c-15.87 0-22.62-3.875-23.37-4.625c-.125-.25-.375-1.25-.375-3.125C112 370.1 204.9 272 256 272s143.1 98.13 143.1 152.2C399.1 426.1 399.7 427.1 399.7 427.1z"/></svg>
5615                            </span>
5616                            Animaux                                                            <span class="box-border ml-1 transition-transform transform duration-300 ease-in-out"
5617                                      :class="{'rotate-180' : hoverPanelActiveId === 'category-node-345'}">
5618                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="10" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
5619                                </span>
5620                                                    </a>
5621
5622                                                <div
5623                            x-cloak=""
5624                            x-show="hoverPanelActiveId === 'category-node-345'"
5625                            class="z-40 absolute top-full"
5626                            id="category-node-345">
5627                            <svg class="fill-[rgb(var(--color-navigation-background))]" width="44" height="23" viewBox="0 0 44 23" xmlns="http://www.w3.org/2000/svg"><path d="M20.6655 1.1956C21.425 0.515105 22.575 0.515107 23.3345 1.1956L43.2196 19.0104C44.5865 20.2349 43.7202 22.5 41.885 22.5H2.11497C0.279765 22.5 -0.586462 20.2349 0.780425 19.0104L20.6655 1.1956Z"/></svg>
5628                        </div>
5629                                            </span>
5630
5631                                            <template x-if="hoverPanelActiveId === 'category-node-345'">
5632                            <div class="absolute flex z-30 left-0 mt-4 lg:mx-14 w-[100vw] 3xl:ml-0 3xl:w-full">
5633                                <div class="z-30 -ml-[100vw] w-[200vw] h-full absolute bg-[rgb(var(--color-navigation-background))] 3xl:w-[102%] 3xl:ml-[-2%]"></div>
5634                                <div class="z-30 py-11 flex flex-row max-w-[calc(1472px_+_56px)]">
5635                                                                        <div class="flex flex-wrap content-start word-break gap-y-8 mr-6 w-full"
5636                                                                                    x-bind:style="'width: ' + width"
5637                                                                            >
5638                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5639                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/chien"
5640                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Chien</a>
5641                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5642                                                                                                            <li>
5643                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5644                                                               href="https://www.aveve.be/fr/animaux/chien/aliments">Aliments</a>
5645                                                        </li>
5646                                                                                                            <li>
5647                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5648                                                               href="https://www.aveve.be/fr/animaux/chien/snacks">Snacks</a>
5649                                                        </li>
5650                                                                                                            <li>
5651                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5652                                                               href="https://www.aveve.be/fr/animaux/chien/complements-alimentaires">Compléments alimentaires</a>
5653                                                        </li>
5654                                                                                                            <li>
5655                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5656                                                               href="https://www.aveve.be/fr/animaux/chien/jouets">Jouets</a>
5657                                                        </li>
5658                                                                                                            <li>
5659                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5660                                                               href="https://www.aveve.be/fr/animaux/chien/colliers-et-laisse
5660s">Colliers et laisses</a>
5661                                                        </li>
5662                                                                                                            <li>
5663                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5664                                                               href="https://www.aveve.be/fr/animaux/chien/medailles-pour-chiens">Médailles pour chiens</a>
5665                                                        </li>
5666                                                                                                            <li>
5667                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5668                                                               href="https://www.aveve.be/fr/animaux/chien/cages-coussins-transport">Cages, coussins & transport</a>
5669                                                        </li>
5670                                                                                                            <li>
5671                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5672                                                               href="https://www.aveve.be/fr/animaux/chien/mangeoires-abreuvoirs">Mangeoires & abreuvoirs</a>
5673                                                        </li>
5674                                                                                                            <li>
5675                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5676                                                               href="https://www.aveve.be/fr/animaux/chien/produits-de-soin">Produits de soin</a>
5677                                                        </li>
5678                                                                                                            <li>
5679                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5680                                                               href="https://www.aveve.be/fr/animaux/chien/cooling">Cooling</a>
5681                                                        </li>
5682                                                                                                            <li>
5683                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5684                                                               href="https://www.aveve.be/fr/animaux/chien/visibilite-dans-l-obscurite">Visibilité dans l’obscurité</a>
5685                                                        </li>
5686                                                                                                    </ol>
5687                                            </div>
5688                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5689                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/chat"
5690                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Chat</a>
5691                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5692                                                                                                            <li>
5693                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5694                                                               href="https://www.aveve.be/fr/animaux/chat/aliments">Aliments</a>
5695                                                        </li>
5696                                                                                                            <li>
5697                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5698                                                               href="https://www.aveve.be/fr/animaux/chat/snacks">Snacks</a>
5699                                                        </li>
5700                                                                                                            <li>
5701                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5702                                                               href="https://www.aveve.be/fr/animaux/chat/complements-alimentaires">Compléments alimentaires</a>
5703                                                        </li>
5704                                                                                                            <li>
5705                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5706                                                               href="https://www.aveve.be/fr/animaux/chat/litiere-pour-chats-bacs-a-litiere">Litière pour chats & bacs à litière</a>
5707                                                        </li>
5708                                                                                                            <li>
5709                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5710                                                               href="https://www.aveve.be/fr/animaux/chat/jouets">Jouets</a>
5711                                                        </li>
5712                                                                                                            <li>
5713                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5714                                                               href="https://www.aveve.be/fr/animaux/chat/medailles-pour-chats">Médailles pour chats</a>
5715                                                        </li>
5716                                                                                                            <li>
5717                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5718                                                               href="https://www.aveve.be/fr/animaux/chat/griffoirs-arbres-a-chats">Griffoirs & arbres à chats</a>
5719                                                        </li>
5720                                                                                                            <li>
5721                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5722                                                               href="https://www.aveve.be/fr/animaux/chat/transport-coussins">Transport & coussins</a>
5723                                                        </li>
5724                                                                                                            <li>
5725                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5726                                                               href="https://www.aveve.be/fr/animaux/chat/mangeoires-abreuvoirs">Mangeoires & abreuvoirs</a>
5727                                                        </li>
5728                                                                                                            <li>
5729                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5730                                                               href="https://www.aveve.be/fr/animaux/chat/produits-de-soin">Produits de soin</a>
5731                                                        </li>
5732                                                                                                    </ol>
5733                                            </div>
5734                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5735                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/poule"
5736                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Poule</a>
5737                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5738                                                                                                            <li>
5739                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5740                                                               href="https://www.aveve.be/fr/animaux/poule/aliments">Aliments</a>
5741                                                        </li>
5742                                                                                                            <li>
5743                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5744                                                               href="https://www.aveve.be/fr/animaux/poule/snacks">Snacks</a>
5745                                                        </li>
5746                                                                                                            <li>
5747                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5748                                                               href="https://www.aveve.be/fr/animaux/poule/poulaillers">Poulaillers</a>
5749                                                        </li>
5750                                                                                                            <li>
5751                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5752                                                               href="https://www.aveve.be/fr/animaux/poule/mangeoires-abreuvoirs">Mangeoires & abreuvoirs</a>
5753                                                        </li>
5754                                                                                                            <li>
5755                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5756                                                               href="https://www.aveve.be/fr/animaux/poule/produits-de-soin">Produits de soin</a>
5757                                                        </li>
5758                                                                                                            <li>
5759                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5760                                                               href="https://www.aveve.be/fr/animaux/poule/litiere-pour-poules">Litière pour poules</a>
5761                                                        </li>
5762                                                                                                    </ol>
5763                                            </div>
5764                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5765                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/cheval"
5766                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Cheval</a>
5767                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5768                                                                                                            <li>
5769                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5770                                                               href="https://www.aveve.be/fr/animaux/cheval/aliments-foin">Aliments & foin</a>
5771                                                        </li>
5772                                                                                                            <li>
5773                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5774                                                               href="https://www.aveve.be/fr/animaux/cheval/snacks">Snacks</a>
5775                                                        </li>
5776                                                                                                            <li>
5777                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5778                                                               href="https://www.aveve.be/fr/animaux/cheval/complements-alimentaires">Compléments alimentaires</a>
5779                                                        </li>
5780                                                                                                            <li>
5781                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5782                                                               href="https://www.aveve.be/fr/animaux/cheval/produits-de-soin">Produits de soin</a>
5783                                                        </li>
5784                                                                                                            <li>
5785                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5786                                                               href="https://www.aveve.be/fr/animaux/cheval/nettoyage">Nettoyage</a>
5787                                                        </li>
5788                                                                                                            <li>
5789                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5790                                                               href="https://www.aveve.be/fr/animaux/cheval/litiere-pour-chevaux">Litière pour chevaux</a>
5791                                                        </li>
5792                                                                                                            <li>
5793                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5794                                                               href="https://www.aveve.be/fr/animaux/cheval/materiel-d-ecurie">Matériel d’écurie</a>
5795                                                        </li>
5796                                                                                                            <li>
5797                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5798                                                               href="https://www.aveve.be/fr/animaux/cheval/accessoires">Accessoires</a>
5799                                                        </li>
5800                                                                                                    </ol>
5801                                            </div>
5802                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5803                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/lapins-rongeurs"
5804                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Lapins & rongeurs</a>
5805                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5806                                                                                                            <li>
5807                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5808                                                               href="https://www.aveve.be/fr/animaux/lapins-ron
5808geurs/aliments-foin">Aliments & foin</a>
5809                                                        </li>
5810                                                                                                            <li>
5811                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5812                                                               href="https://www.aveve.be/fr/animaux/lapins-rongeurs/snacks">Snacks</a>
5813                                                        </li>
5814                                                                                                            <li>
5815                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5816                                                               href="https://www.aveve.be/fr/animaux/lapins-rongeurs/litiere-pour-lapins-rongeurs">Litière pour lapins & rongeurs</a>
5817                                                        </li>
5818                                                                                                            <li>
5819                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5820                                                               href="https://www.aveve.be/fr/animaux/lapins-rongeurs/produits-de-soin">Produits de soin</a>
5821                                                        </li>
5822                                                                                                            <li>
5823                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5824                                                               href="https://www.aveve.be/fr/animaux/lapins-rongeurs/mangeoires-abreuvoirs">Mangeoires & abreuvoirs</a>
5825                                                        </li>
5826                                                                                                            <li>
5827                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5828                                                               href="https://www.aveve.be/fr/animaux/lapins-rongeurs/cages-pour-rongeurs">Cages pour rongeurs</a>
5829                                                        </li>
5830                                                                                                    </ol>
5831                                            </div>
5832                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5833                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/pigeons"
5834                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Pigeons</a>
5835                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5836                                                                                                            <li>
5837                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5838                                                               href="https://www.aveve.be/fr/animaux/pigeons/aliments">Aliments</a>
5839                                                        </li>
5840                                                                                                            <li>
5841                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5842                                                               href="https://www.aveve.be/fr/animaux/pigeons/supplements">Suppléments</a>
5843                                                        </li>
5844                                                                                                            <li>
5845                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5846                                                               href="https://www.aveve.be/fr/animaux/pigeons/accessoires">Accessoires</a>
5847                                                        </li>
5848                                                                                                    </ol>
5849                                            </div>
5850                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5851                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme"
5852                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Moutons & petits animaux de la ferme</a>
5853                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5854                                                                                                            <li>
5855                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5856                                                               href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme/aliments">Aliments</a>
5857                                                        </li>
5858                                                                                                            <li>
5859                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5860                                                               href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme/snacks">Snacks</a>
5861                                                        </li>
5862                                                                                                            <li>
5863                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5864                                                               href="https://www.aveve.be/fr/animaux/moutons-petits-animaux-de-la-ferme/produits-de-soin">Produits de soin</a>
5865                                                        </li>
5866                                                                                                    </ol>
5867                                            </div>
5868                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5869                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement"
5870                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Oiseaux d’ornement</a>
5871                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5872                                                                                                            <li>
5873                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5874                                                               href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/aliments">Aliments</a>
5875                                                        </li>
5876                                                                                                            <li>
5877                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5878                                                               href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/snacks">Snacks</a>
5879                                                        </li>
5880                                                                                                            <li>
5881                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5882                                                               href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/couvre-sol-pour-cage">Couvre sol pour cage</a>
5883                                                        </li>
5884                                                                                                            <li>
5885                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5886                                                               href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/produits-de-soin">Produits de soin</a>
5887                                                        </li>
5888                                                                                                            <li>
5889                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5890                                                               href="https://www.aveve.be/fr/animaux/oiseaux-d-ornement/cages-accessoires">Cages & accessoires</a>
5891                                                        </li>
5892                                                                                                    </ol>
5893                                            </div>
5894                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5895                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/animaux-du-jardin"
5896                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Animaux du jardin</a>
5897                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5898                                                                                                            <li>
5899                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5900                                                               href="https://www.aveve.be/fr/animaux/animaux-du-jardin/aliments-et-snacks">Aliments et snacks</a>
5901                                                        </li>
5902                                                                                                            <li>
5903                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5904                                                               href="https://www.aveve.be/fr/animaux/animaux-du-jardin/systemes-d-alimentation">Systèmes d’alimentation</a>
5905                                                        </li>
5906                                                                                                            <li>
5907                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5908                                                               href="https://www.aveve.be/fr/animaux/animaux-du-jardin/abris">Abris</a>
5909                                                        </li>
5910                                                                                                    </ol>
5911                                            </div>
5912                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5913                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/poissons"
5914                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Poissons</a>
5915                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5916                                                                                                            <li>
5917                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5918                                                               href="https://www.aveve.be/fr/animaux/poissons/aliments">Aliments</a>
5919                                                        </li>
5920                                                                                                    </ol>
5921                                            </div>
5922                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
5923                                                <a id="nav-animaux-main-level-2" href="https://www.aveve.be/fr/animaux/clotures-pour-prairies"
5924                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Clôtures pour prairies</a>
5925                                                <ol class="text-sm flex flex-col gap-1 font-normal">
5926                                                                                                            <li>
5927                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5928                                                               href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/poteau-de-cloture">Poteau de clôture</a>
5929                                                        </li>
5930                                                                                                            <li>
5931                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5932                                                               href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/batteries-piles">Batteries & piles</a>
5933                                                        </li>
5934                                                                                                            <li>
5935                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5936                                                               href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/isolateurs">Isolateurs</a>
5937                                                        </li>
5938                                                                                                            <li>
5939                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5940                                                               href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/poignees-de-porte">
5940Poignées de porte</a>
5941                                                        </li>
5942                                                                                                            <li>
5943                                                            <a id="nav-animaux-main-level-3" class="hover:text-primary"
5944                                                               href="https://www.aveve.be/fr/animaux/clotures-pour-prairies/ruban-fil-electrique">Ruban & fil électrique</a>
5945                                                        </li>
5946                                                                                                    </ol>
5947                                            </div>
5948                                                                            </div>
5949                                </div>
5950
5951                                                                                                        <div class="bg-secondary-alt1 w-full py-11 z-40 text-white relative">
5952                                        <div class="h-full px-6 mx-23xl:max-w-min 3xl:min-w-fit relative" x-bind:style="'width: ' + sidebarWidth">
5953                                                                                                                                            <section class="flex flex-col">
5954                                                    <p class="font-semibold opacity-60 text-white"></p>
5955                                                    <ul class="text-sm">
5956                                                                                                                    <li class="hover:text-positive">
5957                                                                                                                                <a id="nav-animaux-side-gift" href="https://www.aveve.be/fr/cheque-cadeau">Chèque-cadeau</a>
5958                                                            </li>
5959                                                                                                            </ul>
5960                                                </section>
5961                                                                                                                                                                                        <section class="flex flex-col mt-8">
5962                                                    <p class="font-semibold opacity-60 text-white mb-4">Laissez-vous inspirer</p>
5963
5964                                                    <div class="flex flex-col text-white gap-6">
5965                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
5966                                                                                                                                                                                                                                                                <a id="nav-animaux-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/inspiration/chat/alimentation-saine/">
5967                                                                    <p class="opacity-60">Chat</p>
5968                                                                    <p class="font-semibold group-hover:text-positive">Croquettes ou nourriture humide pour votre chat : comment les combiner, en quelles quantités, et bien plus encore</p>
5969                                                                </a>
5970                                                            </div>
5971                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
5972                                                                                                                                                                                                                                                                <a id="nav-animaux-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/ins
5972piration/poule/bon-depart/">
5973                                                                    <p class="opacity-60">Poule</p>
5974                                                                    <p class="font-semibold group-hover:text-positive">Élever des poules pour les nuls : un bon départ</p>
5975                                                                </a>
5976                                                            </div>
5977                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
5978                                                                                                                                                                                                                                                                <a id="nav-animaux-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/inspiration/animaux/">
5979                                                                    <p class="opacity-60">Découvrez nos autres articles d'inspiration</p>
5980                                                                    <p class="font-semibold group-hover:text-positive">Animaux</p>
5981                                                                </a>
5982                                                            </div>
5983                                                                                                            </div>
5984                                                </section>
5985                                                                                                                                                                                        <section class="flex flex-col mt-8">
5986                                                    <p class="font-semibold opacity-60 text-white">Services</p>
5987                                                    <ul class="text-sm">
5988                                                                                                                    <li class="hover:text-positive">
5989                                                                                                                                <a id="nav-animaux-side-services" href="https://www.aveve.be/fr/medailles-pour-chiens-et-chats/">Médaille chien personnalisé</a>
5990                                                            </li>
5991                                                                                                                    <li class="hover:text-positive">
5992                                                                                                                                <a id="nav-animaux-side-services" href="https://www.aveve.be/fr/medailles-pour-chiens-et-chats/">Médaille chat personnalisé</a>
5993                                                            </li>
5994                                                                                                                    <li class="hover:text-positive">
5995                                                                                                                                <a id="nav-animaux-side-services" href="https://www.aveve.be/fr/assurance-pour-animaux-petexpert/">Assurance KBC PetExpert pour chats et chiens</a>
5996                                                            </li>
5997                                                                                                                    <li class="hover:text-positive">
5998                                                                                                                                <a id="nav-animaux-side-services" href="https://www.aveve.be/fr/nettoyage-couvertures-chevaux/">Nettoyage couvertures chevaux</a>
5999                                                            </li>
6000                                                                                                                    <li class="hover:text-positive">
6001                                                                                                                                <a id="nav-animaux-side-services" href="https://www.aveve.be/fr/ateliers/">Nos ateliers et démonstrations</a>
6002                                                            </li>
6003                                                                                                            </ul>
6004                                                </section>
6005                                                                                        <i class="absolute right-0 -bottom-10 opacity-40 3xl:pr-5">
6006                                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon w-full" width="127" height="127" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M74.89 286.8c29.12-7 44.25-40.75 33.87-75.37C99.64 181 73.88 159.1 48.01 159.1c-3.625 0-7.24 .3849-10.86 1.26c-29.12 7-44.25 40.75-33.87 75.37c9.124 30.38 34.88 51.38 60.76 51.38C67.65 288 71.26 287.6 74.89 286.8zM318.5 190.6C322.1 191.5 325.7 192 329.3 192c27.75 0 56.16-26.88 66.66-65.25c11.87-43.38-3.625-85.25-34.5-93.37C357.9 32.5 354.3 32 350.7 32c-27.75 0-56.16 26.75-66.66 65.25C272.1 140.6 287.6 182.5 318.5 190.6zM474.9 161.3c-3.625-.875-7.24-1.26-10.86-1.26c-25.87 0-51.63 21.01-60.75 51.38c-10.37 34.63 4.75 68.37 33.87 75.37c3.625 .875 7.238 1.259 10.86 1.259c25.87 0 51.63-21.01 60.76-51.38C519.1 202 503.1 168.3 474.9 161.3zM182.7 192c3.625 0 7.207-.5006 10.83-1.376C224.4 182.5 239.9 140.6 228 97.25C217.5 58.88 189.1 32 161.3 32C157.7 32 154.1 32.5 150.5 33.38c-30.87 8.125-46.37 49.1-34.5 93.37C126.5 165.1 154.9 192 182.7 192zM256 224c-79.37 0-191.1 122.7-191.1 200.2C64.02 459.1 90.76 480 135.8 480C184.6 480 216.9 454.9 256 454.9C295.5 454.9 327.9 480 376.2 480c44.1 0 71.74-20.87 71.74-55.75C447.1 346.8 335.4 224 256 224zM399.7 427.1C398.9 428.1 392.1 432 376.2 432c-17.75 0-33.25-5.125-51.37-11.12c-19.87-6.5-42.37-14-68.87-14c-26.25 0-48.62 7.5-68.37 14C169.5 426.9 153.8 432 135.8 432c-15.87 0-22.62-3.875-23.37-4.625c-.125-.25-.375-1.25-.375-3.125C112 370.1 204.9 272 256 272s143.1 98.13 143.1 152.2C399.1 426.1 399.7 427.1 399.7 427.1z"/></svg>
6007                                            </i>
6008                                        </div>
6009                                    </div>
6010                                                            </div>
6011                        </template>
6012                                    </div>
6013            </div>
6014                        <div
6015                id="category-node-570"
6016                @mouseenter="setCurrentHoverPanel('category-node-570')"
6017                                    @mouseenter.debounce.500ms="setPanelActive('category-node-570')"
6018                            >
6019                <div class="transition">
6020                    <span class="flex items-center box-border flex-col relative">
6021                        <a
6022                            class="hover:text-primary level-0 hover-help flex items-center w-full text-base font-normal cursor-pointer transition gap-1"
6023                            tabindex="0"
6024                                                            role="link"
6025                                @keydown.enter="setCurrentHoverPanel('category-node-570'); setPanelActive('category-node-570');"
6026                                                        title="Délices"
6027                        >
6028                            <span>
6029                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M448 71.3C448 71.53 448 71.77 448 72V488C448 494.4 445.5 500.5 440.1 504.1C436.5 509.5 430.4 512 424 512C417.6 512 411.5 509.5 407 504.1C402.5 500.5 400 494.4 400 488V352H351.2C342.8 352 334.4 350.3 326.6 347.1C318.9 343.8 311.8 339.1 305.8 333.1C299.9 327.1 295.2 320 291.1 312.2C288.8 304.4 287.2 296 287.2 287.6L288 173.8C287.1 136.9 299.1 100.8 319.7 70.28C340.4 39.71 369.8 16.04 404.1 2.336C407.9 .7942 411.9 .001 416 .0003C424.5 .0003 432.6 3.372 438.6 9.373C444.6 15.37 448 23.51 448 32V71.3zM400 58.08C380.4 70.33 364.2 87.39 352.1 107.6C341.8 127.9 335.9 150.7 336 173.8L335.2 288C335.2 292.2 336.9 296.3 339.9 299.3C342.9 302.3 346.1 304 351.2 304H399L400 58.08zM240.1 7.029C245.5 11.53 248 17.63 248 24V184C247.1 207.3 238.7 229.7 222.2 246.2C205.7 262.7 183.3 271.1 160 272H152V488C152 494.4 149.5 500.5 144.1 504.1C140.5 509.5 134.4 512 128 512C121.6 512 115.5 509.5 111 504.1C106.5 500.5 104 494.4 104 488V272H96C72.67 271.1 50.29 262.7 33.79 246.2C17.29 229.7 8.017 207.3 8 184V24C8 17.63 10.53 11.53 15.03 7.029C19.53 2.529 25.63 0 32 0C38.37 0 44.47 2.529 48.97 7.029C53.47 11.53 56 17.63 56 24V144H104V25.6C104 19.23 106.5 13.13 111 8.629C115.5 4.129 121.6 1.6 128 1.6C134.4 1.6 140.5 4.129 144.1 8.629C149.5 13.13 152 19.23 152 25.6V144H200V24C200 17.63 202.5 11.53 207 7.029C211.5 2.529 217.6 0 224 0C230.4 0 236.5 2.529 240.1 7.029zM184.9 214.9C191.9 209 196.7 200.1 198.4 192H57.6C59.32 200.1 64.08 209 71.08 214.9C78.08 220.7 86.89 223.9 96 224H160C169.1 223.9 177.9 220.7 184.9 214.9z"/></svg>
6030                            </span>
6031                            Délices                                                            <span class="box-border ml-1 transition-transform transform duration-300 ease-in-out"
6032                                      :class="{'rotate-180' : hoverPanelActiveId === 'category-node-570'}">
6033                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="10" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
6034                                </span>
6035                                                    </a>
6036
6037                                                <div
6038                            x-cloak=""
6039                            x-show="hoverPanelActiveId === 'category-node-570'"
6040                            class="z-40 absolute top-full"
6041                            id="category-node-570">
6042                            <svg class="fill-[rgb(var(--color-navigation-background))]" width="44" height="23" viewBox="0 0 44 23" xmlns="http://www.w3.org/2000/svg"><path d="M20.6655 1.1956C21.425 0.515105 22.575 0.515107 23.3345 1.1956L43.2196 19.0104C44.5865 20.2349 43.7202 22.5 41.885 22.5H2.11497C0.279765 22.5 -0.586462 20.2349 0.780425 19.0104L20.6655 1.1956Z"/></svg>
6043                        </div>
6044                                            </span>
6045
6046                                            <template x-if="hoverPanelActiveId === 'category-node-570'">
6047                            <div class="absolute flex z-30 left-0 mt-4 lg:mx-14 w-[100vw] 3xl:ml-0 3xl:w-full">
6048                                <div class="z-30 -ml-[100vw] w-[200vw] h-full absolute bg-[rgb(var(--color-navigation-background))] 3xl:w-[102%] 3xl:ml-[-2%]"></div>
6049                                <div class="z-30 py-11 flex flex-row max-w-[calc(1472px_+_56px)]">
6050                                                                        <div class="flex flex-wrap content-start word-break gap-y-8 mr-6 w-full"
6051                                                                                    x-bind:style="'width: ' + width"
6052                                                                            >
6053                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6054                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/pain"
6055                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Pain</a>
6056                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6057                                                                                                            <li>
6058                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6059                                                               href="https://www.aveve.be/fr/delices/pain/mix-all-in-pour-pains">Mix All-In pour pains</a>
6060                                                        </li>
6061                                                                                                            <li>
6062                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6063                                                               href="https://www.aveve.be/fr/delices/pain/mix-pour-pains-de-la-gamme-classic">Mix pour pains de la gamme classic</a>
6064                                                        </li>
6065                                                                                                            <li>
6066                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6067                                                               href="https://www.aveve.be/fr/delices/pain/mix-pour-pains-bios">Mix pour pains bios</a>
6068                                                        </li>
6069                                                                                                            <li>
6070                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6071                                                               href="https://www.aveve.be/fr/delices/pain/farines-adjuvants">Farines & adjuvants</a>
6072                                                        </li>
6073                                                                                                    </ol>
6074                                            </div>
6075                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6076                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/patisseries-desserts"
6077                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Pâtisseries & desserts</a>
6078                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6079                                                                                                            <li>
6080                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6081                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/cakes">Cakes</a>
6082                                                        </li>
6083                                                                                                            <li>
6084                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6085                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/crepes">Crêpes</a>
6086                                                        </li>
6087                                                                                                            <li>
6088                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6089                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/gaufres">Gaufres</a>
6090                                                        </li>
6091                                                                                                            <li>
6092                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6093                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/gateaux-biscuits">Gâteaux & biscuits</a>
6094                                                        </li>
6095                                                                                                            <li>
6096                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6097                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/cookie
6097s">Cookies</a>
6098                                                        </li>
6099                                                                                                            <li>
6100                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6101                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/autres-melanges-a-patisserie">Autres mélanges à pâtisserie</a>
6102                                                        </li>
6103                                                                                                            <li>
6104                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6105                                                               href="https://www.aveve.be/fr/delices/patisseries-desserts/sans-gluten-sans-sucre">Sans gluten & sans sucre</a>
6106                                                        </li>
6107                                                                                                    </ol>
6108                                            </div>
6109                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6110                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie"
6111                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Ingrédients boulangerie-pâtisserie</a>
6112                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6113                                                                                                            <li>
6114                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6115                                                               href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/sucre-chocolat">Sucre & chocolat</a>
6116                                                        </li>
6117                                                                                                            <li>
6118                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6119                                                               href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/colorants-et-aromes">Colorants et arômes</a>
6120                                                        </li>
6121                                                                                                            <li>
6122                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6123                                                               href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/garnitures-nappages">Garnitures & nappages</a>
6124                                                        </li>
6125                                                                                                            <li>
6126                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6127                                                               href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/levure-poudre-a-lever-spray-de-cuisson">Levure, poudre à lever & spray de cuisson</a>
6128                                                        </li>
6129                                                                                                            <li>
6130                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6131                                                               href="https://www.aveve.be/fr/delices/ingredients-boulangerie-patisserie/noix-noyaux-graines">Noix, noyaux & graines</a>
6132                                                        </li>
6133                                                                                                    </ol>
6134                                            </div>
6135                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6136                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/produits-regionaux"
6137                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Produits régionaux</a>
6138                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6139                                                                                                            <li>
6140                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6141                                                               href="https://www.aveve.be/fr/delices/produits-regionaux/sale">
6141Salé</a>
6142                                                        </li>
6143                                                                                                            <li>
6144                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6145                                                               href="https://www.aveve.be/fr/delices/produits-regionaux/sucre">Sucré</a>
6146                                                        </li>
6147                                                                                                            <li>
6148                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6149                                                               href="https://www.aveve.be/fr/delices/produits-regionaux/boissons">Boissons</a>
6150                                                        </li>
6151                                                                                                            <li>
6152                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6153                                                               href="https://www.aveve.be/fr/delices/produits-regionaux/petit-dejeuner">Petit-déjeuner</a>
6154                                                        </li>
6155                                                                                                    </ol>
6156                                            </div>
6157                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6158                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/electro"
6159                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Electro</a>
6160                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6161                                                                                                            <li>
6162                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6163                                                               href="https://www.aveve.be/fr/delices/electro/machines-a-pain">Machines à pain</a>
6164                                                        </li>
6165                                                                                                            <li>
6166                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6167                                                               href="https://www.aveve.be/fr/delices/electro/gaufrier">Gaufrier</a>
6168                                                        </li>
6169                                                                                                            <li>
6170                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6171                                                               href="https://www.aveve.be/fr/delices/electro/electro-divers">Électro divers</a>
6172                                                        </li>
6173                                                                                                    </ol>
6174                                            </div>
6175                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6176                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/decoration-de-patisserie"
6177                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Décoration de pâtisserie</a>
6178                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6179                                                                                                            <li>
6180                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6181                                                               href="https://www.aveve.be/fr/delices/decoration-de-patisserie/deco-comestible-pour-patisserie">Déco comestible pour pâtisserie</a>
6182                                                        </li>
6183                                                                                                            <li>
6184                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6185                                                               href="https://www.aveve.be/fr/delices/decoration-de-patisserie/deco-non-comestible-pour-patisserie">Déco non comestible pour pâtisserie</a>
6186                                                        </li>
6187                                                                                                    </ol>
6188                                            </div>
6189                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6190                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/produits-surgeles"
6191                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Produits surgelés</a>
6192                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6193                                                                                                            <li>
6194                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6195                                                               href="https://www.aveve.be/fr/delices/produits-surgeles/tartes-patisseries">Tartes & pâtisseries</a>
6196                                                        </li>
6197                                                                                                            <li>
6198                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6199                                                               href="https://www.aveve.be/fr/delices/produits-surgeles/pain">Pain</a>
6200                                                        </li>
6201                                                                                                            <li>
6202                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6203                                                               href="https://www.aveve.be/fr/delices/produits-surgeles/viennoiseries">Viennoiseries</a>
6204                                                        </li>
6205                                                                                                            <li>
6206                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6207                                                               href="https://www.aveve.be/fr/delices/produits-surgeles/glaces">Glaces</a>
6208                                                        </li>
6209                                                                                                            <li>
6210                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6211                                                               href="https://www.aveve.be/fr/delices/produits-surgeles/sale">
6211Salé</a>
6212                                                        </li>
6213                                                                                                            <li>
6214                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6215                                                               href="https://www.aveve.be/fr/delices/produits-surgeles/sans-gluten">Sans gluten</a>
6216                                                        </li>
6217                                                                                                    </ol>
6218                                            </div>
6219                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6220                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine"
6221                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Ustensiles de cuisine</a>
6222                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6223                                                                                                            <li>
6224                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6225                                                               href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/moules-a-patisserie-emporte-pieces">Moules à pâtisserie & emporte-pièces</a>
6226                                                        </li>
6227                                                                                                            <li>
6228                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6229                                                               href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/articles-de-conservation">Articles de conservation</a>
6230                                                        </li>
6231                                                                                                            <li>
6232                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6233                                                               href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/articles-de-fermentation">Articles de fermentation</a>
6234                                                        </li>
6235                                                                                                            <li>
6236                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6237                                                               href="https://www.aveve.be/fr/delices/ustensiles-de-cuisine/articles-de-cuisine-divers">Articles de cuisine divers</a>
6238                                                        </li>
6239                                                                                                    </ol>
6240                                            </div>
6241                                                                                    <div class="flex flex-col basis-1/5 grow-0 shrink-0 pr-4 gap-1">
6242                                                <a id="nav-d&#xE9;lices-main-level-2" href="https://www.aveve.be/fr/delices/art-de-la-table"
6243                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Art de la table</a>
6244                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6245                                                                                                            <li>
6246                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6247                                                               href="https://www.aveve.be/fr/delices/art-de-la-table/bougies">Bougies</a>
6248                                                        </li>
6249                                                                                                            <li>
6250                                                            <a id="nav-d&#xE9;lices-main-level-3" class="hover:text-primary"
6251                                                               href="https://www.aveve.be/fr/delices/art-de-la-table/decoration-de-table">Décoration de table</a>
6252                                                        </li>
6253                                                                                                    </ol>
6254                                            </div>
6255                                                                            </div>
6256                                </div>
6257
6258                                                                                                        <div class="bg-secondary-alt1 w-full py-11 z-40 text-white relative">
6259                                        <div class="h-full px-6 mx-23xl:max-w-min 3xl:min-w-fit relative" x-bind:style="'width: ' + sidebarWidth">
6260                                                                                                                                            <section class="flex flex-col">
6261                                                    <p class="font-semibold opacity-60 text-white"></p>
6262                                                    <ul class="text-sm">
6263                                                                                                                    <li class="hover:text-positive">
6264                                                                                                                                <a id="nav-d&#xE9;lices-side-gift" href="https://www.aveve.be/fr/cheque-cadeau">Chèque-cadeau</a>
6265                                                            </li>
6266                                                                                                            </ul>
6267                                                </section>
6268                                                                                                                                                                                        <section class="flex flex-col mt-8">
6269                                                    <p class="font-semibold opacity-60 text-white mb-4">Laissez-vous inspirer</p>
6270
6271                                                    <div class="flex flex-col text-white gap-6">
6272                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
6273                                                                                                                                                                                                                                                                <a id="nav-d&#xE9;lices-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/ins
6273piration/gourmandises/recettes-a-faire-avec-les-enfants/">
6274                                                                    <p class="opacity-60">Cuisiner avec les enfants</p>
6275                                                                    <p class="font-semibold group-hover:text-positive">Faire de la pâtisserie avec des enfants : les recettes les plus délicieuses</p>
6276                                                                </a>
6277                                                            </div>
6278                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
6279                                                                                                                                                                                                                                                                <a id="nav-d&#xE9;lices-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/inspiration/gourmandises/faire-son-pain/">
6280                                                                    <p class="opacity-60">Pain</p>
6281                                                                    <p class="font-semibold group-hover:text-positive">Tout ce que vous devez savoir sur la cuisson de votre pain</p>
6282                                                                </a>
6283                                                            </div>
6284                                                                                                                    <div class="flex flex-row items-start gap-4 break-anywhere">
6285                                                                                                                                                                                                                                                                <a id="nav-d&#xE9;lices-side-inspire" class="text-sm cursor-pointer leading-4 group" href="https://www.aveve.be/fr/inspiration/gourmandises/">
6286                                                                    <p class="opacity-60">Découvrez nos autres articles d'inspiration</p>
6287                                                                    <p class="font-semibold group-hover:text-positive">Gourmandises</p>
6288                                                                </a>
6289                                                            </div>
6290                                                                                                            </div>
6291                                                </section>
6292                                                                                                                                                                                        <section class="flex flex-col mt-8">
6293                                                    <p class="font-semibold opacity-60 text-white">Services</p>
6294                                                    <ul class="text-sm">
6295                                                                                                                    <li class="hover:text-positive">
6296                                                                                                                                <a id="nav-d&#xE9;lices-side-services" href="https://www.aveve.be/fr/ateliers/">Nos ateliers et démonstrations</a>
6297                                                            </li>
6298                                                                                                            </ul>
6299                                                </section>
6300                                                                                        <i class="absolute right-0 -bottom-10 opacity-40 3xl:pr-5">
6301                                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon w-full" width="127" height="127" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M448 71.3C448 71.53 448 71.77 448 72V488C448 494.4 445.5 500.5 440.1 504.1C436.5 509.5 430.4 512 424 512C417.6 512 411.5 509.5 407 504.1C402.5 500.5 400 494.4 400 488V352H351.2C342.8 352 334.4 350.3 326.6 347.1C318.9 343.8 311.8 339.1 305.8 333.1C299.9 327.1 295.2 320 291.1 312.2C288.8 304.4 287.2 296 287.2 287.6L288 173.8C287.1 136.9 299.1 100.8 319.7 70.28C340.4 39.71 369.8 16.04 404.1 2.336C407.9 .7942 411.9 .001 416 .0003C424.5 .0003 432.6 3.372 438.6 9.373C444.6 15.37 448 23.51 448 32V71.3zM400 58.08C380.4 70.33 364.2 87.39 352.1 107.6C341.8 127.9 335.9 150.7 336 173.8L335.2 288C335.2 292.2 336.9 296.3 339.9 299.3C342.9 302.3 346.1 304 351.2 304H399L400 58.08zM240.1 7.029C245.5 11.53 248 17.63 248 24V184C247.1 207.3 238.7 229.7 222.2 246.2C205.7 262.7 183.3 271.1 160 272H152V488C152 494.4 149.5 500.5 144.1 504.1C140.5 509.5 134.4 512 128 512C121.6 512 115.5 509.5 111 504.1C106.5 500.5 104 494.4 104 488V272H96C72.67 271.1 50.29 262.7 33.79 246.2C17.29 229.7 8.017 207.3 8 184V24C8 17.63 10.53 11.53 15.03 7.029C19.53 2.529 25.63 0 32 0C38.37 0 44.47 2.529 48.97 7.029C53.47 11.53 56 17.63 56 24V144H104V25.6C104 19.23 106.5 13.13 111 8.629C115.5 4.129 12
63011.6 1.6 128 1.6C134.4 1.6 140.5 4.129 144.1 8.629C149.5 13.13 152 19.23 152 25.6V144H200V24C200 17.63 202.5 11.53 207 7.029C211.5 2.529 217.6 0 224 0C230.4 0 236.5 2.529 240.1 7.029zM184.9 214.9C191.9 209 196.7 200.1 198.4 192H57.6C59.32 200.1 64.08 209 71.08 214.9C78.08 220.7 86.89 223.9 96 224H160C169.1 223.9 177.9 220.7 184.9 214.9z"/></svg>
6302                                            </i>
6303                                        </div>
6304                                    </div>
6305                                                            </div>
6306                        </template>
6307                                    </div>
6308            </div>
6309                        <div
6310                id="category-node-inspiration"
6311                @mouseenter="setCurrentHoverPanel('category-node-inspiration')"
6312                                    @mouseenter.debounce.500ms="setPanelActive('category-node-inspiration')"
6313                            >
6314                <div class="transition">
6315                    <span class="flex items-center box-border flex-col relative">
6316                        <a
6317                            class="hover:text-primary level-0 hover-help flex items-center w-full text-base font-normal cursor-pointer transition gap-1"
6318                            tabindex="0"
6319                                                            role="link"
6320                                @keydown.enter="setCurrentHoverPanel('category-node-inspiration'); setPanelActive('category-node-inspiration');"
6321                                                        title="Inspiration"
6322                        >
6323                            <span>
6324                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M32 448c-17.67 0-32 14.33-32 32c0 17.67 14.33 32 32 32s32-14.33 32-32C64 462.3 49.67 448 32 448zM144 384C117.5 384 96 405.5 96 432S117.5 480 144 480S192 458.5 192 432S170.5 384 144 384zM370.2 64.08C344.8 24.17 301.6 0 254 0C207.3 0 164.5 23.64 138.9 62.64C61.92 64.8 0 128.4 0 206.6c0 89.4 81.43 162.1 172.6 140.9C193.3 370.6 222.6 384 254 384c31.13 0 60.28-13.16 80.96-35.92c11.32 2.91 22.76 4.381 34.14 4.381C447.9 352.5 512 287.6 512 208.1C512 128.9 448.5 64.69 370.2 64.08zM334.9 297.7c-10.39-4.099-22.39-.2034-28.53 9.34c-11.63 18.1-31.22 28.9-52.4 28.9c-21.24 0-40.84-10.87-52.5-29.07c-4.465-7.009-12.09-10.1-20-10.1c-2.605 0-5.209 .4224-7.783 1.314C162.7 301 152.7 302.9 142.9 302.9c-52.53 0-95.26-43.12-95.26-96.13c0-52.83 42.45-95.86 96.96-95.86c.155 0 .3411 .0156 .5271 .0156l5.054 .5789c9.643 .8136 18.64-4.396 22.98-13c15.81-31.12 46.79-50.44 80.87-50.44c34.82 0 66.11 19.87 81.64 51.85c4.372 8.996 13.8 14.38 23.75 13.33l4.837-.5945c1.612-.219 3.194-.5006 4.868-.5006c52.53 0 95.26 43.12 95.26 96.13C464.4 272.6 399.8 322.9 334.9 297.7z"/></svg>
6325                            </span>
6326                            Inspiration                                                            <span class="box-border ml-1 transition-transform transform duration-300 ease-in-out"
6327                                      :class="{'rotate-180' : hoverPanelActiveId === 'category-node-inspiration'}">
6328                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="10" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432.6 209.3l-191.1 183.1C235.1 397.8 229.1 400 224 400s-11.97-2.219-16.59-6.688L15.41 209.3C5.814 200.2 5.502 184.1 14.69 175.4c9.125-9.625 24.38-9.938 33.91-.7187L224 342.8l175.4-168c9.5-9.219 24.78-8.906 33.91 .7187C442.5 184.1 442.2 200.2 432.6 209.3z"/></svg>
6329                                </span>
6330                                                    </a>
6331
6332                                                <div
6333                            x-cloak=""
6334                            x-show="hoverPanelActiveId === 'category-node-inspiration'"
6335                            class="z-40 absolute top-full"
6336                            id="category-node-inspiration">
6337                            <svg class="fill-[rgb(var(--color-navigation-background))]" width="44" height="23" viewBox="0 0 44 23" xmlns="http://www.w3.org/2000/svg"><path d="M20.6655 1.1956C21.425 0.515105 22.575 0.515107 23.3345 1.1956L43.2196 19.0104C44.5865 20.2349 43.7202 22.5 41.885 22.5H2.11497C0.279765 22.5 -0.586462 20.2349 0.780425 19.0104L20.6655 1.1956Z"/></svg>
6338                        </div>
6339                                            </span>
6340
6341                                            <template x-if="hoverPanelActiveId === 'category-node-inspiration'">
6342                            <div class="absolute flex z-30 left-0 mt-4 lg:mx-14 w-[100vw] 3xl:ml-0 3xl:w-full">
6343                                <div class="z-30 -ml-[100vw] w-[200vw] h-full absolute bg-[rgb(var(--color-navigation-background))] 3xl:w-[102%] 3xl:ml-[-2%]"></div>
6344                                <div class="z-30 py-11 flex flex-row w-full">
6345                                                                        <div class="flex flex-wrap content-start word-break gap-y-8 mr-6 w-full"
6346                                                                                    x-bind:style="'width: ' + maxWidth"
6347                                                                            >
6348                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6349                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/ins
6349piration/gourmandises"
6350                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Gourmandises</a>
6351                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6352                                                                                                            <li>
6353                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6354                                                               href="https://www.aveve.be/fr/recettes">Recettes</a>
6355                                                        </li>
6356                                                                                                            <li>
6357                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6358                                                               href="https://www.aveve.be/fr/inspiration/gourmandises/fete">C’est la fête</a>
6359                                                        </li>
6360                                                                                                            <li>
6361                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6362                                                               href="https://www.aveve.be/fr/inspiration/gourmandises/boulangerie-maison">Boulangerie maison </a>
6363                                                        </li>
6364                                                                                                            <li>
6365                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6366                                                               href="https://www.aveve.be/fr/inspiration/gourmandises/rapide-et-sain">Rapide et sain  </a>
6367                                                        </li>
6368                                                                                                            <li>
6369                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6370                                                               href="https://www.aveve.be/fr/inspiration/gourmandises/kids-in-the-kitchen">Kids in the kitchen</a>
6371                                                        </li>
6372                                                                                                            <li>
6373                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6374                                                               href="https://www.aveve.be/fr/inspiration/gourmandises/delicieusement-durable">Délicieusement durable</a>
6375                                                        </li>
6376                                                                                                    </ol>
6377                                            </div>
6378                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6379                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/jardin/jardin-ecologique"
6380                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Jardin écologique</a>
6381                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6382                                                                                                            <li>
6383                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6384                                                               href="https://www.aveve.be/fr/inspiration/jardin/jardin-ecologique/un-bon-depart">Un bon départ</a>
6385                                                        </li>
6386                                                                                                    </ol>
6387                                            </div>
6388                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6389                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/ins
6389piration/jardin/potager"
6390                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Potager</a>
6391                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6392                                                                                                            <li>
6393                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6394                                                               href="https://www.aveve.be/fr/inspiration/jardin/potager/un-bon-depart">Un bon départ</a>
6395                                                        </li>
6396                                                                                                            <li>
6397                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6398                                                               href="https://www.aveve.be/fr/inspiration/jardin/potager/entretien-et-soins">Entretien et soins</a>
6399                                                        </li>
6400                                                                                                    </ol>
6401                                            </div>
6402                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6403                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/jardin/jardin-dherbe"
6404                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Jardin d'herbe</a>
6405                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6406                                                                                                            <li>
6407                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6408                                                               href="https://www.aveve.be/fr/inspiration/jardin/jardin-dherbe/un-bon-depart">Un bon départ</a>
6409                                                        </li>
6410                                                                                                            <li>
6411                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6412                                                               href="https://www.aveve.be/fr/inspiration/jardin/jardin-dherbe/utilisation-des-herbes">Utilisation des herbes</a>
6413                                                        </li>
6414                                                                                                    </ol>
6415                                            </div>
6416                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6417                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/jardin/fruitiers"
6418                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Fruitiers</a>
6419                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6420                                                                                                            <li>
6421                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6422                                                               href="https://www.aveve.be/fr/inspiration/jardin/fruitiers/un-bon-depart">Un bon départ</a>
6423                                                        </li>
6424                                                                                                    </ol>
6425                                            </div>
6426                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6427                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/ins
6427piration/jardin/pelouse"
6428                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Pelouse</a>
6429                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6430                                                                                                            <li>
6431                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6432                                                               href="https://www.aveve.be/fr/inspiration/jardin/pelouse/un-bon-depart">Un bon départ</a>
6433                                                        </li>
6434                                                                                                            <li>
6435                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6436                                                               href="https://www.aveve.be/fr/inspiration/jardin/pelouse/entretien-et-soins">Entretien et soins</a>
6437                                                        </li>
6438                                                                                                    </ol>
6439                                            </div>
6440                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6441                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin"
6442                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Détente au jardin</a>
6443                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6444                                                                                                            <li>
6445                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6446                                                               href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/bbq">BBQ</a>
6447                                                        </li>
6448                                                                                                            <li>
6449                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6450                                                               href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/plantes-ornementales">Plantes ornementales</a>
6451                                                        </li>
6452                                                                                                            <li>
6453                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6454                                                               href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/plantes-de-terrasse">Plantes de terrasse</a>
6455                                                        </li>
6456                                                                                                            <li>
6457                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6458                                                               href="https://www.aveve.be/fr/inspiration/jardin/detente-au-jardin/problemes-au-jardin">Problèmes au jardin</a>
6459                                                        </li>
6460                                                                                                    </ol>
6461                                            </div>
6462                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6463                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/ins
6463piration/jardin/la-vie-en-vert"
6464                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">La vie en vert</a>
6465                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6466                                                                                                            <li>
6467                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6468                                                               href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert/un-bon-depart">Un bon départ</a>
6469                                                        </li>
6470                                                                                                            <li>
6471                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6472                                                               href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert/entretien-et-soins">Entretien et soins</a>
6473                                                        </li>
6474                                                                                                            <li>
6475                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6476                                                               href="https://www.aveve.be/fr/inspiration/jardin/la-vie-en-vert/tendances"> Tendances</a>
6477                                                        </li>
6478                                                                                                    </ol>
6479                                            </div>
6480                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6481                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/animaux/chien"
6482                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Chien</a>
6483                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6484                                                                                                            <li>
6485                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6486                                                               href="https://www.aveve.be/fr/inspiration/animaux/chien/un-bon-départ">Un bon départ</a>
6487                                                        </li>
6488                                                                                                            <li>
6489                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6490                                                               href="https://www.aveve.be/fr/inspiration/animaux/chien/connaissez-votre-animal">Connaissez votre animal</a>
6491                                                        </li>
6492                                                                                                            <li>
6493                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6494                                                               href="https://www.aveve.be/fr/inspiration/animaux/chien/conseils-pratiques">Conseils pratiques</a>
6495                                                        </li>
6496                                                                                                            <li>
6497                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6498                                                               href="https://www.aveve.be/fr/inspiration/animaux/chien/gatez-les">Gâtez-les</a>
6499                                                        </li>
6500                                                                                                            <li>
6501                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6502                                                               href="https://www.aveve.be/fr/ins
6502piration/animaux/chien/que-mange-votre-animal">Que mange votre animal</a>
6503                                                        </li>
6504                                                                                                    </ol>
6505                                            </div>
6506                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6507                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/animaux/chat"
6508                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Chat</a>
6509                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6510                                                                                                            <li>
6511                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6512                                                               href="https://www.aveve.be/fr/inspiration/animaux/chat/un-bon-depart">Un bon départ</a>
6513                                                        </li>
6514                                                                                                            <li>
6515                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6516                                                               href="https://www.aveve.be/fr/inspiration/animaux/chat/connaissez-votre-animal">Connaissez votre animal</a>
6517                                                        </li>
6518                                                                                                            <li>
6519                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6520                                                               href="https://www.aveve.be/fr/inspiration/animaux/chat/conseils-pratiques">Conseils pratiques</a>
6521                                                        </li>
6522                                                                                                            <li>
6523                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6524                                                               href="https://www.aveve.be/fr/inspiration/animaux/chat/gatez-les">Gâtez-les</a>
6525                                                        </li>
6526                                                                                                            <li>
6527                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6528                                                               href="https://www.aveve.be/fr/inspiration/animaux/chat/que-mange-votre-animal">Que mange votre animal</a>
6529                                                        </li>
6530                                                                                                    </ol>
6531                                            </div>
6532                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6533                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/animaux/poule"
6534                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Poule</a>
6535                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6536                                                                                                            <li>
6537                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6538                                                               href="https://www.aveve.be/fr/ins
6538piration/animaux/poule/un-bon-depart">Un bon départ</a>
6539                                                        </li>
6540                                                                                                            <li>
6541                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6542                                                               href="https://www.aveve.be/fr/inspiration/animaux/poule/connaissez-votre-animal">Connaissez votre animal</a>
6543                                                        </li>
6544                                                                                                            <li>
6545                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6546                                                               href="https://www.aveve.be/fr/inspiration/animaux/poule/conseils-pratiques">Conseils pratiques</a>
6547                                                        </li>
6548                                                                                                            <li>
6549                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6550                                                               href="https://www.aveve.be/fr/inspiration/animaux/poule/que-mange-votre-animal">Que mange votre animal</a>
6551                                                        </li>
6552                                                                                                    </ol>
6553                                            </div>
6554                                                                                    <div class="flex flex-col basis-1/6 grow-0 shrink-0 pr-4 gap-1">
6555                                                <a id="nav-inspiration-main-level-2" href="https://www.aveve.be/fr/inspiration/animaux/autres-animaux"
6556                                                   class="font-semibold text-secondary-alt1 hover:text-primary hover:">Autres animaux</a>
6557                                                <ol class="text-sm flex flex-col gap-1 font-normal">
6558                                                                                                            <li>
6559                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6560                                                               href="https://www.aveve.be/fr/inspiration/animaux/cheval">Cheval</a>
6561                                                        </li>
6562                                                                                                            <li>
6563                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6564                                                               href="https://www.aveve.be/fr/inspiration/animaux/mouton">Mouton</a>
6565                                                        </li>
6566                                                                                                            <li>
6567                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6568                                                               href="https://www.aveve.be/fr/inspiration/animaux/lapin-et-lapin-nain">Lapin et lapin nain</a>
6569                                                        </li>
6570                                                                                                            <li>
6571                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6572                                                               href="https://www.aveve.be/fr/inspiration/animaux/rongeurs">Rongeurs</a>
6573                                                        </li>
6574                                                                                                            <li>
6575                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6576                                                               href="https://www.aveve.be/fr/ins
6576piration/animaux/oiseau-d-ornement">Oiseau d'ornement </a>
6577                                                        </li>
6578                                                                                                            <li>
6579                                                            <a id="nav-inspiration-main-level-3" class="hover:text-primary"
6580                                                               href="https://www.aveve.be/fr/inspiration/animaux/poissons">Poissons</a>
6581                                                        </li>
6582                                                                                                    </ol>
6583                                            </div>
6584                                                                            </div>
6585                                </div>
6586
6587                                                            </div>
6588                        </template>
6589                                    </div>
6590            </div>
6591                        <div
6592                id="category-node-promotions"
6593                @mouseenter="setCurrentHoverPanel('category-node-promotions')"
6594                                    @mouseenter.debounce.500ms="setPanelActive('category-node-promotions')"
6595                            >
6596                <div class="transition">
6597                    <span class="flex items-center box-border flex-col relative">
6598                        <a
6599                            class="text-promo hover:text-promo level-0 hover-help flex items-center w-full text-base font-normal cursor-pointer transition gap-1"
6600                            tabindex="0"
6601                                                            href="https://www.aveve.be/fr/promotions"
6602                                                        title="Promotions"
6603                        >
6604                            <span>
6605                                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M80 144C80 126.3 94.33 112 112 112C129.7 112 144 126.3 144 144C144 161.7 129.7 176 112 176C94.33 176 80 161.7 80 144zM197.5 32C214.5 32 230.7 38.74 242.7 50.75L418.7 226.7C443.7 251.7 443.7 292.3 418.7 317.3L285.3 450.7C260.3 475.7 219.7 475.7 194.7 450.7L18.75 274.7C6.743 262.7 0 246.5 0 229.5V80C0 53.49 21.49 32 48 32L197.5 32zM52.69 240.8L228.7 416.8C234.9 423.1 245.1 423.1 251.3 416.8L384.8 283.3C391.1 277.1 391.1 266.9 384.8 260.7L208.8 84.69C205.8 81.69 201.7 80 197.5 80H48V229.5C48 233.7 49.69 237.8 52.69 240.8L52.69 240.8z"/></svg>
6606                            </span>
6607                            Promotions                                                    </a>
6608
6609                                            </span>
6610
6611                                    </div>
6612            </div>
6613                    </nav>
6614    </div>
6615</div>
6616<script>
6617    'use strict';
6618    function initMenuDesktop_6ab4f73f75516(){
6619        return {
6620            hoverPanelActiveId: '',
6621            currentHoverPanelId: '',
6622            pixels: '0px',
6623            width: '100%',
6624            maxWidth: '100%',
6625            sidebarWidth: '0px',
6626            init(){
6627                let rect = document.getElementById('desktop-nav').getBoundingClientRect();
6628                this.pixels = rect.left + 'px';
6629                this.maxWidth = rect.width + 'px';
6630                this.width = (rect.width * 0.8) + 'px';
6631                this.sidebarWidth = (rect.width * 0.2)+10  + 'px'
6632            },
6633            setCurrentHoverPanel(panel){
6634                this.currentHoverPanelId = panel;
6635            },
6636            setPanelActive(panel){
6637                if (panel === this.currentHoverPanelId){
6638                    this.hoverPanelActiveId = panel;
6639                }
6640            },
6641            setPanelInactive(panel){
6642                this.hoverPanelActiveId = '';
6643                this.currentHoverPanelId = '';
6644            }
6645        }
6646    }
6647</script>
6647
6648            </div>
6649        </div>
6650
6651        <!--Cart Drawer-->
6652            </div>
6653</div>
6654</header><main id="maincontent" class="page-main"><div id="contentarea" tabindex="-1"></div>
6655<div class="page messages">
6655<script>
6656        function initMessages() {
6657        "use strict";
6658        return {
6659            messages: window.mageMessages || [],
6660            init() {
6661                const cookie = document.cookie.split('; ').find(c => c.startsWith('order_product_review_error='))
6662                if (cookie) {
6663                    const message = decodeURIComponent(cookie.split('=')[1]);
6664                    this.addMessages([{type: 'error', text: message}]);
6665                    document.cookie = 'order_product_review_error=; path=/; max-age=0';
6666                }
6667            },
6668            isEmpty() {
6669                return this.messages.reduce(
6670                    function (isEmpty, message) {
6671                        return isEmpty && (message === undefined || 0 === message.text.length)
6672                    }, true
6673                )
6674            },
6675            removeMessage(messageIndex) {
6676                this.messages[messageIndex] = undefined;
6677            },
6678            // arvesta: remove previous messages, hide after 5 sec
6679            addMessages(messages, hideAfter = 5000) {
6680                messages.map((message) => {
6681                    const txt = document.createElement('textarea');
6682                    txt.innerHTML = message.text;
6683                    message.text = txt.value;
6684                    this.messages = this.messages.concat(message);
6685                    if (hideAfter === undefined && message.type === 'success' && window.defaultSuccessMessageTimeout) {
6686                        hideAfter = window.defaultSuccessMessageTimeout;
6687                    }
6688                    if (hideAfter) {
6689                        this.setHideTimeOut(this.messages.length -1, hideAfter);
6690                    }
6691                });
6692            },
6693            setHideTimeOut(messageIndex, hideAfter) {
6694                setTimeout((messageIndex) => {
6695                    this.removeMessage(messageIndex);
6696                }, hideAfter, messageIndex);
6697            },
6698            eventListeners: {
6699                ['@messages-loaded.window'](event) {
6700                    this.addMessages(event.detail.messages, event.detail.hideAfter)
6701                },
6702                ['@private-content-loaded.window'](event) {
6703                    const data = event.detail.data;
6704                    if (
6705                        data.messages &&
6706                        data.messages.messages &&
6707                        data.messages.messages.length
6708                    ) {
6709                        this.addMessages(data.messages.messages);
6710                    }
6711                },
6712                ['@clear-messages.window']() {
6713                    this.messages = [];
6714                }
6715            }
6716        }
6717    }
6718</script>
6718
6719<section id="messages"
6720         x-data="initMessages()"
6721         x-bind="eventListeners"
6722         aria-live="assertive"
6723         role="alert"
6724>
6725    <template x-if="!isEmpty()">
6726        <div class="w-full">
6727            <div role="alert" class="messages container mx-auto py-3 ">
6728                <template x-for="(message, index) in messages" :key="index">
6729                    <div>
6730                        <template x-if="message">
6731                            <div class="message" :class="message.type"
6732                                 :ui-id="'message-' + message.type"
6733                            >
6734                                <span x-html="message.text"></span>
6735                                <a href="#" class="close cursor-pointer" title="close"
6736                                   @click.prevent="removeMessage(index)">
6737                                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" class="text-white" width="18" height="18" aria-hidden="true">
6738  <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12"/>
6739</svg>
6740                                </a>
6741                            </div>
6742                        </template>
6743                    </div>
6744                </template>
6745            </div>
6746        </div>
6747    </template>
6748</section>
6749</div><div class="columns"><div class="column main">
6750<script>
6751    window.checkoutConfig = false;
6752    window.customerData = window.checkoutConfig.customerData;
6753    window.isCustomerLoggedIn = window.checkoutConfig.isCustomerLoggedIn;
6754</script>
6754
6755
6756<script>
6757    'use strict';
6758    (function( hyva, undefined ) {
6759        /**
6760         * Takes a form element and submits it through fetch,
6761         * then replaces the result into the document without
6762         * refreshing the page
6763         */
6764        hyva.postCart = (form) => {
6765            if (!form.action) {
6766                return;
6767            }
6768            const action = form.action;
6769            const formData = new FormData(form);
6770
6771            if (!formData.uenc) {
6772                formData.append('uenc', hyva.getUenc());
6773            }
6774
6775            formData.append('form_key', hyva.getFormKey());
6776
6777            window.fetch(action, {
6778                method: 'POST',
6779                body: formData
6780            }).then((result) => {
6781                return result.text()
6782            }).then((content) => {
6783                hyva.replaceDomElement('#maincontent .column.main', content)
6784
6785            }).catch((error) => {
6786                console.error(error);
6787                typeof window.dispatchMessages !== "undefined" && window.dispatchMessages(
6788                    [{
6789                        type: "error",
6790                        text: "Un\u0020probl\u00E8me\u0020est\u0020survenu.\u0020Veuillez\u0020r\u00E9essayer."
6791                    }], 10000
6792                );
6793            })
6794        }
6795    }( window.hyva = window.hyva || {} ));
6796</script>
6796
6797
6798<script>
6799    function initCartForm(){
6800        return {
6801            cartIsEmpty: !!window.checkoutConfig,
6802            checkCartShouldUpdate(data) {
6803                const cart = data.cart;
6804
6805                if (this.cartIsEmpty !== !!window.checkoutConfig) {
6806                    this.cartIsEmpty = !!window.checkoutConfig;
6807                    this.reloadCartContent();
6808                    return;
6809                }
6810
6811                if (cart) {
6812                    if (!window.checkoutConfig) {
6813                        if (cart.items.length) {
6814                            this.reloadCartContent();
6815                        }
6816                        return;
6817                    }
6818
6819                    const roundUp = (number) => {
6820                        return Math.round(number * 100);
6821                    }
6822
6823                    const decimalNumbersAreEqual = (number1, number2) => {
6824                        return roundUp(number1) === roundUp(number2);
6825                    }
6826
6827                    if (window.checkoutConfig && cart) {
6828                        if (decimalNumbersAreEqual(
6829                                cart.items.reduce((totalQty, cartItem) => totalQty + cartItem.qty, 0),
6830                                window.checkoutConfig.quoteData.items_qty
6831                            ) &&
6832                            decimalNumbersAreEqual(
6833                                cart.subtotalAmount,
6834                                window.checkoutConfig.totalsData.total_segments.find((segment) => segment.code === "subtotal").value
6835                            )
6836                        ) {
6837                            return;
6838                        }
6839                    }
6840                }
6841                this.reloadCartContent();
6842            },
6843            reloadCartContent() {
6844                window.fetch(window.location.href, {
6845                    method: "GET"
6846                }).then((result) => {
6847                    return result.text()
6848
6849                }).then((body) => {
6850                    hyva.setCookie('mage-cache-sessid', '', -1, true);
6851                    window.checkoutConfig = null;
6852                    hyva.replaceDomElement('#maincontent .column.main', body);
6853
6854                }).catch((error) => {
6855                    console.error(error);
6856                    window.location.reload()
6857                })
6858            },
6859            onStorageChange(event) {
6860                if (event.key === 'private_content_version') {
6861                    window.dispatchEvent(new CustomEvent("reload-customer-section-data"));
6862                }
6863            }
6864        }
6865    }
6866</script>
6866
6867<div x-data="initCartForm()"
6868     class="cart-form clearfix min-h-screen-50 sm:min-h-screen-75 lg:min-h-screen-50"
6869     @private-content-loaded.window="checkCartShouldUpdate($event.detail.data)"
6870     @reload-cart-content.window="reloadCartContent()"
6871     @storage.window="onStorageChange($event)"
6872>
6873            <div class="cart-empty">
6874        <p class="block text-h2 mb-4 md:mb-6" id="basket-page-title">
6875        Votre panier (0)    </p>
6876    <div class="lg:text-center">
6877        <p class="!font-normal text-h4">Votre panier est actuellement vide.  Commandez vos produits préférés et laissez le plaisir cultiver!</p>
6878    </div>
6879    </div>
6880    </div>
6881<div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><div id="hr-recom-k6690eebac2e1e81ac752f1aa"></div></div></div></div>
6882<script defer>
6883    'use strict';
6884
6885    function initPromoLabel() {
6886        return {
6887            product: {},
6888            bannerUnitId: '',
6889            isActiveOffer: false,
6890            variantText: '',
6891            variantTextArray: [],
6892            promo_descriptions: null,
6893            form: null,
6894            initProduct(product) {
6895                product.addToCartAllowed = product?.attributes?.product_saleable[0] === 'saleable'
6896
6897                if ('product_has_custom_options' in product.attributes){
6898                    let value = product.attributes.product_has_custom_options[0];
6899
6900                    if (value === "1" || value === 1 || value === "true") {
6901                        product.addToCartAllowed = false;
6902                    }
6903                }
6904
6905                this.product = product;
6906                if ('has_active_offer' in product.attributes){
6907                    this.isActiveOffer = product.attributes['has_active_offer'][0] === 'true';
6908                }
6909
6910                if (this.isActiveOffer) {
6911                    try {
6912                        this.promo_descriptions = JSON.parse(this.product.attributes['cpi_promotion_details'][0]);
6913                    } catch (e){
6914                        this.isActiveOffer = false;
6915                        return;
6916                    }
6917                }
6918
6919                if ('item_variant_type' in product.attributes){
6920                    this.variantText = product.attributes['item_variant_type'][0];
6921                    this.variantTextArray = this.variantText.split(',');
6922                }
6923            },
6924            sizeFinderMiddle: function () {
6925                const word = this.promo_descriptions?.WEBMIDDLE;
6926                if (!word) {
6927                    return;
6928                }
6929
6930                let size = 24;
6931                if (word.length <= 5) {
6932                    size = 28;
6933                } else if (word.length >= 8) {
6934                    size = 14;
6935                }
6936
6937                return size.toString() + 'px';
6938            },
6939            sizeFinderTop: function () {
6940                const word = this.promo_descriptions?.WEBTOP;
6941                if (!word) {
6942                    return;
6943                }
6944
6945                let size = 22;
6946                if (word.length >= 8) {
6947                    size = 18;
6948                }
6949
6950                return size.toString() + 'px';
6951            },
6952            lineHeightFinderMiddle: function () {
6953                const word = this.promo_descriptions?.WEBMIDDLE;
6954                if (!word) {
6955                    return;
6956                }
6957                if (word.length >= 8) {
6958                    return '1rem';
6959                }
6960                return '1.75rem';
6961            },
6962            createAddToCartUrl: function (productId) {
6963                const currentLocationUENC = encodeURIComponent(
6964                    this.encodeUenc(BASE_URL),
6965                );
6966                return BASE_URL +
6967                    "checkout/cart/add/uenc/" +
6968                    currentLocationUENC +
6969                    "/product/" +
6970                    productId
6971            },
6972            encodeUenc: function (value) {
6973                const regex = /=/gi;
6974                return btoa(value).replace(regex, ",");
6975            },
6976            addToCartRecsEvent: function (e, unitId, productId) {
6977                // requires recommendationsContext to be set
6978                magentoStorefrontEvents.publish.recsItemAddToCartClick(
6979                    unitId, productId, magentoStorefrontEvents.context
6980                );
6981            },
6982            recsClickEvent: function (unitId, productId, productUrl) {
6983                magentoStorefrontEvents.publish.recsItemClick(
6984                    unitId, productId, magentoStorefrontEvents.context
6985                );
6986                // Timeout to prevent submission before event has fired.
6987                setTimeout(() => window.location.href = productUrl, window.magentoStorefrontEventsDefaultTimeout);
6988            },
6989            camelize: function(str) {
6990                return str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(word) {
6991                    return word.toUpperCase();
6992                }).replace(/\s+/g, '');
6993            },
6994            generateId: function(elementTagName) {
6995                if (!this.form){
6996                    return '';
6997                }
6998
6999                const parentElement = this.form.parentElement;
7000                const bannerPosition = parentElement.dataset.bannerPosition;
7001                const elPosition = parseInt(parentElement.dataset.key);
7002                return "cart" + "-CrosS-Sensei" + bannerPosition + '-' + (elPosition + 1) + "-" + elementTagName;
7003            },
7004        }
7005    }
7006</script>
7006
7007<div
7008    x-defer="intersect"
7009    x-data="recommendedProducts_below_main_content()"
7010     x-init="initProductRecBlock()"
7011     id="recs_block_below_main_content">
7012    <section x-show="productBanners.length > 0" class="mb-10 body-font bg-primary-alt1/[.5] -mx-4 md:-mx-[42px] md:mb-14 lg:-mx-[56px] lg:mb-[70px] py-6">
7013        <template x-if="productBanners">
7014    <div>
7015        
7015<script>
7016            function initSenseiAjaxAddToCart(product) {
7017                return {
7018                    product: product,
7019                    formKey: hyva.getFormKey(),
7020                    isLoading: false,
7021                    addToCartSubmit: function (event, bannerUnitId) {
7022                        let postData = {
7023                            'uenc': btoa(window.location.href),
7024                            'qty': 1,
7025                            'product': this.product.productId,
7026                            'form_key': this.formKey,
7027                            'isAjax': true,
7028                        };
7029
7030                        let detail =
7031                            {
7032                                'postData': postData,
7033                                'type_id': this.product.type_id,
7034                                'action': this.createAddToCartUrl(this.product.productId),
7035                                'disable_scroll_locking': 1,
7036                                'product': this.product.productId
7037                            }
7038
7039                        if (
7040                            this.product.recomData !== undefined &&
7041                            this.product.recomData.product_recommendation_variant !== undefined
7042                        ) {
7043                            let variantData = this.product.recomData.product_recommendation_variant;
7044                            postData.product = variantData.parent_id;
7045                            postData.item = variantData.parent_id;
7046                            variantData.variant_map.forEach(map => {
7047                                postData["super_attribute[" + map.attribute_id + "]"] = map.attribute_option
7048                            });
7049
7050                            detail.action = variantData.add_to_cart_url;
7051                            detail.postData = postData;
7052                        }
7053
7054                        window.dispatchEvent(new CustomEvent('product_add_to_cart', {detail: detail}));
7055                        this.addToCartRecsEvent(event, bannerUnitId, this.product.productId)
7056                    },
7057                    getAddToCartId: function () {
7058                        return `product-${this.product.productId}-addtocart-button`
7059                    },
7060                    eventListeners: {
7061                        ['@add-to-cart-load-' + product.productId + '-start.window'](event) {
7062                            this.isLoading = true;
7063                        },
7064                        ['@add-to-cart-load-' + product.productId + '-stop.window'](event) {
7065                            this.isLoading = false;
7066                        },
7067                    },
7068                }
7069            }
7070        </script>
7070
7071        <div class="fluid-container lg:container-x-spacing">
7072            <template x-for="(banner, index) in productBanners">
7073                <div :data-banner="JSON.stringify(banner)"
7074                     :data-banner-position="window.listingSenseiProductPosition = window.listingSenseiProductPosition ? window.listingSenseiProductPosition + 1 : 1"
7075                     x-intersect="scrollViewEvent(banner.unitId)">
7076                    
7076<script>
7077                        'use strict';
7078
7079                        function initSliderComponent_6ab4fb8d88a47(position) {
7080                            return {
7081                                bannerPosition: position,
7082                                loading: true,
7083                                banner: null,
7084                                bannerProducts: [],
7085                                offers: null,
7086                                active: 0,
7087                                itemCount: null,
7088                                itemWidth: 362,
7089                                bannerElement: null,
7090                                getSlider() {
7091                                    return this.$root.querySelector('.js_slides');
7092                                },
7093                                pageSize: 4,
7094                                pageFillers: 0,
7095                                calcPageSize() {
7096                                    const slider = this.getSlider();
7097                                    if (slider) {
7098                                        this.pageSize = Math.round(slider.clientWidth / this.itemWidth);
7099                                        this.pageFillers = (
7100                                            this.pageSize * Math.ceil(this.itemCount / this.pageSize)
7101                                        ) - this.itemCount;
7102                                    }
7103                                },
7104                                calcActive() {
7105                                    const slider = this.getSlider();
7106                                    if (slider) {
7107                                        this.calcPageSize()
7108                                        const sliderItems = this.itemCount + this.pageFillers;
7109                                        const calculatedActiveSlide = slider.scrollLeft / (slider.scrollWidth / sliderItems);
7110                                        this.active = Math.round(calculatedActiveSlide / this.pageSize) * this.pageSize;
7111                                    }
7112                                },
7113                                scrollPrevious() {
7114                                    this.scrollTo(this.active - this.pageSize);
7115                                },
7116                                scrollNext() {
7117                                    this.scrollTo(this.active + this.pageSize);
7118                                },
7119                                scrollTo(idx) {
7120                                    const slider = this.getSlider();
7121                                    if (slider) {
7122                                        const slideWidth = slider.scrollWidth / (this.itemCount + this.pageFillers);
7123                                        slider.scrollLeft = Math.floor(slideWidth) * idx;
7124                                        this.active = idx;
7125                                    }
7126                                },
7127                                createAddToCartUrl: function (productId) {
7128                                    const currentLocationUENC = encodeURIComponent(
7129                                        this.encodeUenc(BASE_URL),
7130                                    );
7131                                    return BASE_URL +
7132                                        "checkout/cart/add/uenc/" +
7133                                        currentLocationUENC +
7134                                        "/product/" +
7135                                        productId
7136                                },
7137                                encodeUenc: function (value) {
7138                                    const regex = /=/gi;
7139                                    return btoa(value).replace(regex, ",");
7140                                },
7141                                addToCartRecsEvent: function (e, unitId, productId) {
7142                                    // requires recommendationsContext to be set
7143                                    magentoStorefrontEvents.publish.recsItemAddToCartClick(
7144                                        unitId, productId, magentoStorefrontEvents.context
7145                                    );
7146                                },
7147                                recsClickEvent: function (unitId, productId, productUrl) {
7148                                    magentoStorefrontEvents.publish.recsItemClick(
7149                                        unitId, productId, magentoStorefrontEvents.context
7150                                    );
7151                                    // Timeout to prevent submission before event has fired.
7152                                    setTimeout(() => window.location.href = productUrl, window.magentoStorefrontEventsDefaultTimeout);
7153                                },
7154                                initProducts: function (banner) {
7155                                                                                                            banner.products = banner.products.filter((product) => {
7156                                        if ('product_has_custom_options' in product.attributes) {
7157                                            let value = product.attributes.product_has_custom_options[0];
7158                                            if (value === "1" || value === 1 || value === "true") {
7159                                                return false;
7160                                            }
7161                                        }
7162
7163                                        return true;
7164                                    });
7165                                    
7166                                    this.banner = banner;
7167                                    this.itemCount = banner.totalProducts;
7168                                    this.bannerElement = document.getElementById(banner.unitId);
7169                                    this.bannerProducts = banner.products;
7170                                    this.loading = false;
7171                                    this.calcPageSize();
7172                                },
7173                                getOfferByProductId: function (productId) {
7174                                    let offer = this.offers.find(offer => offer['product_id'] === productId);
7175                                    if (typeof offer !== 'object') {
7176                                        return null;
7177                                    }
7178
7179                                    return offer;
7180                                },
7181                            }
7182                        }
7183                    </script>
7183
7184                    <div class="lg:relative"
7185                         x-data="initSliderComponent_6ab4fb8d88a47(JSON.parse($el.parentElement.dataset.bannerPosition))"
7186                         x-init="initProducts(JSON.parse($el.parentElement.dataset.banner));"
7187                         @resize.window.debounce="calcPageSize(); $nextTick(() => calcActive())"
7188                    >
7189                        <template x-if="loading === false && bannerProducts.length > 0">
7190                            <div class="container-x-spacing lg:p-0">
7191                                <div class="mb-4">
7192                                    <p x-text='banner?.storefrontLabel ? banner.storefrontLabel : bannerElement?.dataset.title'
7193                                        class="text-h2 text-secondary-alt1"></p>
7194                                </div>
7195                                <div class="flex-none relative w-full flex justify-center overflow-x-hidden md:pl-4 lg:pl-0">
7196                                    <div class="relative flex flex-nowrap w-full overflow-auto transition-all js_slides snap "
7197                                         @scroll.debounce="calcActive"
7198                                    >
7199                                        <template x-for="(product, index) in bannerProducts" :key="index">
7200                                            <div :data-key="index"
7201                                                 :id="'pdp-CrosS-Sensei' + bannerPosition + '-' + index + '-card'"
7202                                                 :data-product="JSON.stringify(product)"
7203                                                 :data-banner-unit-id="JSON.stringify(banner.unitId)"
7204                                                 :data-banner-type-id="banner.typeId"
7205                                                 :data-banner-position="bannerPosition"
7206                                                 class="relative flex-shrink-0 w-full js_slide pb-2 pl-4 pr-32 -mr-32 md:first:pl-0 md:pl-6 md:pr-14 md:-mr-14 md:w-1/2 lg:w-1/3 lg:px-3 lg:-mr-0 xl:w-1/4">
7207                                                <form method="post"
7208                                                      tabindex="0"
7209                                                      x-data="{...initSenseiAjaxAddToCart(JSON.parse($el.parentElement.dataset.product)),...initPromoLabel()}"
7210                                                      x-bind="eventListeners"
7211                                                      x-init="
7212                                             initProduct(JSON.parse($el.parentElement.dataset.product))
7213                                             bannerUnitId = JSON.parse($el.parentElement.dataset.bannerUnitId)
7214                                             form = $el
7215                                         "
7216                                                      :id="generateId('space')"
7217                                                      x-bind:action="createAddToCartUrl(product.productId)"
7218                                                      @submit.prevent="addToCartRecsEvent($event.target, bannerUnitId, product.productId)"
7219                                                                                                          class="h-full item product product-item product_addtocart_form card flex flex-col w-full relative">
7220                                                    <input name="form_key" type="hidden" :value="hyva.getFormKey()"/>
7221                                                    <input type="hidden" name="product" x-bind:value="product.productId">
7222
7223                                                    <template x-if="isActiveOffer">
7224                                                        <div class="absolute right-6 -top-2 z-10 flex flex-col justify-center items-center">
7225                                                            <div x-show="promo_descriptions?.WEBTOP && promo_descriptions?.WEBMIDDLE && promo_descriptions?.WEBBOTTOM"
7226                                                                 class="w-[125px] relative">
7227                                                                <div>
7228                                                                    <svg xmlns="http://www.w3.org/2000/svg"
7229                                                                         id="Layer_1" x="0px" y="0px" viewBox="0 0 100 104"
7230                                                                         class="w-[125px]"
7231                                                                         xml:space="preserve">
7232                                                <style type="text/css">
7233                                                    .st0 {
7234                                                        fill: #D10019;
7235                                                    }
7236
7237                                                    .st1 {
7238                                                        fill: #AA0014;
7239                                                    }
7240                                                </style>
7241                                                                        <path class="st0"
7242                                                                              d="M100,91.7v-6V73.5V0H0v73.5v12.2v6c0,0,20.4,11.6,50,11.6C79.6,103.3,100,91.7,100,91.7"/>
7243                                                                        <path class="st1"
7244                                                                              d="M100,26.7V14.1v-2.6V0H0v11.4v2.6v12.7c0,
72440,20.4,11.6,50,11.6C79.6,38.3,100,26.7,100,26.7"/>
7245                                            </svg>
7246                                                                </div>
7247                                                                <div class="absolute top-0 left-0 w-[125px] h-[129px] text-white flex flex-col items-center text-center overflow-hidden">
7248                                                            <span class="mt-2 font-semibold max-w-[95%]"
7249                                                                  x-bind:style="`font-size: ${sizeFinderTop()}`"
7250                                                                  x-text="promo_descriptions?.WEBTOP"></span>
7251                                                                    <span class="mt-[20px] font-bold max-w-[95%]"
7252                                                                          x-bind:style="`font-size: ${sizeFinderMiddle()}; line-height: ${lineHeightFinderMiddle()}`"
7253                                                                          x-text="promo_descriptions?.WEBMIDDLE"></span>
7254                                                                    <span class="mt-[3px] text-[12px] max-w-[95%]"
7255                                                                          x-text="promo_descriptions?.WEBBOTTOM"></span>
7256                                                                </div>
7257                                                            </div>
7258                                                            <div x-show="promo_descriptions?.WEBTOP && promo_descriptions?.WEBMIDDLE && !promo_descriptions?.WEBBOTTOM"
7259                                                                 class="w-[125px] relative">
7260                                                                <div>
7261                                                                    <svg xmlns="http://www.w3.org/2000/svg"
7262                                                                         id="Layer_1" x="0px" y="0px" viewBox="0 0 100 104"
7263                                                                         class="w-[125px]"
7264                                                                         xml:space="preserve">
7265                                                <style type="text/css">
7266                                                    .st0 {
7267                                                        fill: #D10019;
7268                                                    }
7269
7270                                                    .st1 {
7271                                                        fill: #AA0014;
7272                                                    }
7273                                                </style>
7274                                                                        <path class="st0"
7275                                                                              d="M100,91.7v-6V73.5V0H0v73.5v12.2v6c0,0,20.4,11.6,50,11.6C79.6,103.3,100,91.7,100,91.7"/>
7276                                                                        <path class="st1"
7277                                                                              d="M100,26.7V14.1v-2.6V0H0v11.4v2.6v12.7c0,0,20.4,11.6,50,11.6C79.6,38.3,100,26.7,100,26.7"/>
7278                                            </svg>
7279                                                                </div>
7280                                                                <div class="absolute top-0 left-0 w-[125px] h-[129px] text-white flex flex-col items-center text-center overflow-hidden">
7281                                                            <span class="mt-2 font-semibold max-w-[95%]"
7282                                                                  x-bind:style="`font-size: ${sizeFinderTop()}`"
7283                                                                  x-show="promo_descriptions?.WEBTOP" x-text="promo_descriptions?.WEBTOP"></span>
7284                                                                    <span class="my-auto font-bold max-w-[95%]"
7285                                                                          x-bind:style="`font-size: ${sizeFinderMiddle()}`"
7286                                                                          x-text="promo_descriptions?.WEBMIDDLE"></span>
7287                                                                    <sp
7287an class="mt-2 text-[22px] font-semibold max-w-[95%]"
7288                                                                          x-show="promo_descriptions?.WEBBOTTOM"
7289                                                                          x-text="promo_descriptions?.WEBBOTTOM"></span>
7290                                                                </div>
7291                                                            </div>
7292                                                            <div x-show="!promo_descriptions?.WEBTOP && promo_descriptions?.WEBMIDDLE && !promo_descriptions?.WEBBOTTOM"
7293                                                                 class="w-[125px] relative">
7294                                                                <div class="flex items-center justify-center">
7295                                                                    <svg class="fill-[#D10019] w-[125px]"
7296                                                                         xmlns="http://www.w3.org/2000/svg"
7297                                                                         id="Layer_1" x="0px" y="0px" viewBox="0 0 100 104"
7298                                                                         xml:space="preserve">
7299                                                <path class="st0"
7300                                                      d="M100,91.7v-6V73.5V0H0v73.5v12.2v6c0,0,20.4,11.6,50,11.6C79.6,103.3,100,91.7,100,91.7"/>
7301                                            </svg>
7302                                                                </div>
7303                                                                <div class="absolute top-0 left-0 w-[125px] h-[129px] text-white flex flex-col items-center justify-center text-center overflow-hidden">
7304                                                            <span class="font-bold max-w-[95%]"
7305                                                                  x-bind:style="`font-size: ${sizeFinderMiddle()}`"
7306                                                                  x-text="promo_descriptions?.WEBMIDDLE"></span>
7307                                                                </div>
7308                                                            </div>
7309                                                        </div>
7310                                                    </template>
7311
7312                                                    <div class="product photo product-item-photo block mx-auto mb-4 "
7313                                                         tabindex="-1">
7314                                                        <a :id="generateId('image')"
7315                                                            >
7316                                                            <img class="hover:shadow-sm object-contain aspect-square"
7317                                                                 loading="lazy"
7318                                                                 :id="generateId('image')"
7319                                                                 x-bind:alt="product.name"
7320                                                                 x-bind:src="(product.smallImage?.url ? product.smallImage?.url : product.image?.url) ?? ''"
7321                                                                 width="278"
7322                                                                 height="278"
7323                                                            >
7324                                                        </a>
7325                                                    </div>
7326                                                    <div class="product-info flex flex-col flex-grow">
7327                                                    <span class="text-gray text-sm"
7328                                                          x-text="product.attributes.product_brand"></span>
7329                                                        <div
7330                                                            class="mt-1 mb-4 items-center justify-center text-gray font-semibold text-base">
7331                                                            <a class="product-item-link "
7332                                                               :id="generateId('text')"
7333                                                               x-text="product.name"
7334                                                                ></a>
7335                                                        </div>
7336                                                        <div class="flex items-center justify-between flex-wrap"
7337                                                             :id="generateId('text')">
7338                                                            <div class="variant flex flex-col">
7339                                                                <template x-if="variantTextArray">
7340                                                                    <template x-for="text in variantTextArray">
7341                                                            <span x-text="text"
7342                                                                  :id="generateId('text')"
7343                                                                  class="text-gray text-xs"></span>
7344                                                                    </template>
7345                                                                </template>
7346                                                            </div>
7347                                                                                                                    </div>
7348                                                        <div class="flex justify-between items-end mt-auto"
7349                                                             :id="generateId('button')">
7350                                                            <template x-if="product.prices">
7351                                                                <div class="pt-1 box-border flex"
7352                                                                     :id="generateId('text')"
7353                                                                     x-bind:data-product-id="product.productId">
7354                                                                    <template
7355                                                                        x-if="product.prices.minimum.final === product.prices.minimum.regular">
7356                                                           <span class="normal-price"
7357                                                                 :id="generateId('text')">
7358                                                                <span class="price-container price-final_price"
7359                                                                      :id="generateId('text')">
7360                                                                    <span id="product-price" class="price-wrapper"
7361                                                                          :id="generateId('text')">
7362                                                                        <span class="price"
7363                                                                              :id="generateId('text')"
7364                                                                              x-text="hyva.formatPrice(product.prices.minimum.final)"></span>
7365                                                                    </span>
7366                                                                </span>
7367                                                            </span>
7368                                                                    </template>
7369                                                                    <template
7370                                                                        x-if="product.prices.minimum.final !== product.prices.minimum.regular">
7371                                                                        <div class="flex flex-col">
7372                                                                <span class="special-price"
7373                                                                      :id="generateId('text')">
7374                                                                    <span class="price-container"
7375                                                                          :id="generateId('text')">
7376                                                                        <span class="price"
7377                                                                              :id="generateId('text')"
7378                                                                              x-text="hyva.formatPrice(product.prices.minimum.final)"></span>
7379                                                                    </span>
7380                                                                </span>
7381                                                                            <span class="old-price"
7382                                                                                  :id="generateId('text')">
7383                                                                    <sp
7383an class="price-container"
7384                                                                          :id="generateId('text')">
7385                                                                        <span class="price"
7386                                                                              :id="generateId('text')"
7387                                                                              x-text="hyva.formatPrice(product.prices.minimum.regular)"></span>
7388                                                                    </span>
7389                                                                </span>
7390                                                                        </div>
7391                                                                    </template>
7392                                                                </div>
7393                                                            </template>
7394                                                            <template x-if="product.addToCartAllowed">
7395                                                                <a
7396                                                                    role='button'
7397                                                                    class="flex items-center gap-2 btn-primary rounded px-4 py-2 justify-center w-20"
7398                                                                    :class="isLoading ? 'bg-gray/40 border-transparent hover:bg-gray/40 border-2 disabled text-white cursor-not-allowed' : 'btn-primary'"
7399                                                                    @click.prevent="addToCartSubmit($event.target, bannerUnitId)"
7400                                                                    :id="generateId('button')"
7401                                                                    :disabled="isLoading"
7402                                                                    :href="product.url"
7403                                                                >
7404                                                                    <i x-show="!isLoading">
7405                                                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon fill-white" width="18" height="16" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M96 0C107.5 0 117.4 8.19 119.6 19.51L121.1 32H541.8C562.1 32 578.3 52.25 572.6 72.66L518.6 264.7C514.7 278.5 502.1 288 487.8 288H170.7L179.9 336H488C501.3 336 512 346.7 512 360C512 373.3 501.3 384 488 384H159.1C148.5 384 138.6 375.8 136.4 364.5L76.14 48H24C10.75 48 0 37.25 0 24C0 10.75 10.75 0 24 0H96zM475.6 240L520.6 80H131.1L161.6 240H475.6zM128 464C128 437.5 149.5 416 176 416C202.5 416 224 437.5 224 464C224 490.5 202.5 512 176 512C149.5 512 128 490.5 128 464zM512 464C512 490.5 490.5 512 464 512C437.5 512 416 490.5 416 464C416 437.5 437.5 416 464 416C490.5 416 512 437.5 512 464z"/></svg>
7406                                                                    </i>
7407                                                                    <i x-show="!isLoading">
7408                                                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon fill-white" width="12" height="12" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M432 256C432 269.3 421.3 280 408 280h-160v160c0 13.25-10.75 24.01-24 24.01S200 453.3 200 440v-160h-160c-13.25 0-24-10.74-24-23.99C16 242.8 26.75 232 40 232h160v-160c0-13.25 10.75-23.99 24-23.99S248 58.75 248 72v160h160C421.3 232 432 242.8 432 256z"/></svg>
7409                                                                    </i>
7410
7411                                                                    <i x-show="isLoading" class="animate-spin">
7412                                                                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" class="icon fill-white" width="17" height="17" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M288 32C288 49.67 273.7 64 256 64C238.3 64 224 49.67 224 32C224 14.33 238.3 0 256 0C273.7 0 288 14.33 288 32zM288 480C288 497.7 273.7 512 256 512C238.3 512 224 497.7 224 480C224 462.3 238.3 448 256 448C273.7 448 288 462.3 288 480zM480 224C497.7 224 512 238.3 512 256C512 273.7 497.7 288 480 288C462.3 288 448 273.7 448 256C448 238.3 462.3 224 480 224zM32 288C14.33 288 0 273.7 0 256C0 238.3 14.33 224 32 224C49.67 224 64 238.3 64 256C64 273.7 49.67 288 32 288zM74.98 391.8C87.48 379.3 107.7 379.3 120.2 391.8C132.7 404.3 132.7 424.5 120.2 437C107.7 449.5 87.48 449.5 74.98 437C62.48 424.5 62.48 404.3 74.98 391.8zM391.8 437C379.3 424.5 379.3 404.3 391.8 391.8C404.3 379.3 424.5 379.3 437 391.8C449.5 404.3 449.5 424.5 437 437C424.5 449.5 404.3 449.5 391.8 437zM120.2 74.98C132.7 87.48 132.7 107.7 120.2 120.2C107.7 132.7 87.48 132.7 74.98 120.2C62.48 107.7 62.48 87.48 74.98 74.98C87.48 62.49 107.7 62.49 120.2 74.98z"/></svg>
7413                                                                    </i>
7414                                                                </a>
7415                                                            </template>
7416                                                        </div>
7417                                                    </div>
7418                                                </form>
7419                                            </div>
7420                                        </template>
7421                                        <div :class="{
7422                            'js_dummy_slide w-full md:w-1/2 lg:w-1/3 xl:w-1/4 flex flex-shrink-0 py-1' : pageFillers > 0
7423                            }"></div>
7424                                        <div :class="{
7425                            'js_dummy_slide w-full md:w-1/2 lg:w-1/3 xl:w-1/4 flex flex-shrink-0 py-1' : pageFillers > 1
7426                            }"></div>
7427                                        <div :class="{
7428                            'js_dummy_slide w-full md:w-1/2 lg:w-1/3 xl:w-1/4 flex flex-shrink-0 py-1' : pageFillers > 2
7429                            }"></div>
7430                                    </div>
7431                                </div>
7432                                    <template x-if="itemCount > pageSize">
7433                                        <div class="lg:min-h-[65px] hidden lg:block">
7434                                            <div class="flex items-center justify-center py-5">
7435                                                <button
7436                                                    aria-label="Pr&#xE9;c&#xE9;dent"
7437                                                    tabindex="-1"
7438                                                    class="hidden text-white bg-primary rounded-full p-1 lg:w-8 lg:justify-center lg:flex-none lg:absolute lg:top-[55%] lg:-left-10"
7439                                                    :class="{ 'lg:hidden' : active === 0,
7440                                      'lg:flex' : active !== 0
7441                                    }"
7442                                                    @click="scrollPrevious">
7443                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="14" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M447.1 256c0 13.25-10.76 24.01-24.01 24.01H83.9l132.7 126.6c9.625 9.156 9.969 24.41 .8125 33.94c-9.156 9.594-24.34 9.938-33.94 .8125l-176-168C2.695 268.9 .0078 262.6 .0078 256S2.695 243.2 7.445 238.6l176-168C193 61.51 208.2 61.85 217.4 71.45c9.156 9.5 8.812 24.75-.8125 33.94l-132.7 126.6h340.1C437.2 232 447.1 242.8 447.1 256z"/></svg>
7444                                                </button>
7445                                                <div
7446                                                    class="hidden lg:flex flex-wrap items-center justify-center w-full md:w-auto">
7447                                                    <template x-for="i in itemCount">
7448                                        <span class="flex-shrink-0 transition block m-1
7449                                    rounded-full cursor-pointer hover:bg-opacity-100"
7450                                              :class="{
7451                                        'bg-opacity-100 w-3 h-3 bg-primary' : active === i - 1,
7452                                        'w-2 h-2 bg-gray hover:bg-primary bg-opacity-25' : active !== i - 1,
7453                                        'hidden' : (pageSize !== 1 && !!((i - 1) % pageSize))
7454                                        }"
7455                                              @click="scrollTo(i)">
7456                                        </span>
7457                                                    </template>
7458                                                </div>
7459                                                <button
7460                                                    aria-label="Suivant"
7461                                                    tabindex="-1"
7462                                                    class="hidden text-white bg-primary rounded-full p-1 lg:w-8 lg:justify-center lg:flex-none lg:absolute lg:top-[53%] lg:-right-10"
7463                                                    :class="{ 'lg:hidden' : active >= itemCount-pageSize,
7464                                      'lg:flex' : active < itemCount-pageSize
7465                                    }"
7466                                                    @click="scrollNext">
7467                                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="14" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M264.6 70.63l176 168c4.75 4.531 7.438 10.81 7.438 17.38s-2.688 12.84-7.438 17.38l-176 168c-9.594 9.125-24.78 8.781-33.94-.8125c-9.156-9.5-8.812-24.75 .8125-33.94l132.7-126.6H24.01c-13.25 0-24.01-10.76-24.01-24.01s10.76-23.99 24.01-23.99h340.1l-132.7-126.6C221.8 96.23 221.5 80.98 230.6 71.45C239.8 61.85 254.1 61.51 264.6 70.63z"/></svg>
7468                                                </button>
7469                                            </div>
7470                                        </div>
7471                                    </template>
7472                            </div>
7473                        </template>
7474                    </div>
7475                </div>
7476            </template>
7477        </div>
7478    </div>
7479</template>
7480    </section>
7481</div>
7482
7483<script>
7484    function recommendedProducts_below_main_content() {
7485        return {
7486            productBanners: [],
7487            pagePreconfiguredDeferred: {},
7488            bannerPlacement: 'below-main-content',
7489            initProductRecBlock: function (placement) {
7490                let self = this;
7491                window.magentoStorefrontEvents.subscribe.recsResponseReceived(function () {
7492                    let recsData = window.magentoStorefrontEvents.context.getRecommendations();
7493                    self.renderProductRecs(recsData);
7494                });
7495            },
7496            renderProductRecs: function (recsData) {
7497                let self = this;
7498                recsData.units.forEach(function (unit, index) {
7499                    if (unit.pagePlacement === self.bannerPlacement) {
7500                        self.productBanners.push(unit);
7501
7502                        /** @todo move event outside of recsResponseReceived event **/
7503                        window.magentoStorefrontEvents.publish.recsUnitRender(
7504                            unit.unitId, magentoStorefrontEvents.context
7505                        );
7506                    }
7507                });
7508            },
7509            addToCartRecsEvent: function (e, unitId, productId) {
7510                // requires recommendationsContext to be set
7511                magentoStorefrontEvents.publish.recsItemAddToCartClick(
7512                    unitId, productId, magentoStorefrontEvents.context
7513                );
7514            },
7515            scrollViewEvent: function (unitId) {
7516                magentoStorefrontEvents.publish.recsUnitView(
7517                    unitId, magentoStorefrontEvents.context
7518                );
7519            },
7520            recsClickEvent: function (unitId, productId, productUrl) {
7521                magentoStorefrontEvents.publish.recsItemClick(
7522                    unitId, productId, magentoStorefrontEvents.context
7523                );
7524                // Timeout to prevent submission before event has fired.
7525                setTimeout(() => window.location.href = productUrl, window.magentoStorefrontEventsDefaultTimeout);
7526            },
7527            createAddToCartUrl: function (productId) {
7528                const currentLocationUENC = encodeURIComponent(
7529                    this.encodeUenc(BASE_URL),
7530                );
7531                return BASE_URL +
7532                    "checkout/cart/add/uenc/" +
7533                    currentLocationUENC +
7534                    "/product/" +
7535                    productId
7536            },
7537            encodeUenc: function (value) {
7538                const regex = /=/gi;
7539                return btoa(value).replace(regex, ",");
7540            },
7541        }
7542    }
7543</script>
7543
7544</main><footer class="page-footer"><div class="footer content">    
7545<div class="border-t border-gray border-opacity-20">
7546        <div class="fluid-container container-x-spacing flex flex-wrap p-4 pb-8 md:pt-8 lg:pb-14">
7547        <div class="logo w-1/5 md:w-1/6 lg:w-2/12 lg:pr-20 lg:box-border">
7548                <img
7549        loading="lazy"
7550        src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/images/logo.svg"
7551        width="105"
7552        height="62"
7553        alt="Aveve"
7554    />
7555        </div>
7556        <div
7557            class="flex flex-wrap links box-border w-full md:pt-8 lg:w-full lg:flex-nowrap lg:pt-8 lg:pl-2.5 xl:w-9/12">
7558                    <div class="links__wrapper box-border mt-5 w-full md:mt-0 md:mb-10 md:w-1/2 md:pr-24 lg:mb-0 lg:w-2/5">
7559                    <span class="links__title text-gray font-semibold text-lg">
7560                        Notre assortiment                    </span>
7561        <ul class="pt-2 flex flex-wrap flex-col md:pt-2.5 gap-x-8">
7562                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7563                        <a class="link-navigation"
7564                           href="https://www.aveve.be/fr/apercu-jardin"
7565                           target=""
7566                        >
7567                            Jardin                        </a>
7568                    </li>
7569                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7570                        <a class="link-navigation"
7571                           href="https://www.aveve.be/fr/apercu-animaux"
7572                           target=""
7573                        >
7574                            Animaux                        </a>
7575                    </li>
7576                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7577                        <a class="link-navigation"
7578                           href="https://www.aveve.be/fr/apercu-delices"
7579                           target=""
7580                        >
7581                            Gourmandises                        </a>
7582                    </li>
7583                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7584                        <a class="link-navigation"
7585                           href="https://www.aveve.be/fr/promotions"
7586                           target=""
7587                        >
7588                            Promotions                        </a>
7589                    </li>
7590                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7591                        <a class="link-navigation"
7592                           href="https://www.aveve.be/fr/ateliers"
7593                           target=""
7594                        >
7595                            Ateliers et démos                        </a>
7596                    </li>
7597                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7598                        <a class="link-navigation"
7599                           href="https://www.aveve.be/fr/guides"
7600                           target=""
7601                        >
7602                            Guides                        </a>
7603                    </li>
7604                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7605                        <a class="link-navigation"
7606                           href="https://www.aveve.be/fr/cheque-cadeau"
7607                           target="_blank"
7608                        >
7609                            Chèque-cadeau                        </a>
7610                    </li>
7611                                    </ul>
7612    </div>
7613    <div class="links__wrapper box-border mt-5 w-full md:mt-0 md:mb-10 md:w-1/2 md:pr-24 lg:mb-0 lg:w-2/5">
7614                    <span class="links__title text-gray font-semibold text-lg">
7615                        Service client                    </span>
7616        <ul class="pt-2 flex flex-wrap flex-col md:pt-2.5 gap-x-8">
7617                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7618                        <a class="link-navigation"
7619                           href="https://www.aveve.be/fr/contact"
7620                           target=""
7621                        >
7622                            Contactez-nous                        </a>
7623                    </li>
7624                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7625                        <a class="link-navigation"
7626                           href="https://www.aveve.be/fr/faq"
7627                           target=""
7628                        >
7629                            FAQ                        </a>
7630                    </li>
7631                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7632                        <a class="link-navigation"
7633                           href="https://www.aveve.be/fr/faq/commande/commande"
7634                           target=""
7635                        >
7636                            Commander                        </a>
7637                    </li>
7638                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7639                        <a class="link-navigation"
7640                           href="https://www.aveve.be/fr/b2bcontact"
7641                           target=""
7642                        >
7643                            Commande professionnelle                        </a>
7644                    </li>
7645                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7646                        <a class="link-navigation"
7647                           href="https://www.aveve.be/fr/faq/livraison"
7648                           target=""
7649                        >
7650                            Livraison                        </a>
7651                    </li>
7652                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7653                        <a class="link-navigation"
7654                           href="https://www.aveve.be/fr/retours"
7655                           target="_blank"
7656                        >
7657                            Retours                        </a>
7658                    </li>
7659                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7660                        <a class="link-navigation"
7661                           href="https://www.aveve.be/fr/magasins"
7662                           target=""
7663                        >
7664                            Nos magasins                        </a>
7665                    </li>
7666                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7667                        <a class="link-navigation"
7668                           href="https://www.aveve.be/fr/customer/account"
7669                           target=""
7670                        >
7671                            MyAveve carte de fidélité                        </a>
7672                    </li>
7673                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7674                        <a class="link-navigation"
7675                           href="https://www.aveve.be/fr/rappel"
7676                           target=""
7677                        >
7678                            Rappel                        </a>
7679                    </li>
7680                                    </ul>
7681    </div>
7682    <div class="links__wrapper box-border mt-5 w-full md:mt-0 md:mb-10 md:w-1/2 md:pr-24 lg:mb-0 lg:w-2/5">
7683                    <span class="links__title text-gray font-semibold text-lg">
7684                        Info d&#039;Aveve                    </span>
7685        <ul class="pt-2 flex flex-wrap flex-col md:pt-2.5 gap-x-8">
7686                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7687                        <a class="link-navigation"
7688                           href="https://www.aveve.be/fr/notre-plan-de-developpement-durable"
7689                           target=""
7690                        >
7691                            Notre plan de développement durable                        </a>
7692                    </li>
7693                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7694                        <a class="link-navigation"
7695                           href="https://www.aveve.be/fr/mission"
7696                           target=""
7697                        >
7698                            Mission                        </a>
7699                    </li>
7700                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7701                        <a class="link-navigation"
7702                           href="https://www.aveve.be/fr/conditions-dutilisation"
7703                           target=""
7704                        >
7705                            Conditions d’utilisation                        </a>
7706                    </li>
7707                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7708                        <a class="link-navigation"
7709                           href="https://www.aveve.be/fr/déclaration-de-confidentialité"
7710                           target=""
7711                        >
7712                            Déclaration de confidentialité                        </a>
7713                    </li>
7714                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7715                        <a class="link-navigation"
7716                           href="https://www.aveve.be/fr/déclaration-en-matière-de-cookies"
7717                           target=""
7718                        >
7719                            Déclaration en matière de cookies                        </a>
7720                    </li>
7721                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7722                        <a class="link-navigation"
7723                           href="https://www.aveve.be/fr/declaration-d-accessibilite"
7724                           target=""
7725                        >
7726                            Déclaration d&#039;accessibilité                        </a>
7727                    </li>
7728                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7729                        <a class="link-navigation"
7730                           href="https://jobs.arvesta.eu/?locale=fr_FR"
7731                           target="_blank"
7732                        >
7733                            Travailler chez Aveve                        </a>
7734                    </li>
7735                                                                <li class="text-gray font-normal text-sm mb-2.5 box-border pr-2 w-auto focus-visible:outline-0">
7736                        <a class="link-navigation"
7737                           href="https://www.aveve.be/fr/devenez-franchise-aveve"
7738                           target=""
7739                        >
7740                            Devenez franchisé Aveve                        </a>
7741                    </li>
7742                                    </ul>
7743    </div>
7744            <div class="flex flex-wrap flex-col pt-8 w-full md:pt-0 md:w-1/2 lg:pt-0 lg:w-auto">
7745                                <span class="text-gray font-semibold text-lg w-full pb-2 md:pb-2.5"
7746              id="language-picker-description">
7747            Langue        </span>
7748        <div class="relative flex gap-1 "
7749            >
7750        
7751            <div class="flex">
7752                                                                <a lang="NL"
7753                       hreflang="NL"
7754                                                                            href="https://www.aveve.be/fr/stores/store/redirect/___store/nl/___from_store/fr/uenc/aHR0cHM6Ly93d3cuYXZldmUuYmUvbmwvY2hlY2tvdXQvY2FydC9pbmRleC8~/"
7755                                               aria-label="NL language"
7756                       tabindex="0"
7757                       role="button"
7758                       class="focus:outline-none focus:shadow-none focus:ring-0 transition flex items-center justify-center rounded-sm text-primary text-sm border border-primary w-10 h-8 btn-focus hover:bg-secondary-alt1 hover:text-white hover:border-secondary-alt1 focus:border-secondary-alt1 focus:bg-secondary-alt1 focus:text-white focus:border-secondary-alt1">
7759                        NL                    </a>
7760                                                                                <a lang="FR"
7761                       hreflang="FR"
7762                       href="javascript:void(0)"
7763                       aria-label="FR language"
7764                       tabindex="0"
7765                       role="button"
7766                       aria-pressed="true"
7767                       class="focus:outline-none focus:shadow-none focus:ring-0 transition flex items-center justify-center bg-primary text-white rounded-sm uppercase text-sm w-10 h-8 btn-focus border focus:border-current focus:bg-secondary-alt1 focus:text-white focus:border-secondary-alt1">
7768                        FR                    </a>
7769                                        </div>
7770            
7771                    
7771<script>
7772                window.addEventListener('DOMContentLoaded', () => {
7773                    window.dispatchEvent(new CustomEvent('language-switcher', {detail: {"1":"https:\/\/www.aveve.be\/fr\/stores\/store\/redirect\/___store\/nl\/___from_store\/fr\/uenc\/aHR0cHM6Ly93d3cuYXZldmUuYmUvbmwvY2hlY2tvdXQvY2FydC9pbmRleC8~\/","3":"https:\/\/www.aveve.be\/fr\/stores\/store\/redirect\/___store\/fr\/___from_store\/fr\/uenc\/aHR0cHM6Ly93d3cuYXZldmUuYmUvZnIvY2hlY2tvdXQvY2FydC9pbmRleC8~\/"}}))
7774                });
7775            </script>
7775
7776                    </div>
7777                
7778    <section class="w-full mt-3 mb-3">
7779        <style>.cmsb463-mb-2 {
7780margin-bottom: 0.5rem
7781}
7782.cmsb463-flex {
7783display: flex
7784}
7785.cmsb463-max-w-\[128px\] {
7786max-width: 128px
7787}
7788.cmsb463-flex-wrap {
7789flex-wrap: wrap
7790}
7791.cmsb463-gap-2 {
7792gap: 0.5rem
7793}
7794@media (min-width: 640px) {
7795.cmsb463-sm\:w-\[90vw\] {
7796width: 90vw
7797}
7798}
7799@media (min-width: 768px) {
7800.cmsb463-md\:w-\[33vw\] {
7801width: 33vw
7802}
7803}
7804@media (min-width: 1024px) {
7805.cmsb463-lg\:w-\[20vw\] {
7806width: 20vw
7807}
7808}</style>
7809<div data-content-type="html" data-appearance="default" data-element="main" data-decoded="true"><div class="cmsb463-mb-2">Payez en toute sécurité avec</div>
7810<div class="cmsb463-flex cmsb463-flex-wrap cmsb463-lg:w-[20vw] cmsb463-md:w-[33vw] cmsb463-sm:w-[90vw] cmsb463-max-w-[128px] cmsb463-gap-2">
7811	<image src="https://www.aveve.be/media/wysiwyg/Bancontact-Small-Card.png" alt="Bancontact-icon" width="33px"/>
7812	<image src="https://www.aveve.be/media/wysiwyg/KBC-Small-Card.png" alt="KBC-icon" width="33px"/>
7813	<image src="https://www.aveve.be/media/wysiwyg/Belfius-Small-Card.png" alt="Belfius-icon" width="33px"/>
7814	<image src="https://www.aveve.be/media/wysiwyg/Visa-Small-Card.png" alt="Visa-icon" width="33px"/>
7815	<image src="https://www.aveve.be/media/wysiwyg/Mastercard-Small-Card.png" alt="Mastercard-icon" width="33px"/>
7816	<image src="https://www.aveve.be/media/wysiwyg/iDEAL-Wero-Small-Card.png" alt="iDEAL-Wero-icon" width="33px"/>
7817	<image src="https://www.aveve.be/media/wysiwyg/Google-Pay-Small-Card.png" alt="Google-Pay-icon" width="33px"/>
7818	<image src="https://www.aveve.be/media/wysiwyg/Apple-Pay-Small-Card.png" alt="Apple-Pay-icon" width="33px"/>
7819</div></div>    </section>
7820            </div>
7821        </div>
7822    </div>
7823    
7824    
7825<div class="bg-primary-alt1">
7826    <div class="fluid-container container-x-spacing pt-7 pb-4 flex flex-wrap justify-start items-center md:pb-6 md:pt-7 2xl:py-4 2xl:flex-nowrap">
7827        <div class="flex justify-end mb-6 w-full md:mb-0 md:order-2 md:w-1/2 2xl:order-3 lg:box-border lg:pl-9 2xl:w-auto">
7828                            <a target="_blank"
7829                   aria-label="youtube"
7830                   href="https://www.youtube.com/channel/UCxKDdutYKiOU1XruOyVbrvw" class="pr-5 last:pr-0 text-gray">
7831                                        <i>
7832                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512" class="icon" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M549.655 124.083c-6.281-23.65-24.787-42.276-48.284-48.597C458.781 64 288 64 288 64S117.22 64 74.629 75.486c-23.497 6.322-42.003 24.947-48.284 48.597-11.412 42.867-11.412 132.305-11.412 132.305s0 89.438 11.412 132.305c6.281 23.65 24.787 41.5 48.284 47.821C117.22 448 288 448 288 448s170.78 0 213.371-11.486c23.497-6.321 42.003-24.171 48.284-47.821 11.412-42.867 11.412-132.305 11.412-132.305s0-89.438-11.412-132.305zm-317.51 213.508V175.185l142.739 81.205-142.739 81.201z"/></svg>
7833                    </i>
7834                </a>
7835                            <a target="_blank"
7836                   aria-label="facebook"
7837                   href="https://www.facebook.com/avevewinkels" class="pr-5 last:pr-0 text-gray">
7838                                        <i>
7839                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M400 32H48A48 48 0 0 0 0 80v352a48 48 0 0 0 48 48h137.25V327.69h-63V256h63v-54.64c0-62.15 37-96.48 93.67-96.48 27.14 0 55.52 4.84 55.52 4.84v61h-31.27c-30.81 0-40.42 19.12-40.42 38.73V256h68.78l-11 71.69h-57.78V480H400a48 48 0 0 0 48-48V80a48 48 0 0 0-48-48z"/></svg>
7840                    </i>
7841                </a>
7842                            <a target="_blank"
7843                   aria-label="instagram"
7844                   href="https://www.instagram.com/avevemagasins/" class="pr-5 last:pr-0 text-gray">
7845                                        <i>
7846                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" class="icon" width="24" height="24" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M224.1 141c-63.6 0-114.9 51.3-114.9 114.9s51.3 114.9 114.9 114.9S339 319.5 339 255.9 287.7 141 224.1 141zm0 189.6c-41.1 0-74.7-33.5-74.7-74.7s33.5-74.7 74.7-74.7 74.7 33.5 74.7 74.7-33.6 74.7-74.7 74.7zm146.4-194.3c0 14.9-12 26.8-26.8 26.8-14.9 0-26.8-12-26.8-26.8s12-26.8 26.8-26.8 26.8 12 26.8 26.8zm76.1 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM398.8 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"/></svg>
7847                    </i>
7848                </a>
7849                            <a target="_blank"
7850                   aria-label="twitter"
7851                   href="https://twitter.com/aveve" class="pr-5 last:pr-0 text-gray">
7852                                        <i>
7853                        <svg xmlns="http://www.w3.org/2000/svg" shape-rendering="geometricPrecision" text-rendering="geometricPrecision" image-rendering="optimizeQuality" fill-rule="evenodd" clip-rule="evenodd" viewBox="0 0 512 462.799" class="icon" width="24" height="24" aria-hidden="true"><path fill-rule="nonzero" d="M403.229 0h78.506L310.219 196.04 512 462.799H354.002L230.261 301.007 88.669 462.799h-78.56l183.455-209.683L0 0h161.999l111.856 147.88L403.229 0zm-27.556 415.805h43.505L138.363 44.527h-46.68l283.99 371.278z"/></svg>
7854                    </i>
7855                </a>
7856                    </div>
7857        <div class="text-sm font-normal flex w-full mt-1 md:mt-0 md:order-1 md:w-1/2 2xl:order-2 2xl
7857:w-auto">
7858                                                <a class="transition odd:flex odd:pr-6 odd:md:pr-0 odd:after:hidden odd:md:after:px-2 odd:md:after:content-['|'] odd:md:after:block text-primary hover:text-secondary-alt1"
7859                       href="https://arvesta.eu/fr"
7860                       target="_blank">
7861                        Arvesta                    </a>
7862                                                                <a class="transition odd:flex odd:pr-6 odd:md:pr-0 odd:after:hidden odd:md:after:px-2 odd:md:after:content-['|'] odd:md:after:block text-primary hover:text-secondary-alt1"
7863                       href="https://www.aveveagrarisch.be"
7864                       target="_blank">
7865                        Aveveagrarisch                    </a>
7866                                    </div>
7867        <p class="font-normal text-sm text-gray w-full mt-6 md:order-3 2xl:order-1 2xl:mt-0 lg:pr-6 lg:box-border 2xl:w-auto">
7868            © 2025, Aveve | Siège : Aarschotsesteenweg 84 3012 Leuven | BCE 0403.552.464 | RPM Leuven - [email protected]        </p>
7869    </div>
7870</div>
7871</div>
7872</div></footer>
7873<script>
7874    function dataServicesShoppingCartContextData()
7875    {
7876        return {
7877            initContext(cartData) {
7878                let contextCartItems = [];
7879
7880                cartData?.items?.forEach(function (item){
7881                    contextCartItems.push({
7882                        id: item.item_id,
7883                        formattedPrice: parseFloat(item.product_price_value ? item.product_price_value : 0),
7884                        quantity: item.qty,
7885                        product: {
7886                            productType: item.product_type,
7887                            productId: item.product_id,
7888                            name: item.product_name,
7889                            sku: item.product_sku,
7890                            mainImageUrl : item.product_image.src
7891                        },
7892                        prices: {
7893                            price: {
7894                                value: parseFloat(item.product_price_value ? item.product_price_value : 0)
7895                            }
7896                        }
7897                    })
7898                });
7899
7900                magentoStorefrontEvents.context.setShoppingCart({
7901                    id: cartData.dsCartId,
7902                    totalQuantity: cartData.summary_count,
7903                    prices: {
7904                        subtotalExcludingTax: {
7905                            value: parseFloat(cartData.subtotalAmountExclTax ? cartData.subtotalAmountExclTax : 0)
7906                        },
7907                        subtotalIncludingTax: {
7908                            value: parseFloat(cartData.subtotalAmount ? cartData.subtotalAmount : 0)
7909                        }
7910                    },
7911                    items: contextCartItems,
7912                    possibleOnepageCheckout: cartData.possible_onepage_checkout,
7913                    giftMessageSelected : false,
7914                    giftWrappingSelected : false
7915                });
7916
7917                window.dispatchEvent(new Event("shoppingCartContextSet"));
7918            }
7919        }
7920    }
7921</script>
7921
7922<div
7923     x-data="dataServicesShoppingCartContextData()"
7924     @private-content-loaded.window="initContext($event.detail.data.cart)"></div>
7925<script async="1" src="https&#x3A;&#x2F;&#x2F;helloretailcdn.com&#x2F;helloretail.js">/*Hello Retail*/</script>
7925<script type="text&#x2F;javascript">(function() {
7926        function init() {
7927            window.hrq = window.hrq || [];
7928            hrq.push(["init", []]);
7929            
7930            var xhr = new XMLHttpRequest();
7931            xhr.open("GET", "https://www.aveve.be/fr/rest/V1/awext/state");
7932            xhr.setRequestHeader("Accept", "application/json");
7933            xhr.onreadystatechange = function () {
7934                if (xhr.readyState === 4 && xhr.status == "200") {
7935                     try {
7936                        var data = JSON.parse(xhr.responseText);
7937                        data = data[0];
7938                        if (data.cart) {
7939                            hrq.push(["setCart", data.cart]);
7940                        }
7941                        if (data.order && data.order.total) {
7942                            hrq.push(["trackConversion", data.order]);
7943                        }
7944                    } catch(e) {
7945                        ADDWISH_PARTNER_NS.log("error parsing state", e);
7946                    }
7947                }
7948            };
7949            xhr.send();
7950        }
7951        init();
7952    })()</script>
7952<script>
7953    window.addEventListener("pageshow", (event) => {
7954        if (event.persisted) {
7955            window.dispatchEvent(new Event('reload-customer-section-data'));
7956            window.dispatchEvent(new Event('bfcache-reset'));
7957        }
7958    });
7959</script>
7959
7960
vendor: 2,348 bytes, lines 7961-8020
7961<script>
7962    (() => {
7963        function src_default(Alpine) {
7964            Alpine.directive("intersect", Alpine.skipDuringClone((el, { value, expression, modifiers }, { evaluateLater, cleanup }) => {
7965                let evaluate = evaluateLater(expression);
7966                let options = {
7967                    rootMargin: getRootMargin(modifiers),
7968                    threshold: getThreshold(modifiers)
7969                };
7970                let observer = new IntersectionObserver((entries) => {
7971                    entries.forEach((entry) => {
7972                        if (entry.isIntersecting === (value === "leave"))
7973                            return;
7974                        evaluate();
7975                        modifiers.includes("once") && observer.disconnect();
7976                    });
7977                }, options);
7978                observer.observe(el);
7979                cleanup(() => {
7980                    observer.disconnect();
7981                });
7982            }));
7983        }
7984        function getThreshold(modifiers) {
7985            if (modifiers.includes("full"))
7986                return 0.99;
7987            if (modifiers.includes("half"))
7988                return 0.5;
7989            if (!modifiers.includes("threshold"))
7990                return 0;
7991            let threshold = modifiers[modifiers.indexOf("threshold") + 1];
7992            if (threshold === "100")
7993                return 1;
7994            if (threshold === "0")
7995                return 0;
7996            return Number(`.${threshold}`);
7997        }
7998        function getLengthValue(rawValue) {
7999            let match = rawValue.match(/^(-?[0-9]+)(px|%)?$/);
8000            return match ? match[1] + (match[2] || "px") : void 0;
8001        }
8002        function getRootMargin(modifiers) {
8003            const key = "margin";
8004            const fallback = "0px 0px 0px 0px";
8005            const index = modifiers.indexOf(key);
8006            if (index === -1)
8007                return fallback;
8008            let values = [];
8009            for (let i = 1; i < 5; i++) {
8010                values.push(getLengthValue(modifiers[index + i] || ""));
8011            }
8012            values = values.filter((v) => v !== void 0);
8013            return values.length ? values.join(" ").trim() : fallback;
8014        }
8015
8016        document.addEventListener("alpine:init", () => {
8017            window.Alpine.plugin(src_default);
8018        });
8019    })();
8020</script>
vendor: 1 bytes, line 8020
8020
8021<script>
8022    for (const [selector, deferUntil] of Object.entries({".product-slider section[x-data]":"intersect","#filters-content [x-data]":"intersect","#review_form":"intersect","section[x-data^=initRecentlyViewedProductsComponent]":"intersect","div[x-data^=initBundleOptions]":"intersect","#notice-cookie-block":"intersect"})) {
8023        document.querySelectorAll(selector).forEach(el => el.setAttribute('x-defer', `${deferUntil}`));
8024    }
8025</script>
vendor: 1 bytes, line 8025
8025
8026<script>
8027    (function () {
8028        "use strict";
8029
8030        const hasAlpine = new Promise(resolve => {
8031            window.addEventListener('alpine:initialized', resolve, {once: true, passive: true});
8032        });
8033
8034        const hasInteract = new Promise(resolve => {
8035            (events => {
8036                const onInteract = () => {
8037                    resolve();
8038                    events.forEach(type => window.removeEventListener(type, onInteract));
8039                }
8040                events.forEach(type => window.addEventListener(type, onInteract, {once: true, passive: true}))
8041            })(['touchstart', 'mouseover', 'wheel', 'scroll', 'keydown'])
8042        });
8043
8044        const onIntersect = (el) => {
8045            return new Promise(resolve => {
8046                const observer = new IntersectionObserver(entries => {
8047                    for (const entry of entries) {
8048                        if (entry.isIntersecting) {
8049                            observer.disconnect()
8050                            resolve();
8051                        }
8052                    }
8053                }, {});
8054                observer.observe(el);
8055            });
8056        }
8057
8058        function runComponent(el) {
8059            hasAlpine.then(() => {
8060                el.removeAttribute('x-ignore');
8061                queueMicrotask(() => Alpine.initTree(el));
8062            });
8063        }
8064
8065        function initDeferredComponents() {
8066            document.querySelectorAll('[x-data][x-defer]').forEach(el => {
8067                el.setAttribute('x-ignore', '');
8068                const deferUntil = (el.getAttribute('x-defer') || '').trim();
8069                switch (deferUntil) {
8070                    case 'interact':
8071                        hasInteract.then(() => runComponent(el));
8072                        break;
8073                    case 'intersect':
8074                        onIntersect(el).then(() => runComponent(el))
8075                        break;
8076                    case 'idle':
8077                        window.requestIdleCallback
8078                            ? window.requestIdleCallback(() => runComponent(el), {timeout: 4000})
8079                            : setTimeout(() => runComponent(el), 4000);
8080                        break;
8081                    case 'eager':
8082                        runComponent(el);
8083                        break;
8084                    default:
8085                        if (deferUntil.startsWith('event:') && deferUntil.length > 6) {
8086                            window.addEventListener(deferUntil.substring(6), () => runComponent(el), {once: true, passive: true});
8087                        }
8088                }
8089            });
8090        }
8091
8092        window.addEventListener('alpine:init', initDeferredComponents, {once: true, passive: true});
8093    })()
8094</script>
8094
8095
8096<script type="module"
8097        src="https://www.aveve.be/static/version1790001289/frontend/Arvesta/Hyva/fr_BE/Hyva_Theme/js/alpine3.min.js"
8098        defer
8099        crossorigin
8100></script>
vendor: 1 bytes, line 8100
8100
8101<script>
8102    'use strict';
8103    function dispatchMessages(messages, hideAfter) {
8104        const messagesEvent = new CustomEvent("messages-loaded", {
8105            detail: {
8106                messages: messages,
8107                hideAfter: hideAfter
8108            }
8109        });
8110        window.dispatchEvent(messagesEvent);
8111    }
8112
8113    if (typeof hyva === 'undefined' || (!hyva.getBrowserStorage || !hyva.getCookie || !hyva.setCookie)) {
8114        console.warn("Hyvä helpers are not loaded yet. Make sure they are included before this script");
8115    }
8116
8117    (function( hyva, undefined ) {
8118
8119        hyva.initFormKey = () => {
8120            const inputSelector = 'input[name="form_key"]',
8121                formKey = hyva.getFormKey();
8122
8123            Array.from(document.querySelectorAll(inputSelector)).map(function (input) {
8124                input.value = formKey
8125            });
8126        }
8127
8128        hyva.initMessages = () => {
8129            try {
8130                const messages = hyva.getCookie('mage-messages');
8131                window.mageMessages = messages ? JSON.parse(decodeURIComponent(messages).replace(/\+/g, ' ')) : [];
8132
8133                dispatchMessages(window.mageMessages);
8134
8135                                // empty `mage-messages` cookie
8136                const skipSetDomain = true;
8137                hyva.setCookie('mage-messages','', -1, skipSetDomain);
8138
8139            } catch (error) {
8140                console.warn('Error parsing Cookie Messages:', error);
8141            }
8142        }
8143
8144        window.addEventListener('DOMContentLoaded', hyva.initFormKey);
8145        hyva.alpineInitialized(hyva.initMessages)
8146
8147    }( window.hyva = window.hyva || {} ));
8148</script>
vendor: 1 bytes, line 8148
8148
8149<script>
8150    'use strict';
8151    {
8152        const private_content_key = 'mage-cache-storage';
8153        const private_content_expire_key = 'mage-cache-timeout';
8154        const private_content_version_key = 'private_content_version';
8155        const section_data_ids_key = 'section_data_ids';
8156        const mage_cache_session_id_key = 'mage-cache-sessid';
8157        const last_visited_store_key = 'last_visited_store';
8158
8159        const ttl = 3600;
8160
8161        if (typeof hyva === 'undefined' || (!hyva.getBrowserStorage || !hyva.getCookie || !hyva.setCookie)) {
8162            console.warn("Hyvä helpers are not loaded yet. Make sure they are included before this script");
8163        }
8164
8165        function loadSectionData () {
8166            const browserStorage = hyva.getBrowserStorage();
8167            if (!browserStorage) {
8168                typeof window.dispatchMessages !== "undefined" && window.dispatchMessages(
8169                    [{
8170                        type: "warning",
8171                        text: "Please enable LocalStorage in your browser."
8172                    }]
8173                );
8174                return;
8175            }
8176            try {
8177                let isInvalid = false;
8178
8179                if (hyva.getCookie(last_visited_store_key) !== CURRENT_STORE_CODE) {
8180                    isInvalid = true;
8181                }
8182                hyva.setCookie(last_visited_store_key, CURRENT_STORE_CODE, false, false);
8183
8184                if (!hyva.getCookie(mage_cache_session_id_key)) {
8185                    isInvalid = true;
8186                    browserStorage.removeItem(private_content_key);
8187                    const skipSetDomain = true;
8188                    const days = false;
8189                    hyva.setCookie(mage_cache_session_id_key, true, days, skipSetDomain)
8190                }
8191
8192                const cookieVersion = hyva.getCookie(private_content_version_key);
8193                const storageVersion = browserStorage.getItem(private_content_version_key);
8194
8195                if (cookieVersion && !storageVersion || cookieVersion !== storageVersion) {
8196                    isInvalid = true;
8197                }
8198
8199                const privateContentExpires = browserStorage.getItem(private_content_expire_key);
8200                if (privateContentExpires && new Date(privateContentExpires) < new Date()) {
8201                    browserStorage.removeItem(private_content_key);
8202                }
8203
8204                if (isInvalid && cookieVersion) {
8205                    fetchPrivateContent([]);
8206                } else if (cookieVersion && storageVersion && cookieVersion === storageVersion) {
8207                    const privateContent = JSON.parse(browserStorage.getItem(private_content_key));
8208                    if (
8209                        privateContent &&
8210                        privateContentExpires &&
8211                        privateContent.cart &&
8212                        privateContent.customer
8213                    ) {
8214                        dispatchPrivateContent(privateContent);
8215                    } else {
8216                        fetchPrivateContent([]);
8217                    }
8218                } else {
8219                    if (document.getElementById('default-section-data')) {
8220                        const privateContent = JSON.parse(document.getElementById('default-section-data').innerText.trim());
8221                        dispatchPrivateContent(privateContent);
8222                    } else {
8223                        dispatchPrivateContent({});
8224                    }
8225                }
8226
8227            } catch (error) {
8228                console.warn('Error retrieving Private Content:', error);
8229            }
8230        }
8231
8232        hyva.alpineInitialized(loadSectionData)
8233        window.addEventListener('reload-customer-section-data', loadSectionData);
8234
8235        window.processSectionDataBeforeDispatch = window.processSectionDataBeforeDispatch || (data => data);
8236
8237        function dispatchPrivateContent(data) {
8238
8239            const privateContentEvent = new CustomEvent("private-content-loaded", {
8240                detail: {
8241                    data: window.processSectionDataBeforeDispatch(data)
8242                }
8243            });
8244            window.dispatchEvent(privateContentEvent);
8245        }
8246
8247        function fetchPrivateContent(sections) {
8248            fetch(`${BASE_URL}customer/section/load/?sections=${encodeURIComponent(sections.join(','))}`, {
8249                method: 'GET',
8250                headers: {
8251                    'Content-Type': 'application/json',
8252                    'X-Requested-With': 'XMLHttpRequest'
8253                }
8254            })
8255                .then(response => response.ok && response.json())
8256                .then(
8257                    data => {
8258                        if (data) {
8259                            try {
8260                                const browserStorage = hyva.getBrowserStorage();
8261
8262                                // merge new data preserving non-invalidated sections
8263                                const oldSectionData = JSON.parse(browserStorage.getItem(private_content_key) || '{}') || {};
8264
8265                                if ((! data.cart || ! data.cart.cartId) && oldSectionData['checkout-data']) {
8266                                    delete oldSectionData['checkout-data'];
8267                                }
8268                                const newSectionData = Object.assign(oldSectionData, data);
8269
8270                                dispatchPrivateContent(newSectionData);
8271
8272                                // don't persist messages, they've been dispatched already
8273                                if (newSectionData.messages && newSectionData.messages.messages ) {
8274                                    newSectionData.messages.messages = [];
8275                                }
8276
8277                                browserStorage.setItem(private_content_key, JSON.stringify(newSectionData));
8278
8279                                const expiresAt = new Date(Date.now() + (ttl * 1000)).toISOString();
8280                                browserStorage.setItem(private_content_expire_key, expiresAt);
8281
8282                                const newCookieVersion = hyva.getCookie(private_content_version_key);
8283                                browserStorage.setItem(private_content_version_key, newCookieVersion);
8284
8285                                // We don't need the section_data_ids in Hyvä, but we store them for compatibility
8286                                // with Luma Fallback. Otherwise, not all sections are loaded in Luma Checkout
8287                                hyva.setCookie(
8288                                    section_data_ids_key,
8289                                    JSON.stringify(
8290                                        Object.keys(data).reduce((sectionDataIds, sectionKey) => {
8291                                            sectionDataIds[sectionKey] = data[sectionKey]['data_id'];
8292                                            return sectionDataIds;
8293                                        }, {})
8294                                    ),
8295                                    false,
8296                                    true
8297                                );
8298                            } catch (error) {
8299                                console.warn("Couldn't store privateContent", error);
8300                            }
8301                        }
8302                    }
8303                );
8304        }
8305    }
8306</script>
vendor: 1 bytes, line 8306
8306
8307<script>
8308    (() => {
8309        document.addEventListener('submit', event => event.target.action = event.target.action.replace('%25uenc%25', hyva.getUenc()));
8310    })()
8311</script>
vendor: 1 bytes, line 8311
8311
8312<script>
8313    (events => {
8314        const dispatchUserInteractionEvent = () => {
8315            events.forEach(type => window.removeEventListener(type, dispatchUserInteractionEvent))
8316            window.dispatchEvent(new Event('init-external-scripts'))
8317        };
8318        events.forEach(type => window.addEventListener(type, dispatchUserInteractionEvent, {once: true, passive: true}))
8319    })(['touchstart', 'mousemove', 'wheel', 'scroll', 'keydown'])
8320</script>
vendor: 1 bytes, line 8320
8320
8321<script>
8322    function initConfigurableOptions(productId, optionConfig) {
8323
8324        function findPathParam(key) {
8325                        const baseUrl = (BASE_URL.substr(0, 2) === '//' ? 'http:' : '') + BASE_URL;
8326            const baseUrlParts = (new URL(baseUrl)).pathname.replace(/\/$/, '').split('/');
8327            const pathParts = window.location.pathname.split('/').slice(baseUrlParts.length + 3);
8328            for (let i = 0; i < pathParts.length; i += 2) {
8329                if (pathParts[i] === key && pathParts.length > i) {
8330                    return pathParts[i + 1];
8331                }
8332            }
8333        }
8334
8335        return {
8336            optionConfig,
8337            productId,
8338            itemId: (new URLSearchParams(window.location.search)).get('id') || findPathParam('id'),
8339            allowedAttributeOptions: [],
8340            additionalTabAttributes: [],
8341            additionalTableAttributes: [],
8342            additionalWarningAttributes: [],
8343            selectedValues: [],
8344            bulletAttributes: [],
8345            dropShipping: [],
8346            simpleProductNameAlt: '',
8347            init() {
8348                this.findAllowedAttributeOptions();
8349                this.$nextTick(() => {
8350                    if (typeof this.optionConfig.defaultValues === 'object') {
8351                        for (const [optionId, value] of Object.entries(this.optionConfig.defaultValues)) {
8352                            this.changeOption(optionId, value + '');
8353                        }
8354                    }
8355                });
8356
8357                window.addEventListener('get-selected-variant-product-id', () => {
8358                    this.$dispatch('selected-variant-product-id', {id: this.productIndex});
8359                });
8360            },
8361            findSimpleIndex() {
8362                                this.productIndex = this.calculateSimpleIndexForPartialSelection(this.selectedValues);
8363            },
8364            calculateSimpleIndexForPartialSelection(selectedValues) {
8365                let productIndexIds = Object.keys(this.optionConfig.index);
8366                Object.keys(this.optionConfig.attributes).forEach((attribute) => {
8367                                        const productsWithAttributeMatch = selectedValues[attribute]
8368                        ? productIndexIds.filter((productIndex) => {
8369                            return this.optionConfig.index[productIndex][attribute] === this.selectedValues[attribute]
8370                        })
8371                        : [];
8372
8373                                        productIndexIds = productsWithAttributeMatch.length ? productsWithAttributeMatch : productIndexIds
8374                })
8375                return productIndexIds[0];
8376            },
8377            calculateSimpleIndexForFullSelection(selectedValues) {
8378                const productIndexes = this.optionConfig.index;
8379                return Object.keys(productIndexes).find(productIndex => {
8380                    const productCandidateOptions = productIndexes[productIndex];
8381
8382                    for (const productOption in productCandidateOptions) {
8383                        if (
8384                            ! selectedValues[productOption] ||
8385                            selectedValues[productOption] !== productCandidateOptions[productOption]
8386                        ) {
8387                            return false;
8388                        }
8389                    }
8390                    return productIndex;
8391                });
8392            },
8393            productIndex: 0,
8394            findAllowedAttributeOptions() {
8395                                this.allowedAttributeOptions = this.calculateAllowedAttributeOptions(this.selectedValues);
8396            },
8397            calculateAllowedAttributeOptions(selectedValues) {
8398                const allAttributes = this.optionConfig.attributes;
8399                const allAttributesSorted = Object.values(allAttributes).sort((a,b) => {
8400                    return a.position - b.position
8401                });
8402                const productIndexes = this.optionConfig.index;
8403                let previousOption = false;
8404                let availableIndexes = Object.keys(productIndexes);
8405
8406                const newAllowedAttributeOptions = [];
8407
8408                allAttributesSorted.forEach(attribute => {
8409                    if (previousOption && selectedValues[previousOption]) {
8410                        availableIndexes = availableIndexes.filter(availableIndex => {
8411                            return productIndexes[availableIndex][previousOption] ===
8412                                selectedValues[previousOption]
8413                        })
8414                    }
8415                    newAllowedAttributeOptions[attribute.id] =
8416                        allAttributes[attribute.id].options.filter(option => {
8417                            return !!option.products.find(product => {
8418                                return availableIndexes.includes(product);
8419                            })
8420                        });
8421                    previousOption = attribute.id;
8422                });
8423                return newAllowedAttributeOptions;
8424            },
8425            findAttributeByOptionId(optionId) {
8426                for (const attributeId in this.optionConfig.attributes) {
8427                    const attributeOptions = this.optionConfig.attributes[attributeId].options || [];
8428                    if (attributeOptions.find(option => option.id === optionId)) {
8429                        return attributeId;
8430                    }
8431                }
8432            },
8433            getAllowedAttributeOptions(attributeId) {
8434                return this.allowedAttributeOptions[attributeId] || []
8435            },
8436            findAdditionalTabAttributes() {
8437                this.additionalTabAttributes = this.optionConfig.tab_additional_attributes[this.productIndex] || [];
8438            },
8439            findAdditionalTableAttributes() {
8440                this.additionalTableAttributes = this.optionConfig.table_additional_attributes[this.productIndex] || [];
8441            },
8442            findAdditionalWarningAttributes() {
8443                this.additionalWarningAttributes = this.optionConfig.warning_additional_attributes[this.productIndex] || [];
8444            },
8445            findBulletAttributes() {
8446                this.bulletAttributes = this.optionConfig.bullet_attributes[this.productIndex] || [];
8447            },
8448            findDropShippingVariables() {
8449                this.dropShipping = this.optionConfig.drop_shipping[this.productIndex] || {};
8450            },
8451            findSimpleProductName() {
8452                this.simpleProductNameAlt = this.optionConfig.simple_product_name_alt[this.productIndex];
8453            },
8454            getProductIdsForOption(option) {
8455                const attributeId = this.findAttributeByOptionId(option.id);
8456                const allOptions = this.optionConfig.attributes[attributeId];
8457                const opt = (allOptions && allOptions.options || []).find(o => o.id === option.id);
8458                return opt && opt.products
8459                    ? opt.products
8460                    : [];
8461            },
8462            findCheapestProductForPartialSelection(optionSelection) {
8463                const candidateProducts = this.findProductIdsForPartialSelection(optionSelection);
8464                return candidateProducts.reduce((cheapest, simpleIdx) => {
8465                    // in the first iteration we start with simpleIdx as the currently cheapest product
8466                    if (! this.optionConfig.optionPrices[cheapest]) return simpleIdx;
8467                    const knownCheapestPrice = this.optionConfig.optionPrices[cheapest].finalPrice.amount;
8468                    return knownCheapestPrice > this.optionConfig.optionPrices[simpleIdx].finalPrice.amount
8469                        ? simpleIdx
8470                        : cheapest;
8471                }, 0)
8472            },
8473            findProductIdsForPartialSelection(optionSelection) {
8474                const candidateProducts = Object.values(optionSelection).reduce((candidates, optionId) => {
8475                    const newCandidates = this.getProductIdsForOption({id: optionId});
8476                    return candidates === null
8477                        ? newCandidates
8478                        : candidates.filter(productId => newCandidates.includes(productId));
8479                }, null);
8480                return candidateProducts || [];
8481            },
8482            findProductIdToUseForOptionPrice(option) {
8483                                const attributeId = this.findAttributeByOptionId(option.id);
8484                const optionSelection = Object.assign({}, this.selectedValues, {[attributeId]: option.id});
8485                const matchingSimpleIndex = this.calculateSimpleIndexForFullSelection(optionSelection);
8486                                return matchingSimpleIndex || this.findCheapestProductForPartialSelection(optionSelection);
8487            },
8488            getAttributeOptionLabel(option) {
8489                const optionProduct = this.findProductIdToUseForOptionPrice(option);
8490                if ((! optionProduct) || (optionProduct === this.productIndex)) {
8491                    return option.label;
8492                }
8493
8494                const currentPrice = this.getOptionPriceAdjustmentBasePrice();
8495
8496                if (this.optionConfig.optionPrices[optionProduct]) {
8497                    const optionPrice = this.optionConfig.optionPrices[optionProduct].finalPrice.amount;
8498                    if (optionPrice !== currentPrice){
8499                        return option.label + ' ' + hyva.formatPrice(optionPrice - currentPrice, true);
8500                    }
8501                }
8502                return option.label;
8503            },
8504            getOptionPriceAdjustmentBasePrice() {
8505                if (this.optionConfig.optionPrices[this.productIndex]) {
8506                    return this.optionConfig.optionPrices[this.productIndex].finalPrice.amount
8507                }
8508                const cheapestForSelection = this.findCheapestProductForPartialSelection(this.selectedValues);
8509                return this.optionConfig.optionPrices[cheapestForSelection]
8510                    ? this.optionConfig.optionPrices[cheapestForSelection].finalPrice.amount
8511                    : this.optionConfig.prices.finalPrice.amount;             },
8512            changeOption(optionId, value) {
8513                this.selectedValues[optionId] = value;
8514                this.findSimpleIndex();
8515                this.findAllowedAttributeOptions();
8516                this.findAdditionalTabAttributes();
8517                this.findAdditionalTableAttributes();
8518                this.findAdditionalWarningAttributes();
8519                this.findBulletAttributes();
8520                this.findDropShippingVariables()
8521                this.updatePrices();
8522                this.findSimpleProductName();
8523                this.updateGallery();
8524                                this.updateSaleable(optionId, value);
8525                this.updateSalableVisible(optionId, value);
8526                this.setOptionsToUrl(optionId, value);
8527                                window.dispatchEvent(
8528                    new CustomEvent(
8529                        'configurable-selection-changed',
8530                        {
8531                            detail: {
8532                                productId: this.productId,
8533                                optionId: this.optionId,
8534                                value: this.value,
8535                                productIndex: this.productIndex,
8536                                selectedValues: this.selectedValues,
8537                                tabAttributes: this.additionalTabAttributes,
8538                                tableAttributes: this.additionalTableAttributes,
8539                                warningAttributes: this.additionalWarningAttributes,
8540                                bulletAttributes: this.bulletAttributes,
8541                                dropShipping: this.dropShipping,
8542                            }
8543                        }
8544                    )
8545                );
8546            },
8547                                    setOptionsToUrl(optionId, value) {
8548                const url = new URL(document.URL);
8549                const search = url.search.substring(1);
8550                let codes = Object.values(this.optionConfig.attributes).filter(attribute => parseInt(attribute.id) === parseInt(optionId)).map(attribute => attribute.code);
8551                                if (codes.length === 0) {
8552                    return;
8553                }
8554                const code = codes[0];
8555
8556                if (search) {
8557                    const optionsList = search.split('&');
8558                    let newParams = [];
8559                    let isOption = false;
8560
8561                    optionsList.forEach(function (opt) {
8562                        if (opt.split('=')[0] === code) {
8563                            if (value) {
8564                                newParams.push(`${code}=${value}`)
8565                                isOption = true;
8566                            }
8567                        } else {
8568                            newParams.push(opt)
8569                        }
8570                    });
8571
8572                    if (!isOption && value) {
8573                        newParams.push(`${code}=${value}`)
8574                    }
8575
8576                    url.search = newParams.join('&')
8577                } else {
8578                    if (value) {
8579                        url.search = `${code}=${value}`
8580                    }
8581                }
8582
8583                if (window.history.pushState) {
8584                    window.history.pushState({path: url.href}, '', url.href);
8585                }
8586            },
8587            updateSaleable(optionId, value) {
8588                if (this.optionConfig.salable[optionId] === undefined ||
8589                    this.optionConfig.salable[optionId][value] === undefined) {
8590                    window.dispatchEvent(new CustomEvent(
8591                            "item-saleability",
8592                            {detail: false}
8593                        )
8594                    );
8595                    return;
8596                }
8597                window.dispatchEvent(
8598                    new CustomEvent(
8599                        "item-saleability",
8600                        {detail: this.optionConfig.salable[optionId][value].includes(this.productIndex)}
8601                    )
8602                );
8603            },
8604            updateSalableVisible(optionId, value) {
8605                if (this.optionConfig.addtocart_visible[optionId] === undefined ||
8606                    this.optionConfig.addtocart_visible[optionId][value] === undefined) {
8607                    window.dispatchEvent(new CustomEvent(
8608                            "item-visible-only",
8609                            {detail: false}
8610                        )
8611                    );
8612                    return;
8613                }
8614                window.dispatchEvent(
8615                    new CustomEvent(
8616                        "item-visible-only",
8617                        {detail: this.optionConfig.addtocart_visible[optionId][value].includes(this.productIndex)}
8618                    )
8619                );
8620            },
8621                        calculateIsMinimalPrice() {
8622                return (
8623                    this.selectedValues.filter(value => !!value).length <
8624                        Object.keys(this.optionConfig.attributes).length
8625                );
8626            },
8627            updatePrices() {
8628                const value = this.productIndex ?
8629                    this.optionConfig.optionPrices[this.productIndex] :
8630                    this.optionConfig.prices;
8631                window.dispatchEvent(
8632                    new CustomEvent(
8633                        "update-prices-" + this.productId,
8634                        {
8635                            detail: Object.assign(
8636                                value,
8637                                { isMinimalPrice: this.calculateIsMinimalPrice() }
8638                            )
8639                        }
8640                    )
8641                );
8642            },
8643            updateGallery () {
8644                const images = this.productIndex ?
8645                    this.optionConfig.images[this.productIndex] :
8646                    Object.values(this.optionConfig.images)[0];
8647
8648                images && window.dispatchEvent(
8649                    new CustomEvent(
8650                        "update-gallery",
8651                        {detail: this.sortImagesByPosition(images)}
8652                    )
8653                );
8654
8655                images && this.simpleProductNameAlt && window.dispatchEvent(
8656                    new CustomEvent(
8657                        'update-simple-name',
8658                        {detail: this.simpleProductNameAlt}
8659                    )
8660                );
8661            },
8662            sortImagesByPosition(images) {
8663                return images.sort((x, y) => {
8664                    return x.position === y.position ? 0 : (parseInt(x.position) > parseInt(y.position) ? 1 : -1)
8665                });
8666            },
8667            onGetCartData(data) {
8668                this.preselectCartItems(data);
8669                this.preselectQuerystringItems();
8670                this.preselectLocationHashItems();
8671                this.preselectCheapestValue();
8672                this.preselectFirstValue();
8673            },
8674            preselectFirstValue() {
8675                for (var i in this.optionConfig.attributes) {
8676                    if (this.selectedValues[this.optionConfig.attributes[i].id] === undefined) {
8677                        this.changeOption(this.optionConfig.attributes[i].id, this.optionConfig.attributes[i].options[0].id);
8678                    }
8679                }
8680            },
8681            preselectCartItems(data) {
8682                                const cart = data && data.cart;
8683                if (cart && cart.items) {
8684                    const cartItem = cart.items.find((item) => {
8685                        return (
8686                            item.item_id === this.itemId
8687                            && item.product_id === this.productId
8688                        )
8689                    });
8690                    if (cartItem && cartItem.options && cartItem.options.length) {
8691                        cartItem.options.map(option => {
8692                            this.changeOption(option.option_id, option.option_value);
8693                        })
8694                    }
8695                }
8696            },
8697            preselectQuerystringItems() {
8698                                const urlQueryParams = new URLSearchParams(window.location.search.replace('?',''));
8699                Object.values(this.optionConfig.attributes).map(attribute => {
8700                    urlQueryParams.get(attribute.code) &&
8701                    this.changeOption(attribute.id, urlQueryParams.get(attribute.code));
8702                });
8703            },
8704            preselectLocationHashItems() {
8705                                const urlHashParams = new URLSearchParams(window.location.hash.replace('#',''));
8706                Object.values(this.optionConfig.attributes).map(attribute => {
8707                    urlHashParams.get(attribute.id) &&
8708                    this.changeOption(attribute.id, urlHashParams.get(attribute.id));
8709                });
8710            },
8711            preselectCheapestValue() {
8712                const cheapestProductId = this.getCheapestProductId();
8713                for (var i in this.optionConfig.attributes) {
8714                    if (this.selectedValues[this.optionConfig.attributes[i].id] === undefined) {
8715                        const option = this.getOptionForProduct(this.optionConfig.attributes[i], cheapestProductId);
8716                        this.changeOption(this.optionConfig.attributes[i].id, option.id);
8717                    }
8718                }
8719            },
8720            getCheapestProductId() {
8721                let cheapestProductId = null;
8722                for (var id in this.optionConfig.optionPrices) {
8723                    if (null === cheapestProductId || this.optionConfig.optionPrices[cheapestProductId].finalPrice.amount > this.optionConfig.optionPrices[id].finalPrice.amount) {
8724                        cheapestProductId = id;
8725                    }
8726                }
8727
8728                return cheapestProductId;
8729            },
8730            getOptionForProduct(attribute, productId) {
8731                for (var i in attribute.options) {
8732                    if (this.getProductIdsForOption(attribute.options[i]).includes(productId)) {
8733                        return attribute.options[i];
8734                    }
8735                }
8736
8737                return attribute.options[0];
8738            }
8739        }
8740    }
8741
8742</script>
8742
8743<!-- Account type: 'Google Tag Manager' is not supported  -->
8744
8745<script defer>
8746    function initAjaxProductAddToCart(event) {
8747        if (event) {
8748            let data = event.detail;
8749            window.dispatchEvent(new CustomEvent('add-to-cart-load-' + data.product + '-start'));
8750            data.postData['keep_success_message'] = true
8751            fetch(data.action, {
8752                headers: {
8753                    'content-type': 'application/x-www-form-urlencoded; charset=UTF-8',
8754                },
8755                body: new URLSearchParams(data.postData),
8756                method: 'POST',
8757                mode: 'cors',
8758                credentials: 'include'
8759            }).then((response) => {
8760                window.dispatchEvent(new CustomEvent("reload-customer-section-data"));
8761                if (response.ok) {
8762                    window.dispatchEvent(new CustomEvent('reload-cart-content'));
8763                }
8764            }).catch(error => {
8765                dispatchMessages([{type: 'error', text: error}])
8766            }).finally(() => {
8767                window.dispatchEvent(new CustomEvent('add-to-cart-load-' + data.product + '-stop'));
8768            });
8769        }
8770    }
8771    window.addEventListener("product_add_to_cart", initAjaxProductAddToCart);
8772</script>
8772
8773
8774<script>
8775    'use strict';
8776
8777    (function () {
8778        const modals = [];
8779        const excludedFromFocusTrapping = new Set();
8780
8781        function trapFocusInNextModalWithOverlay() {
8782            for (let idx = modals.length -1; idx >= 0; idx--) {
8783                const nextOnStack = modals[idx];
8784                const nextDialogElement = nextOnStack.instance.$refs[nextOnStack.name];
8785                if (! isOverlayDisabled(nextDialogElement)) {
8786                    hyva.trapFocus(nextDialogElement);
8787                    break;
8788                }
8789            }
8790        }
8791
8792        function focusables(dialogElement) {
8793            const selector = 'button, [href], input, textarea, select, details, [tabindex]:not([tabindex="-1"])';
8794            return Array.from(dialogElement.querySelectorAll(selector))
8795                .filter(el => !el.hasAttribute('disabled'));
8796        }
8797
8798        function firstVisible(elements) {
8799            const a = Array.from(elements);
8800            for (let i = 0; i < a.length; i++) {
8801                if (a[i].offsetWidth || a[i].offsetHeight || a[i].getClientRects().length) return a[i];
8802            }
8803            return null;
8804        }
8805
8806        function isInViewport(element) {
8807            const rect = element && element.getBoundingClientRect();
8808            return rect &&
8809                rect.top >= 0 &&
8810                rect.left >= 0 &&
8811                rect.right <= window.innerWidth &&
8812                rect.bottom <= window.innerHeight;
8813        }
8814
8815        function setFocusAfterTransition(dialogElement, duration) {
8816                        const nested = Array.from(dialogElement.querySelectorAll('[role="dialog"]'));
8817            const candidates = Array.from(dialogElement.querySelectorAll('[x-focus-first]'));
8818            next: for (let candidate of candidates) {
8819                for (let child of nested) {
8820                    if (child.contains(candidate)) continue next;
8821                }
8822                setTimeout(() => candidate.focus(), 50);
8823                break;
8824            }
8825            window.setTimeout(() => {
8826                const focusElement = firstVisible(dialogElement.querySelectorAll('[x-focus-first]')) ||
8827                    focusables(dialogElement)[0] ||
8828                    null;
8829                focusElement && isInViewport(focusElement) && focusElement.focus();
8830            }, Math.max(1, duration));
8831        }
8832
8833        function determineTrigger($refs, dialog, trigger) {
8834                        if (typeof trigger === 'undefined' && typeof dialog === 'object' && dialog.target instanceof HTMLElement) {
8835                return dialog.target;
8836            }
8837                        if (typeof dialog === 'string' && typeof trigger === 'object' && trigger.target instanceof HTMLElement) {
8838                return trigger.target;
8839            }
8840                        if (typeof trigger === 'string') {
8841                try {
8842                    return $refs[trigger] || document.querySelector(trigger)
8843                } catch (e) {}
8844            }
8845                        if (trigger instanceof Element) {
8846                return trigger;
8847            }
8848
8849                        return null;
8850        }
8851
8852        function isOverlayDisabled(dialog) {
8853            return dialog && dialog.hasAttribute('x-no-overlay')
8854        }
8855
8856        function areRemainingModalsWithoutOverlay(modals)
8857        {
8858            const overflowDisabled = modals.map(modal => modal.instance.$refs[modal.name]).filter(isOverlayDisabled);
8859
8860            return overflowDisabled.length === modals.length;
8861        }
8862
8863        window.hyva.modal = function(options = {}) {
8864                        if (this.$el && this.$el.dataset && this.$el.dataset.options) {
8865                try {
8866                    options = Object.assign(options, JSON.parse(this.$el.dataset.options || '{}'));
8867                } catch (e) {
8868                    throw new Error('Cannot read the dialog options from the data-options attribute: not valid JSON');
8869                }
8870            }
8871
8872            const config = Object.assign({
8873                dialog: 'dialog',                 duration: 300,                 transitionEnter: 'transition ease-out duration-300',
8874                transitionEnterStart: 'opacity-0',
8875                transitionEnterEnd: 'opacity-100',
8876                transitionLeave: 'transition ease-in duration-300',
8877                transitionLeaveStart: 'opacity-100',
8878                transitionLeaveEnd: 'opacity-0',
8879            }, options);
8880            let lastHide = 0;
8881
8882            return {
8883                opened: {},
8884                show(dialog, trigger) {
8885                    const focusTargetAfterHide = determineTrigger(this.$refs, dialog, trigger);
8886                    const name = typeof dialog === 'string' ? dialog : config.dialog;
8887                    const dialogElement = this.$refs[name];
8888                    if (! dialogElement) {
8889                                                return;
8890                    }
8891                    const useOverlay = ! dialogElement.hasAttribute('x-no-overlay');
8892
8893                    dialogElement.scrollTop = 0;
8894
8895                                        if (this.opened[name]) {
8896                        return;
8897                    }
8898
8899                    if (focusTargetAfterHide) {
8900                        focusTargetAfterHide.setAttribute('aria-expanded', 'true');
8901                    }
8902
8903                    this.opened[name] = true;
8904                    useOverlay && this.$nextTick(() => hyva.trapFocus(dialogElement));
8905                    setFocusAfterTransition(dialogElement, config.duration);
8906
8907                    const frame = {name, instance: this, focusTarget: focu
8907sTargetAfterHide, time: Date.now()};
8908
8909                    modals.push(frame);
8910                    if (useOverlay) {
8911                        document.body.classList.add('overflow-hidden');
8912                    }
8913                    return new Promise(resolve => frame.resolve = resolve);
8914                },
8915                cancel() {
8916                    this.hide(false);
8917                },
8918                ok() {
8919                    this.hide(true);
8920                },
8921                hide(value) {
8922                                        if (Date.now() - lastHide < config.duration) {
8923                        return;
8924                    }
8925                    lastHide = Date.now();
8926
8927                    const modal = modals.pop() || {};
8928                    if (! modal.instance) {
8929                        return;
8930                    }
8931
8932                    const name = modal.name;
8933                    this.opened[name] = false;
8934                    hyva.releaseFocus(modal.instance.$refs[modal.name])
8935                    trapFocusInNextModalWithOverlay();
8936
8937                    const nextFocusAfterHide = modal.focusTarget;
8938                    nextFocusAfterHide && setTimeout(() => {
8939                        nextFocusAfterHide.setAttribute('aria-expanded', 'false');
8940                        nextFocusAfterHide.focus()
8941                    }, config.duration);
8942
8943                    if (modals.length === 0 || areRemainingModalsWithoutOverlay(modals)) {
8944                        document.body.classList.remove('overflow-hidden');
8945                    }
8946
8947                    modal.resolve(value);
8948                },
8949                overlay(dialog) {
8950                    dialog = this.$el.dataset.dialogRefName || dialog;
8951                    const name = typeof dialog === 'string' ? dialog : config.dialog;
8952                    return {
8953                        ['x-show']() {
8954                            return this.opened[name]
8955                        },
8956                        ['x-transition:enter']: config.transitionEnter,
8957                        ['x-transition:enter-start']: config.transitionEnterStart,
8958                        ['x-transition:enter-end']: config.transitionEnterEnd,
8959                        ['x-transition:leave']: config.transitionLeave,
8960                        ['x-transition:leave-start']: config.transitionLeaveStart,
8961                        ['x-transition:leave-end']: config.transitionLeaveEnd,
8962                        ['@hyva-modal-show.window'](event) {
8963                            event.detail && event.detail.dialog === name && this.show(name, event.detail.focusAfterHide)
8964                        }
8965                    };
8966                },
8967                showDialogOnInit() {
8968                    const parent = this.$el.closest('[data-dialog-ref-name]');
8969                    if (parent && parent.dataset.dialogRefName) {
8970                        this.$dispatch('hyva-modal-show', {dialog: parent.dataset.dialogRefName})
8971                    }
8972                }
8973            };
8974        }
8975
8976        window.hyva.modal.peek = () => modals.length > 0 && modals[modals.length -1]
8977
8978        window.hyva.modal.pop = function () {
8979            if (modals.length > 0) {
8980                const modal = modals[modals.length -1];
8981                modal.instance.hide();
8982            }
8983        }
8984
8985        window.hyva.modal.excludeSelectorsFromFocusTrap = function (selectors) {
8986            typeof selectors === 'string' || selectors instanceof String
8987                ? excludedFromFocusTrapping.add(selectors)
8988                : selectors.map(selector => excludedFromFocusTrapping.add(selector));
8989        }
8990
8991        window.hyva.modal.eventListeners = {
8992            keydown: event => {
8993                if (event.key === 'Escape') {
8994                    window.hyva.modal.pop();
8995                }
8996            },
8997                        click: event => {
8998                if (modals.length > 0) {
8999                    const modal = modals[modals.length -1];
9000                    const dialog = modal.instance.$refs[modal.name];
9001                    if (modal.time + 50 < Date.now() && // if last click processing is more than 50ms ago
9002                        ! isOverlayDisabled(dialog) && // if dialog has overlay
9003                        ! dialog.contains(event.target)) { // if click is outside of dialog
9004                        modal.instance.hide();
9005                    }
9006                }
9007            }
9008        };
9009
9010        document.addEventListener('keydown', window.hyva.modal.eventListeners.keydown);
9011
9012        document.addEventListener('click', window.hyva.modal.eventListeners.click);
9013    })();
9014    window.addEventListener('alpine:init', () => {
9015        Alpine.data('hyvaModal', window.hyva.modal);
9016    }, {once: true});
9017</script>
9017
9018
9019<script defer>
9020    function promotionPopup() {
9021        return {
9022            title: 'Conditions\u0020promotionnelles',
9023            showPromotionPopup: false,
9024            startDate: false,
9025            endDate: false,
9026            position: false,
9027            init() {
9028                this.showPromotionPopup = false;
9029                this.startDate = false;
9030                this.endDate = false;
9031                this.position = false;
9032                this.title = 'Conditions\u0020promotionnelles';
9033            },
9034            showPopup(startDate, endDate, position, title) {
9035                this.startDate = startDate;
9036                this.endDate = endDate;
9037                this.position = position;
9038                this.showPromotionPopup = true;
9039
9040                if (typeof title === 'string' || title instanceof String){
9041                    this.title = title;
9042                }
9043            },
9044            hidePopup() {
9045                this.init();
9046                window.dispatchEvent(new CustomEvent('hide-promotion-popup'));
9047            },
9048        }
9049    }
9050</script>
9050
9051
9052<div x-cloak
9053     x-defer="interact"
9054     x-data="promotionPopup()"
9055     x-show="showPromotionPopup"
9056     @show-promotion-popup.window="showPopup($event.detail.startDate,$event.detail.endDate,$event.detail.position, $event.detail?.title);"
9057     @keydown.escape.window="hidePopup()" class="mx-auto bg-gray-100 flex items-center justify-center">
9058    <section class="flex flex-wrap items-center">
9059        <div class="overflow-auto" style="background-color: rgba(0,0,0,0.5)" x-show="showPromotionPopup"
9060             :class="{ 'fixed inset-0 z-50 flex items-center justify-center': 'hidden' }">
9061            <div class="lg:w-[650px] relative bg-white w-11/12 mx-auto rounded shadow-lg py-12 text-left px-16"
9062                 x-show="showPromotionPopup"
9063                 @click.outside="hidePopup()"
9064                 x-transition:enter="ease-out duration-300"
9065                 x-transition:enter-start="opacity-0 scale-90"
9066                 x-transition:enter-end="opacity-100 scale-100">
9067                <div class="absolute right-5 top-5 cursor-pointer z-50" @click="hidePopup()">
9068                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" class="icon" width="18" height="18" aria-hidden="true"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M312.1 375c9.369 9.369 9.369 24.57 0 33.94s-24.57 9.369-33.94 0L160 289.9l-119 119c-9.369 9.369-24.57 9.369-33.94 0s-9.369-24.57 0-33.94L126.1 256L7.027 136.1c-9.369-9.369-9.369-24.57 0-33.94s24.57-9.369 33.94 0L160 222.1l119-119c9.369-9.369 24.57-9.369 33.94 0s9.369 24.57 0 33.94L193.9 256L312.1 375z"/></svg>
9069                </div>
9070
9071                <template x-if="title !== null && title !== ''">
9072                    <div class="flex justify-center items-center pb-3">
9073                        <p class="text-h4 text-center font-bold" x-text="title"></p>
9074                    </div>
9075                </template>
9076
9077                <template x-if="startDate && endDate">
9078                    <p class="text-center pb-3">
9079                        Promotion valable du                        <span class="font-semibold" x-text="startDate"></span>
9080                        jusqu&#039;à                        <span class="font-semibold" x-text="endDate + '.'"></span>
9081                    </p>
9082                </template>
9083
9084                <p class="text-center">
9085                    <span x-show="position.web1" x-html="position.web1"></span>
9086                    <span x-show="position.web2" x-html="position.web2"></span>
9087                </p>
9088            </div>
9089        </div>
9090    </section>
9091</div>
9092
9093
9094
9095<script>
9096    window.addEventListener('load', function () {
9097        if(typeof magentoStorefrontEvents === 'undefined' || !magentoStorefrontEvents) return;
9098
9099        magentoStorefrontEvents.context.setPage({
9100            pageType: "Cart"
9101        });
9102        magentoStorefrontEvents.context.setContext("pageExtended", {
9103            action: "cart-view"
9104        });
9105
9106            });
9107    window.addEventListener('shoppingCartContextSet', function () {
9108        magentoStorefrontEvents.publish.shoppingCartView();
9109    });
9110</script>
9110
9111
9112<script>
9113    function adobeProductRecsDataFetcher() {
9114        "use strict";
9115        return {
9116            pagePreconfiguredDeferred: {},
9117            productBanners: '',
9118            fetchData: function () {
9119                let self = this;
9120                let storefrontEvents = window.magentoStorefrontEvents;
9121
9122                storefrontEvents.context.setContext("recsContext", {
9123                    alternateEnvironmentId: ""
9124                });
9125
9126                this.pagePreconfiguredDeferred = new Promise((resolve, reject) => {
9127                    self.pagePreconfiguredDeferred.resolve = resolve;
9128                    self.pagePreconfiguredDeferred.reject = reject;
9129                })
9130
9131                document.addEventListener("recsRequestSent", (function () {
9132                    storefrontEvents.publish.recsRequestSent();
9133                }));
9134
9135                window.addEventListener("recsResponseReceived", (function (n) {
9136                    let rec = storefrontEvents.context.getRecommendations();
9137
9138                    rec = n.detail, storefrontEvents.context.setRecommendations({
9139                        units: rec
9140                    });
9141                    storefrontEvents.publish.recsResponseReceived();
9142                }));
9143
9144                this.fetchRecommendationsData();
9145            },
9146            fetchRecommendationsData: function () {
9147                let client;
9148                let promise = new Promise(function(resolve, reject) {
9149                    let interval = setInterval(() => {
9150                        client = new RecommendationsClient();
9151                        if(client._environmentId !== "") {
9152                            clearInterval(interval);
9153                            resolve();
9154                        }
9155                    }, 300);
9156                })
9157                .then(() => {
9158                    document.dispatchEvent(new Event("recsRequestSent"));
9159                    client.fetchPreconfigured().then(response => {
9160                        const units = response.data.results;
9161                        const filteredUnits = units.filter(unit => unit.products.length);
9162                        const responseEvent = new CustomEvent("recsResponseReceived", {
9163                            detail: filteredUnits,
9164                        });
9165
9166                        window.dispatchEvent(responseEvent);
9167                    });
9168                });
9169            }
9170        }
9171    }
9172</script>
9172
9173<div x-data="adobeProductRecsDataFetcher()" x-init="fetchData()"></div>
9174
9175<script type="text/json" id="default-section-data">
9176    {"messages":[],"customer":[],"compare-products":[],"last-ordered-items":[],"cart":[],"directory-data":{"BE":{"name":"Belgique","regions":{"1839":{"code":"VAN","name":"Antwerpen"},"1842":{"code":"WBR","name":"Brabant wallon"},"1845":{"code":"BRU","name":"Brussels-Capital Region"},"1848":{"code":"WHT","name":"Hainaut"},"1854":{"code":"WLG","name":"Li\u00e8ge"},"1851":{"code":"VLI","name":"Limburg"},"1857":{"code":"WLX","name":"Luxembourg"},"1860":{"code":"WNA","name":"Namur"},"1863":{"code":"VOV","name":"Oost-Vlaanderen"},"1866":{"code":"VBR","name":"Vlaams-Brabant"},"1869":{"code":"VWV","name":"West-Vlaanderen"}}},"data_id":1790245773},"captcha":[],"wishlist":{"items":[]},"instant-purchase":[],"multiplewishlist":[],"persistent":[],"review":[],"hyva_checkout":[],"gtm-checkout":[],"recently_viewed_product":[],"recently_compared_product":[],"product_data_storage":[]}</script>
9176
9177</div>
9177<script nonce="dHd5Ym43cmJtcGdsZ2JnbW9nMWkwd2Zra2tyY3QwYXc=">
9178    yireoGoogleTagManager2Pusher({"version":"3.9.18","page_type":"checkout\/cart\/index","page_path":"https:\/\/www.aveve.be\/fr\/checkout\/cart\/index\/","page_title":"Shopping Cart","virtual_page":"\/fr\/checkout\/cart\/index","breadcrumb":[],"user":{"has_transacted":false}}, 'push (initial page) [data-layer.phtml]');
9179        yireoGoogleTagManager2Pusher([], 'push (page-based event) [data-layer.phtml]');
9180    </script>
vendor: 1 bytes, line 9180
9180
9181<script nonce="dHd5Ym43cmJtcGdsZ2JnbW9nMWkwd2Zra2tyY3QwYXc=">
9182    function yireoGoogleTagManager2FindParentElementWithName(element, parentTagName) {
9183        if (!element.parentElement) {
9184            return null;
9185        }
9186
9187        if (element.parentElement.tagName.toLowerCase() === parentTagName) {
9188            return element.parentElement;
9189        }
9190
9191        return yireoGoogleTagManager2FindParentElementWithName(element.parentElement, parentTagName);
9192    }
9193
9194    const products = document.querySelectorAll('.products a.product');
9195    if (products && products.length > 0) {
9196        products.forEach(function(product) {
9197            product.addEventListener('click', function(event, s) {
9198                let parentElement = yireoGoogleTagManager2FindParentElementWithName(event.target, 'form');
9199                const inputElement = parentElement.querySelector('input[name="product"]');
9200                const productId = inputElement.value;
9201                const productData = window['YIREO_GOOGLETAGMANAGER2_PRODUCT_DATA_ID_' + productId] || {};
9202                productData.item_id = productId;
9203
9204                const eventData = {
9205                    'event': 'select_item',
9206                    'ecommerce': {
9207                        'items': [productData]
9208                    }
9209                }
9210
9211                yireoGoogleTagManager2Pusher(eventData, 'push (page event "select_item") [script-product-clicks.phtml]');
9212
9213                if (window['YIREO_GOOGLETAGMANAGER2_DEBUG_CLICKS'] && confirm("Press to continue with redirect") === false) {
9214                    event.preventDefault();
9215                }
9216            });
9217        })
9218    }
9219</script>
vendor: 1 bytes, line 9219
9219
9220<script nonce="dHd5Ym43cmJtcGdsZ2JnbW9nMWkwd2Zra2tyY3QwYXc=">
9221    window.addEventListener('private-content-loaded', function(event) {
9222        window.dataLayer = window.dataLayer || [];
9223
9224        var isEmpty = function (variable) {
9225            if (typeof variable === 'undefined') {
9226                return true;
9227            }
9228
9229            if (Array.isArray(variable) && variable.length === 0) {
9230                return true;
9231            }
9232
9233            return typeof variable === 'object' && Object.keys(variable).length === 0;
9234        }
9235
9236        var getSectionNames = function () {
9237            return ['cart', 'customer'];
9238        }
9239
9240        getSectionNames().forEach(function (sectionName) {
9241            if (!event.detail.data[sectionName].gtm) {
9242                return;
9243            }
9244
9245            const attributes = event.detail.data[sectionName].gtm;
9246            if (!Object.keys(attributes).length > 0) {
9247                return;
9248            }
9249
9250            yireoGoogleTagManager2Pusher(attributes, 'push (attributes) [script-additions.phtml]');
9251        });
9252
9253        let attributes = {};
9254        getSectionNames().forEach(function (sectionName) {
9255            if (!event.detail.data[sectionName].gtm_events) {
9256                return;
9257            }
9258
9259            const gtmEvents = event.detail.data[sectionName].gtm_events;
9260            for (const [eventId, eventData] of Object.entries(gtmEvents)) {
9261                yireoGoogleTagManager2Logger('found event in section "' + sectionName + '"', eventData);
9262
9263                const metaData = eventData.meta;
9264                yireoGoogleTagManager2Pusher(eventData, 'push (customerData "' + sectionName + '"  event "' + eventId + '")');
9265
9266                if (!metaData || metaData.cacheable !== true) {
9267                    yireoGoogleTagManager2Logger('removing event "' + eventId + '" from section "' + sectionName + '"')
9268
9269                    let mageCacheStorage = event.detail.data;
9270
9271                    if (mageCacheStorage !== null
9272                        && typeof mageCacheStorage[sectionName] !== 'undefined'
9273                        && typeof mageCacheStorage[sectionName].gtm_events !== 'undefined'
9274                        && eventId in mageCacheStorage[sectionName].gtm_events) {
9275                        delete mageCacheStorage[sectionName].gtm_events[eventId];
9276                    }
9277
9278                    window.localStorage.setItem('mage-cache-storage', JSON.stringify(mageCacheStorage));
9279                }
9280            }
9281        });
9282
9283        if (false === isEmpty(attributes)) {
9284            yireoGoogleTagManager2Pusher(attributes, 'dataLayer (initial js) [script-additions.phtml]');
9285        }
9286    });
9287</script>
9287
9288</body>
9289</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.