{# ---------------------------------------------------------------------
   Carte produit réutilisable — DA 2.0
   Usage : {{ include('accueil/_product_card_v2.html.twig', { product: p, slide: true }) }}
   - product : entité Produit
   - slide   : true pour ajouter la classe swiper-slide (carrousel)
   Première brique de consolidation (fin de la duplication home/listing).
   --------------------------------------------------------------------- #}
{% set isSold = product.statusBoutique.value == 'vendu' %}
{% set isExpo = product.statusBoutique.value == 'exposition' %}
{# Sous l'image : le modèle de couteau (Aurillac, Roquefort, Artisanal…) ou,
   à défaut de modèle, le type de produit (tire-bouchon, décapsuleur…). #}
{% set typeLabel = product.model ? product.model.getLibelle : (product.TypeProduit ? product.TypeProduit.label() : null) %}
{# Une pièce d'exposition n'est pas à vendre : son prix est à 0 en base et
   n'a rien à faire sur la carte. Même garde pour un prix non renseigné. #}
{% set showPrice = not isExpo and product.prixVente > 0 %}
{# detailRoute : route de la fiche produit — défaut 'app_produit' (home/standard),
   'app_produit' pour le funnel des pages neuves. Rétro-compatible. #}
{% set detailRoute = detailRoute|default('app_produit') %}
<article class="pcard{{ slide|default(false) ? ' swiper-slide' : '' }}" data-price="{{ product.prixVente }}" data-status="{{ product.statusBoutique.value }}">
    <a href="{{ path(detailRoute, { id: product.id }) }}" class="pcard-media" aria-label="{{ product.libelle }}">
        <div class="pcard-chip-slot">
            {% if isSold %}
                <span class="nhp-chip nhp-chip--vendu">Vendu</span>
            {% elseif isExpo %}
                <span class="nhp-chip nhp-chip--expo">Exposition</span>
            {% else %}
                <span class="nhp-chip nhp-chip--dispo">Disponible</span>
            {% endif %}
        </div>
        <img src="/assets/product/{{ product.id }}-1.jpg" alt="{{ product.libelle }}" loading="lazy"
             {% if file_exists('/assets/product/' ~ product.id ~ '-1-480.jpg') %}
             srcset="/assets/product/{{ product.id }}-1-480.jpg 480w, /assets/product/{{ product.id }}-1-960.jpg 960w, /assets/product/{{ product.id }}-1.jpg 2400w"
             sizes="(max-width: 640px) 45vw, (max-width: 1000px) 30vw, 300px"
             {% endif %}
             onerror="this.style.opacity=0.25;this.src='/assets/knife-illustration.webp';">
    </a>
    <div class="pcard-body">
        {% if typeLabel %}
            <span class="pcard-model">{{ typeLabel }}</span>
        {% endif %}
        <a href="{{ path(detailRoute, { id: product.id }) }}" class="pcard-title" title="{{ product.libelle }}">
            {{ product.libelle }}
        </a>
        <div class="pcard-foot">
            {% if showPrice %}
                <span class="pcard-price{{ isSold ? ' is-sold' : '' }}">{{ product.prixVente }}<span class="cur">€</span></span>
            {% endif %}
            {% if isSold %}
                <span class="nhp-chip nhp-chip--vendu">Vendu</span>
            {% elseif isExpo %}
                <span class="nhp-chip nhp-chip--expo">Expo</span>
            {% else %}
                <button type="button" class="pcard-add" onclick="addToCartAjax({{ product.id }})"
                        aria-label="Ajouter {{ product.libelle }} au panier" title="Ajouter au panier">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                        <circle cx="9" cy="20" r="1.5"/>
                        <circle cx="18" cy="20" r="1.5"/>
                        <path d="M2.5 3h2.2l2.2 11.1a1.6 1.6 0 0 0 1.6 1.3h8.9a1.6 1.6 0 0 0 1.57-1.26L21.5 7H6.2"/>
                    </svg>
                </button>
            {% endif %}
        </div>
    </div>
</article>