{% sw_extends '@Storefront/storefront/layout/navigation/navigation.html.twig' %}

{% block layout_main_navigation_menu_flyout_wrapper %}

    {% if ssik.config.dropdown == 'liberty' %}
        <div class="ssik-main-menu-dropdowns" data-ssik-main-dropdowns="true">
            {% for treeItem in page.header.navigation.tree %}
                {% if treeItem.children|length > 0 %}
                    {% sw_include '@Storefront/storefront/ssik/navigation/dropdown.html.twig' with {
                        navigationTree: treeItem.children,
                        uid: treeItem.category.id
                    } only %}
                {% endif %}
            {% endfor %}
        </div>
    {% else %}
        {{parent()}}
    {% endif %}
{% endblock %}

{% block layout_main_navigation_menu %}
    <button class="btn nav-main-toggle-btn header-actions-btn"
        type="button"
        data-offcanvas-menu="true"
        aria-label="{{ "ssik.header.menu"|trans|striptags }}">
            {% sw_icon 'stack' %}
            <span class="text">{{ "ssik.header.menu"|trans|striptags }}</span>
    </button>
    {{parent()}}
{% endblock %}

{% block layout_main_navigation_menu_item %}
    <div class="ssik-menu-item{% if treeItem.children|length > 0 %} is-dropdown{% endif %}" 
        data-ssik-menu-id="{{ category.id }}" >
        {{parent()}}
    </div>
{% endblock %}

{% block layout_main_navigation_navbar %}
    {{parent()}}

    {% set remoteClickOptions = {
        selector: ".header-cart-btn.header-actions-btn",
        scrollToElement: true
    } %}

    <div class="header-cart-short js-cart-update"
            data-remote-click="true"
            data-header-floating-cart="true"
            data-remote-click-options='{{ remoteClickOptions|json_encode }}'>
        {% sw_icon 'icon-basket' style { 'pack':'custom', 'namespace': 'SsikLibertyTheme', 'class':'ssik md' } %}
    </div>
{% endblock %}