{# @tailwind-safelist
   bg-primary/10 bg-cohorts/10 bg-warning/10 bg-error/10 bg-success/10 bg-info/10 bg-pink/10
   text-primary text-cohorts text-warning text-error text-success text-info text-pink
#}
{% extends 'base.html.twig' %}

{% block title %}Gestion des entreprises - Admin{% endblock %}

{% block body %}
<div class="max-w-[1400px] mx-auto">

    {# ================================================================
       HEADER
       ================================================================ #}
    <div class="flex flex-col lg:flex-row lg:items-center lg:justify-between gap-6 mb-8">
        {% include '_molecules/page-header/page-header.html.twig' with {
            title: 'Gestion des entreprises',
            subtitle: 'Consultez et gérez l\'ensemble des entreprises partenaires. Créez de nouvelles structures, configurez leurs accès Moodle et suivez leurs contrats.',
            icon: 'buildings',
            backHref: path('app_dashboard'),
            backLabel: 'Retour au dashboard'
        } only %}

        {% include '_atoms/button/button.html.twig' with {
            label: 'Nouvelle entreprise',
            variant: 'primary',
            size: 'lg',
            icon: 'plus',
            href: path('admin_company_new')
        } only %}
    </div>

    {# ================================================================
       FILTRES
       ================================================================ #}
    <div class="flex flex-wrap items-center gap-4 mb-8">
        {# Filtres par statut #}
        {% include '_molecules/filter-tabs/filter-tabs.html.twig' with {
            filters: [
                { id: 'all',      label: 'Toutes',    count: statusCounts.all,      href: path('admin_company_list', {sort: filters.sort, sam: filters.sam}) },
                { id: 'active',   label: 'Actives',   count: statusCounts.active,   href: path('admin_company_list', {status: 'active',   sort: filters.sort, sam: filters.sam}) },
                { id: 'inactive', label: 'Inactives', count: statusCounts.inactive, href: path('admin_company_list', {status: 'inactive', sort: filters.sort, sam: filters.sam}) }
            ],
            active: filters.status == '' ? 'all' : filters.status,
            name: 'status'
        } only %}

        {# Filtre SAM #}
        {% include '_molecules/filter-tabs/filter-tabs.html.twig' with {
            filters: [
                { id: 'yes', label: 'SAM activé',   count: statusCounts.sam_yes, href: path('admin_company_list', {status: filters.status, sort: filters.sort, sam: 'yes'}) },
                { id: 'no',  label: 'SAM désactivé', count: statusCounts.sam_no, href: path('admin_company_list', {status: filters.status, sort: filters.sort, sam: 'no'}) }
            ],
            active: filters.sam != '' ? filters.sam : '__none__',
            name: 'sam'
        } only %}

        {# Tri #}
        {% include '_molecules/filter-tabs/filter-tabs.html.twig' with {
            filters: [
                { id: 'name',      label: 'Nom',       href: path('admin_company_list', {status: filters.status, sort: 'name',      sam: filters.sam}) },
                { id: 'date_desc', label: 'Récentes',  href: path('admin_company_list', {status: filters.status, sort: 'date_desc', sam: filters.sam}) },
                { id: 'date_asc',  label: 'Anciennes', href: path('admin_company_list', {status: filters.status, sort: 'date_asc',  sam: filters.sam}) }
            ],
            active: filters.sort,
            name: 'sort'
        } only %}
    </div>

    {# ================================================================
       LISTE DES ENTREPRISES EN CARDS
       ================================================================ #}
    {% if companies|length > 0 %}
        <div class="grid grid-cols-1 md:grid-cols-2 xl:grid-cols-3 gap-6">
            {% for company in companies %}
                {% set data = companyData[company.id] ?? {hasActiveContract: false} %}

                <a href="{{ path('admin_company_show', {uuid: company.uuid}) }}"
                   data-turbo-preload="false"
                   class="group block bg-white rounded-2xl border border-gray-200 shadow-sm overflow-hidden transition-all duration-300 hover:-translate-y-1 hover:shadow-lg hover:border-primary/20 {{ not company.isActive ? 'opacity-60' : '' }}">

                    {# Header avec avatar et infos #}
                    <div class="p-6 pb-4">
                        <div class="flex items-start gap-4">
                            {# Avatar de l'entreprise #}
                            <div class="w-14 h-14 rounded-xl flex items-center justify-center text-lg font-bold shrink-0
                                        {{ company.isActive ? 'bg-gradient-to-br from-primary/20 to-primary/10 text-primary' : 'bg-gray-100 text-gray-400' }}">
                                {{ company.name|slice(0, 2)|upper }}
                            </div>

                            <div class="flex-1 min-w-0">
                                <h3 class="text-lg font-semibold text-gray-900 truncate group-hover:text-primary transition-colors">
                                    {{ company.name }}
                                </h3>
                                <div class="flex items-center gap-1.5 mt-1 text-sm text-gray-500">
                                    {% include '_atoms/icon/icon.html.twig' with { name: 'users', size: 'xs', color: 'gray' } only %}
                                    <span>{{ userCounts[company.id] ?? 0 }} utilisateur{{ (userCounts[company.id] ?? 0) > 1 ? 's' : '' }}</span>
                                </div>
                            </div>

                            {# Badge statut #}
                            {% if company.isActive %}
                                {% include '_atoms/badge/badge.html.twig' with {
                                    label: 'Active',
                                    variant: 'success',
                                    dot: true,
                                    size: 'sm'
                                } only %}
                            {% else %}
                                {% include '_atoms/badge/badge.html.twig' with {
                                    label: 'Inactive',
                                    variant: 'error',
                                    dot: true,
                                    size: 'sm'
                                } only %}
                            {% endif %}
                        </div>
                    </div>

                    {# Statut contrat #}
                    <div class="mx-6 mb-4 px-4 py-3 rounded-xl flex items-center gap-3
                                {{ data.hasActiveContract ? 'bg-success/5 border border-success/10' : 'bg-warning/5 border border-warning/10' }}">
                        {% if data.hasActiveContract %}
                            {% include '_atoms/icon/icon.html.twig' with { name: 'check-circle', size: 'md', color: 'success' } only %}
                            <span class="text-sm font-medium text-success">Contrat actif</span>
                        {% else %}
                            {% include '_atoms/icon/icon.html.twig' with { name: 'warning', size: 'md', color: 'warning' } only %}
                            <span class="text-sm font-medium text-warning">Sans contrat</span>
                        {% endif %}
                    </div>

                    {# Footer avec accès SAM #}
                    <div class="px-6 py-4 bg-gray-50/50 border-t border-gray-100">
                        {% include '_atoms/logo/logo-with-text.html.twig' with {
                            variant: 'sam',
                            showBadge: false,
                            size: 'sm',
                            disabled: not company.hasSamAccess
                        } %}
                    </div>
                </a>
            {% endfor %}
        </div>

        {# Pagination - Style Moodia #}
        {% if pagination.total > 1 %}
            <div class="mt-8">
                {% set paginationFilters = {} %}
                {% if filters.status %}{% set paginationFilters = paginationFilters|merge({status: filters.status}) %}{% endif %}
                {% if filters.sort %}{% set paginationFilters = paginationFilters|merge({sort: filters.sort}) %}{% endif %}
                {% include '_molecules/pagination/pagination.html.twig' with {
                    currentPage: pagination.current,
                    totalPages: pagination.total,
                    baseUrl: path('admin_company_list', paginationFilters),
                    variant: 'moodia'
                } only %}
            </div>
        {% endif %}
    {% else %}
        <div class="bg-white rounded-2xl border border-gray-200 shadow-sm p-12">
            {% include '_molecules/empty-state/empty-state.html.twig' with {
                title: 'Aucune entreprise',
                description: 'Commencez par créer votre première entreprise partenaire.',
                icon: 'buildings',
                variant: 'minimal',
                actions: [{
                    label: 'Créer une entreprise',
                    href: path('admin_company_new'),
                    variant: 'primary',
                    icon: 'plus'
                }]
            } only %}
        </div>
    {% endif %}
</div>
{% endblock %}