<div class="menu-outer menu-categories">
<nav class="container">
<div class="row">
<div class="col-1 col-sm-12 col-md-12 col-lg-12 align-self-center d-menu-col">
<!--Desktop Menu-->
<nav class="grid__item" id="AccessibleNav">
<ul id="siteNav" class="hidearrow">
{% for category in categories %}
{% set url = category.category.getDetailUrl({'rootCategory': null, 'document' : document}) %}
<li class="lvl1 parent category megamenu" id="category-{{ category.category.getId() }}">
<a href="{{ url }}">{{ category.category.title }}<i class="an an-angle-down-l"></i></a>
{% if category.children %}
<div class="megamenu style2" id="{{ category.category.getId() }}">
<div class="row">
<div class="lvl-1 col-md-3 col-lg-3">
<a href="#" class="site-nav lvl-1 menu-title text-center">{{ "navegation.brand" | trans }}</a>
<div class="menu-brand-logo align-items-center" id="brand-container-{{ category.category.getId() }}">
</div>
</div>
<div class="lvl-1 col-md-3 col-lg-3">
<a href="#" class="site-nav lvl-1 menu-title"></a>
<ul class="subLinks">
{% for subcategory in category.children %}
{% set subcategoryUrl = subcategory.category.getDetailUrl({'rootCategory': null, 'document' : document}) %}
<li class="lvl-2 children sub {% if loop.first %}active{% endif %}" id="category-{{ subcategory.category.getId() }}" onmouseover="showSubsubcategories({{ subcategory.category.getId() }});">
<a href="{{ subcategoryUrl }}" class="site-nav lvl-2 menu-title">{{ subcategory.category.title }}</a>
</li>
{% endfor %}
</ul>
</div>
<div class="lvl-1 col-md-3 col-lg-3">
<a href="#" class="site-nav lvl-1 menu-title"></a>
{% for subcategory in category.children %}
<ul class="subLinks subsubcategories-list subsubcategory-{{ subcategory.category.getId() }}" style="display: {% if loop.first %}block{% else %}none{% endif %};">
{% for subsubcategory in subcategory.children %}
{% set subsubcategoryUrl = subsubcategory.category.getDetailUrl({'rootCategory': null, 'document' : document}) %}
<li class="lvl-2 children" id="category-{{ subsubcategory.category.Id }}">
<a href="{{ subsubcategoryUrl }}" class="site-nav lvl-2 menu-title">{{ subsubcategory.category.title }}</a>
</li>
{% endfor %}
</ul>
{% endfor %}
</div>
<div class="lvl-1 col-md-3 col-lg-3 p-0 text-center align-items-center" id="featured-product-container-{{ category.category.getId() }}"></div>
</div>
</div>
{% endif %}
</li>
{% endfor %}
</ul>
</nav>
<!--End Desktop Menu-->
</div>
</div>
</nav>
</div>
<script>
let errorFeaturedProduct= '{{ 'navbar.product.error_translation' |trans}}'
let errorLoadingFeaturedProduct= '{{ 'navbar.product.error.loading_translation' |trans}}'
</script>