{#
 # Barre de navigation secondaire Promptly
 #
 # Paramètres :
 #   activeTab  string  'library' | 'my-prompts'
 #}

{% set isLibrary   = activeTab == 'library' %}
{% set isMyPrompts = activeTab == 'my-prompts' %}

<div class="flex items-center justify-between bg-white rounded-2xl border border-gray-100 shadow-sm px-2 py-2 mb-8">

    {# Onglets #}
    <div class="flex items-center gap-1">
        <a href="{{ path('app_promptly') }}"
           class="flex items-center gap-2 px-4 py-2 rounded-xl text-[13px] font-semibold transition-all duration-150
                  {{ isLibrary ? 'bg-primary text-white shadow-sm' : 'text-gray-500 hover:text-gray-800 hover:bg-gray-50' }}">
            <span class="inline-flex items-center justify-center">
                {% include '_atoms/icon/icon.html.twig' with { name: 'book-open', size: 'sm', color: 'current' } only %}
            </span>
            Bibliothèque
        </a>
        <a href="{{ path('app_promptly_my_prompts') }}"
           class="flex items-center gap-2 px-4 py-2 rounded-xl text-[13px] font-semibold transition-all duration-150
                  {{ isMyPrompts ? 'bg-primary text-white shadow-sm' : 'text-gray-500 hover:text-gray-800 hover:bg-gray-50' }}">
            <span class="inline-flex items-center justify-center">
                {% include '_atoms/icon/icon.html.twig' with { name: 'folder', size: 'sm', color: 'current' } only %}
            </span>
            Mes prompts
        </a>
    </div>

    {# CTA principal — toujours visible #}
    {% include '_atoms/button/button.html.twig' with {
        label: 'Nouveau prompt',
        variant: 'primary',
        size: 'md',
        icon: 'plus',
        href: path('app_promptly_create_page')
    } only %}

</div>