{% load i18n %}

<!-- Account Links — rendered as dropdown menu items (parent handles open/close) -->
<div class="border-t border-base-200 dark:border-base-700 mt-1 pt-1">
    {% if user.username != "guest" %}
    <a 
        href="{% url 'admin:base_userprofile_changelist' %}" 
        target="_blank" 
        class="flex items-center gap-2.5 px-3 py-2 text-sm hover:bg-base-100 dark:hover:bg-base-700 transition-colors cursor-pointer"
        @click="openUserLinks = false"
    >
        <span class="material-symbols-outlined text-base-400 text-lg">person_outline</span>
        <span>{% translate 'User profile' %}</span>
    </a>
    {% endif %}
    
    {% if site_url %}
    <a 
        href="{{ site_url }}" 
        target="_blank" 
        class="flex items-center gap-2.5 px-3 py-2 text-sm hover:bg-base-100 dark:hover:bg-base-700 transition-colors cursor-pointer"
        @click="openUserLinks = false"
    >
        <span class="material-symbols-outlined text-base-400 text-lg">public</span>
        <span>{% translate 'View site' %}</span>
    </a>
    {% endif %}

    {% if account_links %}
        {% for link in account_links %}
            <a 
                href="{{ link.link }}" 
                class="flex items-center gap-2.5 px-3 py-2 text-sm hover:bg-base-100 dark:hover:bg-base-700 transition-colors cursor-pointer"
                @click="openUserLinks = false"
            >
                <span class="material-symbols-outlined text-base-400 text-lg">link</span>
                <span>{{ link.title }}</span>
            </a>
        {% endfor %}
    {% else %}
        {% if user.has_usable_password %}
            <a 
                href="{% url 'admin:password_change' %}" 
                class="flex items-center gap-2.5 px-3 py-2 text-sm hover:bg-base-100 dark:hover:bg-base-700 transition-colors cursor-pointer"
                @click="openUserLinks = false"
            >
                <span class="material-symbols-outlined text-base-400 text-lg">lock_reset</span>
                <span>{% translate 'Change password' %}</span>
            </a>
        {% endif %}
    {% endif %}

    <!-- Logout -->
    <div class="border-t border-base-200 dark:border-base-700 mt-1 pt-1">
        <form id="logout-form" method="post" action="{% url 'admin:logout' %}">
            {% csrf_token %}
            <button 
                type="submit" 
                class="flex items-center gap-2.5 px-3 py-2 text-sm cursor-pointer w-full text-left text-error hover:bg-error/10 transition-colors"
                onclick="document.cookie='skip_auto_guest=1; path=/; max-age=31536000';"
            >
                <span class="material-symbols-outlined text-lg">logout</span>
                <span>{% translate 'Log out' %}</span>
            </button>
        </form>
    </div>
</div>