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

{# FreeThemeOne 'layout/header/header.html.twig' #}

{# ---------------- START: SET TEMPLATE VARS ---------------- #}

{# FreeThemeOne: Set theme variables #}
{% set ftHeaderLayoutType = theme_config('ft-header-layout-type') %}
{% set ftTopBarLayoutType = theme_config('ft-top-bar-layout-type') %}
{% set iconPack = theme_config('ft-icon-set') %}

{# ---------------- END: SET TEMPLATE VARS ---------------- #}

{# FreeThemeOne: Move 'Top bar' #}
{% block layout_top_bar %}
    {% if ftTopBarLayoutType == 'one' %}
        {# FreeThemeOne: Remove 'Top bar' as we add it above the header in 'layout/header.html.twig' #}

    {% else %}
        {# Default block #}
        {{ parent() }}

    {% endif %}
{% endblock %}


{# FreeThemeOne: Change order of header elements and add navigation toggle #}
{% block layout_header_navigation %}
    {% if ftHeaderLayoutType == 'one' %}
        <div class="row align-items-center header-row">
            {# FreeThemeOne: Add offcanvas navigation toggle in front the logo (previously in 'layout_header_actions') #}
            {{ block('layout_header_navigation_toggle') }}

            {# Default block #}
            {{ block('layout_header_logo') }}

            {# FreeThemeOne: Remove 'Search' as we add it in 'layout/header.html.twig' #}
            {# block 'layout_header_search' #}

            {# FreeThemeOne: Add 'Navbar' (previously in 'layout/header.html.twig') #}
            {% block ft_base_navigation %}
                <div class="col header-navigation-col">
                    <div class="nav-main">
                        {% block ft_base_navigation_inner %}
                            {% sw_include '@Storefront/storefront/layout/navbar/navbar.html.twig' with { header: header } %}
                        {% endblock %}
                    </div>
                </div>
            {% endblock %}

            {# Default block #}
            {{ block('layout_header_actions') }}
            {# > block 'layout_header_navigation_toggle' #}
            {# > block 'layout_header_search_toggle' #}
        </div>

    {% else %}
        {# Default block #}
        {{ parent() }}

    {% endif %}
{% endblock %}


{# FreeThemeOne: Adjust offcanvas navigation toggle #}
{% block layout_header_navigation_toggle %}
    {% if ftHeaderLayoutType == 'one' %}
        {# FreeThemeOne: Adjust classes #}
        {# previously 'col d-sm-none' #}
        <div class="col-auto d-xl-none header-menu-col">
            <div class="menu-button">
                {% block layout_header_navigation_toggle_button %}
                    <button 
                        class="btn nav-main-toggle-btn header-actions-btn"
                        type="button"
                        data-off-canvas-menu="true"
                        aria-label="{{ 'general.menuLink'|trans|striptags }}"
                    >
                        {% block layout_header_navigation_toggle_button_icon %}
                            {# FreeThemeOne: Adjust icon #}
                            {% if iconPack == "feather" %}
                                {% sw_icon 'menu' style { pack: iconPack } %}
                            {% else %}
                                {# Default icon #}
                                {% sw_icon 'stack' %}
                            {% endif %}

                            {# @TODO: Add 'x' icon... #}
                        {% endblock %}
                    </button>
                {% endblock %}
            </div>
        </div>

    {% else %}
        {# Default block #}
        {{ parent() }}

    {% endif %}
{% endblock %}


{# FreeThemeOne: Adjust header logo #}
{% block layout_header_logo %}
    {% if ftHeaderLayoutType == 'one' %}
        {# FreeThemeOne: Adjust classes #}
        {# previously 'col-12 col-lg-auto header-logo-col pb-sm-2 my-3 m-lg-0' #}
        <div class="col col-xl-auto header-logo-col">
            {% sw_include '@Storefront/storefront/layout/header/logo.html.twig' %}
        </div>

    {% else %}
        {# Default block #}
        {{ parent() }}

    {% endif %}
{% endblock %}


{# FreeThemeOne: Adjust header actions #}
{% block layout_header_actions %}
    {% if ftHeaderLayoutType == 'one' %}
        {# FreeThemeOne: Adjust classes #}
        {# previously 'col-12 order-1 col-sm-auto order-sm-2 header-actions-col' #}
        <div class="col-auto header-actions-col">
            <div class="row g-0">
                {# FreeThemeOne: Move offcanvas navigation toggle in front the logo #}
                {# block 'layout_header_navigation_toggle' #}

                {# Default block #}
                {{ block('layout_header_search_toggle') }}

                {# Default block #}
                {% if config('core.cart.wishlistEnabled') %}
                    {{ block('layout_header_actions_wishlist') }}
                {% endif %}

                {{ block('layout_header_actions_account') }}

                {{ block('layout_header_actions_cart') }}
            </div>
        </div>

    {% else %}
        {# Default block #}
        {{ parent() }}

    {% endif %}
{% endblock %}


{# FreeThemeOne: Adjust search toggle #}
{% block layout_header_search_toggle %}
    {% if ftHeaderLayoutType == 'one' %}
        {# FreeThemeOne: Adjust classes #}
        {# previously 'col-auto d-sm-none' #}
        <div class="col-auto">
            <div class="search-toggle">
                <button class="btn header-actions-btn search-toggle-btn js-search-toggle-btn collapsed"
                        type="button"
                        data-bs-toggle="collapse"
                        data-bs-target="#searchCollapse"
                        aria-expanded="false"
                        aria-controls="searchCollapse"
                        aria-label="{{ 'header.searchButton'|trans|striptags }}">
                    {# FreeThemeOne: Adjust icon #}
                    {% if iconPack == "feather" %}
                        {% sw_icon 'search' style { pack: iconPack } %}
                    {% else %}
                        {# Default icon #}
                        {% sw_icon 'search' %}
                    {% endif %}
                </button>
            </div>
        </div>

    {% else %}
        {# Default block #}
        {{ parent() }}

    {% endif %}
{% endblock %}