{#
 # ============================================================================
 # ORGANISM: COMPANY CARD
 # ============================================================================
 #
 # Carte d'entreprise avec avatar, infos, statut contrat et outils activés.
 # Utilisé dans l'interface d'administration.
 #
 # ============================================================================
 # COMPOSITION (Molécules et Atomes utilisés)
 # ============================================================================
 #
 # - _atoms/icon/icon.html.twig
 # - _atoms/badge/badge.html.twig
 #
 # ============================================================================
 # PARAMÈTRES
 # ============================================================================
 #
 # | Paramètre        | Type    | Défaut    | Description                     |
 # |------------------|---------|-----------|--------------------------------|
 # | name             | string  | (requis)  | Nom de l'entreprise            |
 # | href             | string  | (requis)  | URL vers la fiche              |
 # | isActive         | bool    | true      | Entreprise active              |
 # | usersCount       | number  | 0         | Nombre d'utilisateurs          |
 # | hasActiveContract| bool    | false     | Contrat actif                  |
 # | tools            | array   | []        | Codes outils activés           |
 # | allTools         | array   | []        | Liste de tous les outils       |
 # | class            | string  | ''        | Classes additionnelles         |
 #
 # ============================================================================
 # EXEMPLES D'UTILISATION
 # ============================================================================
 #
 # Carte entreprise:
 # {% include '_organisms/company-card/company-card.html.twig' with {
 #     name: 'Acme Corp',
 #     href: '/admin/company/abc123',
 #     isActive: true,
 #     usersCount: 12,
 #     hasActiveContract: true,
 #     tools: ['moodia', 'serenia'],
 #     allTools: [
 #         { code: 'moodia', name: 'Moodia' },
 #         { code: 'serenia', name: 'Serenia' },
 #         { code: 'slidia', name: 'Slidia' }
 #     ]
 # } %}
 #
 # ============================================================================
 #}

{# ============================================================================
   CONFIGURATION DES VALEURS PAR DÉFAUT
   ============================================================================ #}

{% set name = name ?? 'Entreprise' %}
{% set href = href ?? '#' %}
{% set isActive = isActive ?? true %}
{% set usersCount = usersCount ?? 0 %}
{% set hasActiveContract = hasActiveContract ?? false %}
{% set tools = tools ?? [] %}
{% set allTools = allTools ?? [] %}
{% set class = class ?? '' %}

{# Initiales de l'entreprise #}
{% set initials = name|slice(0, 2)|upper %}

{# ============================================================================
   CLASSES TAILWIND
   ============================================================================ #}

{% set containerClasses = [
    'block bg-white rounded-2xl border-2 transition-all duration-300',
    'hover:shadow-lg hover:-translate-y-1',
    isActive ? 'border-gray-100 hover:border-primary/30' : 'border-gray-200 opacity-75',
    'overflow-hidden',
    class
]|join(' ')|trim %}

{# ============================================================================
   RENDU HTML
   ============================================================================ #}

<a href="{{ href }}" class="{{ containerClasses }}">
    {# Header avec avatar et infos #}
    <div class="flex items-center gap-4 p-4">
        {# Avatar #}
        <div class="flex-shrink-0 w-14 h-14 rounded-xl flex items-center justify-center text-lg font-bold
            {{ isActive ? 'bg-gradient-to-br from-primary/20 to-primary/10 text-primary' : 'bg-gray-100 text-gray-400' }}">
            {{ initials }}
        </div>

        {# Infos entreprise #}
        <div class="flex-1 min-w-0">
            <h3 class="text-base font-semibold text-gray-900 truncate">
                {{ name }}
            </h3>
            <span class="inline-flex items-center gap-1.5 text-sm text-gray-500">
                {% include '_atoms/icon/icon.html.twig' with {
                    name: 'users',
                    size: 'sm',
                    color: 'muted'
                } only %}
                {{ usersCount }} utilisateur{{ usersCount > 1 ? 's' : '' }}
            </span>
        </div>

        {# Badge statut #}
        {% include '_atoms/badge/badge.html.twig' with {
            text: isActive ? 'Active' : 'Inactive',
            variant: isActive ? 'success' : 'muted',
            size: 'sm'
        } only %}
    </div>

    {# Statut contrat #}
    <div class="px-4 py-3 flex items-center gap-2 border-t border-gray-50
        {{ hasActiveContract ? 'bg-green-50' : 'bg-amber-50' }}">
        {% if hasActiveContract %}
            {% include '_atoms/icon/icon.html.twig' with {
                name: 'check-circle',
                size: 'md',
                color: 'success'
            } only %}
            <span class="text-sm font-medium text-green-700">Contrat actif</span>
        {% else %}
            {% include '_atoms/icon/icon.html.twig' with {
                name: 'alert',
                size: 'md',
                color: 'warning'
            } only %}
            <span class="text-sm font-medium text-amber-700">Sans contrat</span>
        {% endif %}
    </div>

    {# Footer avec outils #}
    {% if allTools|length > 0 %}
        <div class="px-4 py-3 flex items-center gap-2 border-t border-gray-100">
            {% for tool in allTools %}
                {% set isToolActive = tool.code in tools %}
                <span
                    class="w-8 h-8 rounded-lg flex items-center justify-center transition-all
                        {{ isToolActive ? 'bg-primary/10' : 'bg-gray-50 opacity-40' }}"
                    data-tooltip="{{ tool.name }}"
                >
                    {% include '_atoms/icon/icon.html.twig' with {
                        name: 'bubul-' ~ tool.code,
                        size: 'md',
                        color: isToolActive ? tool.code : 'muted'
                    } only %}
                </span>
            {% endfor %}
        </div>
    {% endif %}
</a>