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

{% block body %}
    <div class="account-layout container-fluid">
        {% include 'front/account/_sidebar.html.twig' %}

        <div class="account-content">
            <div class="account-profil__header mb-6">
                <div class="account-profil__title-group">
                    <h2 class="account-profil__title">Détail de la commande</h2>
                    <p class="account-profil__subtitle">
                        Référence : <span class="font-semibold">{{ order.reference }}</span> — passée le {{ order.createdAt|date('d/m/Y') }}
                    </p>
                </div>
            </div>

            <div class="account-box mb-10">
                <div class="space-y-4">
                    <div class="flex justify-between items-center">
                        <span class="text-gray-600 font-medium">Moyen de paiement :</span>
                        <span class="text-gray-900">{{ order.paymentMethod.name }}</span>
                    </div>

                    <div class="flex justify-between items-center">
                        <span class="text-gray-600 font-medium">Montant total :</span>
                        <span class="text-gray-900">{{ order.total|number_format(2, ',', ' ') }} €</span>
                    </div>

                    <div class="flex justify-between items-center">
                        <span class="text-gray-600 font-medium">État :</span>
                        <span class="inline-block px-2 py-1 text-sm rounded
                            {% if order.state == constant('App\\Entity\\Order::STATE_CONFIRM') %}
                                bg-green-100 text-green-700
                            {% elseif order.state == constant('App\\Entity\\Order::STATE_PAYMENT_WAITING') %}
                                bg-yellow-100 text-yellow-700
                            {% else %}
                                bg-red-100 text-red-700
                            {% endif %}
                        ">
                            {% if order.state == constant('App\\Entity\\Order::STATE_CONFIRM') %}
                                Confirmée
                            {% elseif order.state == constant('App\\Entity\\Order::STATE_PAYMENT_WAITING') %}
                                En attente de paiement
                            {% else %}
                                Annulée / Refusée
                            {% endif %}
                        </span>
                    </div>

                    <div class="flex justify-between items-center">
                        <span class="text-gray-600 font-medium">Reste à payer :</span>
                        <span class="text-gray-900">
                            {{ order.outstandingBalance|default('0.00')|number_format(2, ',', ' ') }} €
                        </span>
                    </div>

                    {% if order.isPaid %}
                        <div class="pt-2">
                            <a href="{{ path('account_orders_invoice', {id: order.id}) }}" class="btn btn-secondary btn-small">
                                Télécharger la facture
                            </a>
                        </div>
                    {% endif %}
                </div>
            </div>

            {% if order.licenceItems|length > 0 %}
                <h3 class="text-lg font-semibold mb-4">Licences</h3>
                <div class="space-y-4 mb-10">
                    {% for licenceItem in order.licenceItems %}
                        <div class="account-box">
                            <p class="text-sm text-gray-800"><span class="font-semibold">Profil :</span> {{ licenceItem.profil.fullname }}</p>
                            <p class="text-sm text-gray-800"><span class="font-semibold">Type de licence :</span> {{ licenceItem.typeLicence.name }} ({{ licenceItem.typeLicence.type }})</p>
                            <p class="text-sm text-gray-800"><span class="font-semibold">Prix :</span> {{ licenceItem.price|number_format(2, ',', ' ') }} €</p>
                        </div>
                    {% endfor %}
                </div>
            {% endif %}

            {% if order.stageItems|length > 0 %}
                <h3 class="text-lg font-semibold mb-4">Stages</h3>
                <div class="space-y-4 mb-10">
                    {% for stageItem in order.stageItems %}
                        <div class="account-box">
                            <p class="text-sm text-gray-800"><span class="font-semibold">Profil :</span> {{ stageItem.profil.fullname }}</p>
                            <p class="text-sm text-gray-800">
                                <span class="font-semibold">Stage :</span>
                                {{ stageItem.stageDay.stage.name }} — {{ stageItem.stageDay.date|date('d/m/Y') }}
                            </p>
                            <p class="text-sm text-gray-800"><span class="font-semibold">Prix :</span> {{ stageItem.price|number_format(2, ',', ' ') }} €</p>
                        </div>
                    {% endfor %}
                </div>
            {% endif %}
        </div>
    </div>
{% endblock %}