{#
  INSTRUCTIONS : Dans templates/account/base.html.twig
  Ajouter ce bloc <li> dans la <ul class="sidebar-menu">,
  par exemple après "Mes commandes" (ligne ~34).

  ─────────────────────────────────────────────────────
  COMPTER les abonnements nécessitant une action
  (à placer AVANT le {% block body %}, ou en haut du bloc body)
  ─────────────────────────────────────────────────────
#}

{# ── À coller AVANT <div class="account-layout"> dans le {% block body %} ── #}
{% set sub_alerts = 0 %}
{% if app.user %}
    {% for commande in app.user.commandes ?? [] %}
        {% for b in commande.beneficiaires ?? [] %}
            {% set s = b.hebergementSubscription ?? null %}
            {% if s and not s.isFreeForever %}
                {% if s.status in ['expired', 'suspended'] %}
                    {% set sub_alerts = sub_alerts + 1 %}
                {% elseif s.expiresAt and s.expiresAt > date() and s.expiresAt.diff(date()).days <= 60 %}
                    {% set sub_alerts = sub_alerts + 1 %}
                {% endif %}
            {% endif %}
        {% endfor %}
    {% endfor %}
{% endif %}

{# ── Le <li> à insérer dans sidebar-menu, après "Mes commandes" ── #}
<li>
    <a href="{{ path('app_hebergement_list') }}"
       class="{{ app.request.attributes.get('_route') starts with 'app_hebergement' ? 'active' : '' }}"
       style="position:relative;">
        <span class="icon">📡</span>
        Abonnements
        {% if sub_alerts > 0 %}
            <span style="
                display:inline-flex;align-items:center;justify-content:center;
                min-width:18px;height:18px;
                background:#ef4444;color:#fff;
                border-radius:9px;font-size:.68rem;font-weight:700;
                padding:0 4px;margin-left:6px;
                animation:pulse 2s infinite;
            ">{{ sub_alerts }}</span>
        {% endif %}
    </a>
</li>

{# ── Style pour l'animation du badge (à ajouter dans le {% block stylesheets %}) ── #}
{#
<style>
@keyframes pulse {
    0%,100% { box-shadow: 0 0 0 0 rgba(239,68,68,.5); }
    50%      { box-shadow: 0 0 0 5px rgba(239,68,68,0); }
}
</style>
#}