{% extends "base.html.twig" %}

{% block body %}
    {% set hasItems = cartSession.orderItems is not empty or groupedStageOrderItems is not empty %}

    {% if not hasItems %}
        <div class="cart-empty-wrapper text-center mt-20">
            <img src="{{ asset('img/front/cart/undraw_empty-cart_574u.svg') }}" alt="Panier vide" class="mx-auto w-40 h-40 mb-6" />
            <h2 class="text-2xl font-semibold text-gray-800">Votre panier est vide</h2>
            <p class="text-gray-500 mt-2">Ajoutez des articles pour les voir apparaître ici.</p>
            <a href="{{ path('app_home') }}" class="btn btn-primary mt-6">Retour à l'accueil</a>
        </div>
    {% else %}
        <div class="cart-layout container mx-auto py-10 px-4 grid grid-cols-1 lg:grid-cols-3 gap-10">
            {# COLONNE GAUCHE : Liste des articles #}
            <div class="lg:col-span-2 space-y-6">
                <div class="account-profil__header">
                    <div class="account-profil__title-group">
                        <h2 class="account-profil__title">Mon panier</h2>
                        <p class="account-profil__subtitle">
                            Retrouvez ici tous les éléments ajoutés avant le paiement.
                        </p>
                    </div>
                </div>

                {# Licences #}
                {% for orderItem in cartSession.orderItems|default([]) %}
                    <div class="cart-item">
                        <div class="cart-item__icon">
                            <img src="{{ asset('img/front/cart/licence-football.png') }}" alt="Licence football" class="w-10 h-10 object-contain" />
                        </div>
                        <div class="cart-item__content">
                            <p class="cart-item__title">{{ orderItem.profil.getFullName()|default('Nom Profil') }}</p>
                            <p class="cart-item__desc">Licence – {{ orderItem.type|default('Standard') }}</p>
                            {% if orderItem.categories|default([]) %}
                                <ul class="cart-item__details">
                                    {% for category in orderItem.categories %}
                                        <li>{{ category.name|default('Catégorie') }} - {{ category.price }} €</li>
                                    {% endfor %}
                                </ul>
                            {% endif %}
                        </div>
                        <form method="post" action="{{ path('cart_delete_item_licence') }}">
                            <input type="hidden" name="item_id" value="{{ orderItem.itemId|default('id123') }}">
                            <button class="cart-item__delete" title="Supprimer">{{ icon('trash', true) }}</button>
                        </form>
                    </div>
                {% endfor %}

                {# Stages groupés par profil #}
                {% for group in groupedStageOrderItems|default([]) %}
                    <div class="cart-item">
                        <div class="cart-item__icon">
                            <img src="{{ asset('img/front/cart/training.png') }}" alt="Stage football" class="w-10 h-10 object-contain" />
                        </div>
                        <div class="cart-item__content">
                            <p class="cart-item__title">{{ group.profil.getFullName()|default('Nom Enfant') }}</p>
                            <p class="cart-item__desc">Stage – jours sélectionnés :</p>
                            <ul class="cart-item__details">
                                {% for item in group.items|default([]) %}
                                    <li class="flex justify-between items-center">
                                        <span>
                                            {{ item.stageDay.getName()|default('Jour') }} –
                                            {{ item.stageDay.getPrice()|default('50.00') }} €
                                        </span>
                                        <form method="post" action="{{ path('cart_delete_item_stage') }}" class="ml-4">
                                            <input type="hidden" name="item_id" value="{{ item.itemId|default('idStage') }}">
                                            <button class="cart-item__delete" title="Supprimer">{{ icon('trash', true) }}</button>
                                        </form>
                                    </li>
                                {% endfor %}
                            </ul>
                        </div>
                    </div>
                {% endfor %}

                <div class="flex justify-between mt-6">
                    <form action="{{ path('cart_clear') }}" method="post">
                        <button class="btn btn-secondary">Vider le panier</button>
                    </form>
                </div>
            </div>

            {# COLONNE DROITE : Résumé #}
            <div class="cart-summary">
                <h2 class="cart-summary__title">Résumé de la commande</h2>

                <div class="cart-summary__total">
                    <span>Total</span>
                    <span>{{ total|default('1338.00') }} €</span>
                </div>

                {% if total > 0 %}
                    <a href="{{ path('cart_choose_payment') }}" class="btn-success mt-4">
                        Valider et payer →
                    </a>
                {% else %}
                    <a href="{{ path('cart_auto_validate') }}" class="btn-success mt-4">
                        Valider gratuitement
                    </a>
                {% endif %}
            </div>
        </div>
    {% endif %}
{% endblock %}