{#
 # ============================================================================
 # ATOME : PLAN-BADGE
 # ============================================================================
 #
 # Pastille colorée + nom du plan + périodicité — le rendu déjà utilisé dans la
 # liste des utilisateurs de l'admin, extrait ici pour être partagé par les listes
 # de filleuls (espace commercial et fiche commercial admin) plutôt que recopié.
 #
 # ============================================================================
 # PARAMÈTRES
 # ============================================================================
 #
 # | Paramètre  | Type    | Défaut | Description                                  |
 # |------------|---------|--------|----------------------------------------------|
 # | name       | string  | null   | Nom affichable du plan (ex. « Starter »)     |
 # | gradient   | string  | null   | CSS du dégradé de la pastille                |
 # | isFree     | bool    | true   | Plan gratuit → rendu « Freemium »            |
 # | isAnnual   | bool    | false  | Périodicité affichée : « / an » ou « / mois »|
 # | isB2B      | bool    | false  | Compte rattaché à une entreprise → « B2B »   |
 #
 # ============================================================================
 # EXEMPLE
 # ============================================================================
 #
 # {% include '_atoms/plan-badge/plan-badge.html.twig' with {
 #     name: r.planName, gradient: r.planGradient,
 #     isFree: r.planIsFree, isAnnual: r.planIsAnnual
 # } only %}
 #
 # ============================================================================
 #}

{% set name = name ?? null %}
{% set gradient = gradient ?? null %}
{% set isFree = isFree ?? true %}
{% set isAnnual = isAnnual ?? false %}
{% set isB2B = isB2B ?? false %}

{% if isB2B %}
    <span class="text-sm text-gray-500">B2B</span>
{% elseif name and not isFree %}
    <span class="inline-flex items-center gap-1.5">
        <span class="w-2.5 h-2.5 rounded-full flex-shrink-0"
              style="background: {{ gradient ?? 'linear-gradient(135deg, #374151, #6b7280)' }}"></span>
        <span class="text-sm font-medium text-gray-900">{{ name }}</span>
        <span class="text-xs text-gray-400">{{ isAnnual ? '/ an' : '/ mois' }}</span>
    </span>
{% else %}
    <span class="text-xs text-gray-400">Freemium</span>
{% endif %}