{% load static %}
<div class="navbar bg-base-200">
    <div class="navbar-start">
        <!-- Mobile hamburger menu -->
        <div class="dropdown">
            <div tabindex="0" role="button" class="btn btn-ghost lg:hidden">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" fill="none"
                     viewBox="0 0 24 24" stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                          d="M4 6h16M4 12h8m-8 6h16" />
                </svg>
            </div>
            <ul tabindex="0"
                class="menu menu-sm dropdown-content bg-base-200 rounded-box z-10 mt-3 w-52 p-2 shadow">
                {% block nav_items_mobile %}
                {% block nav_items %}
                {% if user.is_authenticated %}
                <li><a href="{% url 'dashboard' %}">Dashboard</a></li>
                <li><a href="{% url 'library:library-list' %}">Libraries</a></li>
                <li><a href="{% url 'library:search' %}">Search</a></li>
                <li><a href="{% url 'llm_manager:dashboard' %}">LLM Manager</a></li>
                <li><a href="{% url 'themis:key-list' %}">API Keys</a></li>
                {% endif %}
                {% endblock %}
                {% endblock %}
            </ul>
        </div>

        <!-- App logo and name -->
        <a href="/" class="btn btn-ghost text-xl">
            {{ themis_app_name }}
        </a>
    </div>

    <!-- Desktop nav items -->
    <div class="navbar-center hidden lg:flex">
        <ul class="menu menu-horizontal px-1">
            {% block nav_items_desktop %}
            {% if user.is_authenticated %}
            <li><a href="{% url 'dashboard' %}">Dashboard</a></li>
            <li><a href="{% url 'library:library-list' %}">Libraries</a></li>
            <li><a href="{% url 'library:search' %}">Search</a></li>
            <li><a href="{% url 'llm_manager:dashboard' %}">LLM Manager</a></li>
            <li><a href="{% url 'themis:key-list' %}">API Keys</a></li>
            {% endif %}
            {% endblock %}
        </ul>
    </div>

    <!-- Right side: notifications + theme toggle + user menu -->
    <div class="navbar-end gap-2">
        {% include "themis/includes/theme_toggle.html" %}

        {% if user.is_authenticated %}
        {% include "themis/includes/notification_bell.html" %}
        {% include "themis/includes/user_menu.html" %}
        {% else %}
        <a href="{% url 'account_login' %}" class="btn btn-primary btn-sm">Log in</a>
        {% endif %}
    </div>
</div>
