{% load static wise_icons %}
<div class="top-bar md:hidden">
    <div id="top_bar" class="flex items-center px-2 py-1.5">
        {% if user.is_authenticated %}
            <div class="pr-1">
                <div id="open_sidebar_icon" class="btn-icon border-transparent" onclick="openSideBar()">
                    {% lucide "menu" size=20 %}
                </div>
                <div id="close_sidebar_icon" class="btn-icon hidden border-transparent" onclick="closeSideBar()">
                    {% lucide "x" size=20 %}
                </div>
            </div>
        {% endif %}
        <div class="top-bar-logo">
            <a class="flex items-center gap-2 no-underline text-gray-900" href="{% url 'home' %}">
                {% block topbar_brand %}{{ project_name|default:"Wise" }}{% endblock %}
            </a>
        </div>
        <div class="ml-auto flex items-center gap-2 truncate text-sm text-gray-600">
            {% if request.user.is_authenticated %}
                {{ request.user.get_full_name }}
                {% include 'wise_core/components/_settings_toggle.html' %}
            {% endif %}
        </div>
    </div>
</div>