{% extends "_base.html" %}

{% block brand %}Art-DAG L1{% endblock %}

{% block nav_items %}
<nav class="flex items-center space-x-6">
    <a href="/runs" class="text-gray-300 hover:text-white {% if active_tab == 'runs' %}text-white font-medium{% endif %}">Runs{% if nav_counts and nav_counts.runs %} ({{ nav_counts.runs }}){% endif %}</a>
    <a href="/recipes" class="text-gray-300 hover:text-white {% if active_tab == 'recipes' %}text-white font-medium{% endif %}">Recipes{% if nav_counts and nav_counts.recipes %} ({{ nav_counts.recipes }}){% endif %}</a>
    <a href="/effects" class="text-gray-300 hover:text-white {% if active_tab == 'effects' %}text-white font-medium{% endif %}">Effects{% if nav_counts and nav_counts.effects %} ({{ nav_counts.effects }}){% endif %}</a>
    <a href="/media" class="text-gray-300 hover:text-white {% if active_tab == 'media' %}text-white font-medium{% endif %}">Media{% if nav_counts and nav_counts.media %} ({{ nav_counts.media }}){% endif %}</a>
    <a href="/storage" class="text-gray-300 hover:text-white {% if active_tab == 'storage' %}text-white font-medium{% endif %}">Storage{% if nav_counts and nav_counts.storage %} ({{ nav_counts.storage }}){% endif %}</a>
    <a href="/download/client" class="text-gray-300 hover:text-white" title="Download CLI client">Client</a>
</nav>
{% endblock %}

{% block nav_right %}
{% if user %}
<div class="flex items-center space-x-4">
    <span class="text-gray-400">{{ user.username }}</span>
    <a href="/auth/logout" class="text-gray-300 hover:text-white">Logout</a>
</div>
{% else %}
<a href="/login" class="text-gray-300 hover:text-white">Login</a>
{% endif %}
{% endblock %}