{% extends 'layouts/authenticated.html.twig' %}

{% block page_title %}Tableau de bord{% endblock %}

{% block content %}
<div class="space-y-6">
    <div class="bg-gradient-to-r from-indigo-600 to-purple-600 rounded-lg shadow-lg p-6 text-white">
        <h1 class="text-2xl font-bold">Dashboard Employeur</h1>
        <p class="mt-2">{{ app.user.fullName ?: app.user.email }}</p>
    </div>

    {# Section Modules accessibles #}
    <div>
        <h2 class="text-lg font-semibold text-gray-900 mb-4">Mes modules</h2>
        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">

            {# Documents Boutique #}
            {% if is_granted('ROLE_COMPANY_DOC') %}
            <a href="{{ path('admin_companies_index') }}"
               class="group bg-white rounded-lg shadow hover:shadow-md border border-gray-200 hover:border-amber-300 transition-all duration-200 p-5 flex items-start gap-4">
                <div class="flex-shrink-0 w-11 h-11 rounded-lg bg-amber-100 text-amber-600 flex items-center justify-center group-hover:bg-amber-200 transition-colors">
                    <svg class="w-6 h-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" d="M6 4h12M6 4v16M6 4H5m13 0v16m0-16h1m-1 16H6m12 0h1M6 20H5M9 7h1v1H9V7Zm5 0h1v1h-1V7Zm-5 4h1v1H9v-1Zm5 0h1v1h-1v-1Zm-3 4h2a1 1 0 0 1 1 1v4h-4v-4a1 1 0 0 1 1-1Z"/>
                    </svg>
                </div>
                <div>
                    <h3 class="font-semibold text-gray-900 group-hover:text-amber-600 transition-colors">Documents Boutique</h3>
                    <p class="text-sm text-gray-500 mt-1">Documents et fichiers de la boutique</p>
                </div>
            </a>
            {% endif %}

        </div>
    </div>

</div>
{% endblock %}