{# templates/contributor/detail.html.twig #}
{% extends 'base.html.twig' %}

{% block title %}
    {% if contributor.shipped %}
        Détail de l'expédition - {{ contributor.name }}
    {% else %}
        Préparer l'envoi - {{ contributor.name }}
    {% endif %}
{% endblock %}

{% block body %}
   <div class="bg-white rounded-lg shadow-md p-6">
       {# En-tête avec titre et statut #}
       <div class="flex justify-between items-center mb-6">
           <div>
               <h1 class="text-2xl font-bold">{{ contributor.name }}</h1>
               {% if contributor.shipped %}
                   <span class="inline-block bg-green-100 text-green-800 py-1 px-3 rounded-full text-sm font-medium mt-2">
                       ✅ Envoi créé - Tracking #{{ contributor.trackingNumber }}
                   </span>
               {% else %}
                   <span class="inline-block bg-yellow-100 text-yellow-800 py-1 px-3 rounded-full text-sm font-medium mt-2">
                       ⏳ En attente de création d'envoi
                   </span>
               {% endif %}
           </div>

           {# Actions principales en haut à droite #}
           <div class="flex space-x-3">
               {% if contributor.shipped %}
                   {# Actions pour contributeur déjà expédié #}
                   <a href="https://connect.mondialrelay.com/{{ mr_customer_code }}/Expedition/Afficher?numeroExpedition={{ contributor.trackingNumber }}&codeEntiteLogistique="
                      target="_blank"
                      class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
                       📄 Voir dans Connect
                   </a>
                   <a href="https://connect.mondialrelay.com/{{ mr_customer_code }}/Etiquette/GetStickersExpedition?numeroExpedition={{ contributor.trackingNumber }}"
                      target="_blank"
                      class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
                       🖨️ Télécharger l'étiquette
                   </a>
               {% else %}
                   {# Actions pour contributeur en attente #}
                   {% if shipping_readiness.can_ship %}
                       <form method="post" class="inline">
                           <input type="hidden" name="action" value="create_shipment">
                           <button type="submit" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
                                🚚 Créer l'expédition
                           </button>
                       </form>
                   {% else %}
                       <button type="button" disabled class="bg-gray-400 text-white font-bold py-2 px-4 rounded cursor-not-allowed">
                           ❌ Impossible de créer l'expédition
                       </button>
                   {% endif %}
               {% endif %}
           </div>
       </div>

       <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
           <div class="p-4 bg-blue-50 rounded-lg">
               <h2 class="text-lg font-semibold mb-2">Informations de livraison</h2>
               <p><strong>Nom:</strong> {{ contributor.deliveryFirstName ?? contributor.billingFirstName }} {{ contributor.billingLastName }}</p>
               <p><strong>Email:</strong> {{ contributor.email }}</p>
               {% if contributor.ululesId %}<p><strong>ID Ulule:</strong> {{ contributor.ululesId }}</p>{% endif %}
               <p><strong>Adresse:</strong> {{ contributor.deliveryAddress ?? contributor.address }}</p>
               {% if contributor.deliveryAddress2 %}<p><strong>Complément:</strong> {{ contributor.deliveryAddress2 }}</p>{% endif %}
               <p><strong>Code postal:</strong> {{ contributor.deliveryPostalCode ?? contributor.postalCode }}</p>
               <p><strong>Ville:</strong> {{ contributor.deliveryCity ?? contributor.city }}</p>
               <p><strong>Pays:</strong> {{ contributor.deliveryCountry ?? contributor.country }}</p>
               <p><strong>Téléphone:</strong> {{ contributor.deliveryPhone ?? contributor.phone }}</p>
           </div>

           <div class="p-4 bg-blue-50 rounded-lg">
               <h2 class="text-lg font-semibold mb-2">Point Relais de livraison</h2>
               {% if contributor.relayName %}
                   <p><strong>Nom:</strong> {{ contributor.relayName }}</p>
                   <p><strong>Adresse:</strong> {{ contributor.relayAddress }}</p>
                   <p><strong>ID:</strong> {{ contributor.relayId }}</p>
               {% else %}
                   <p class="text-red-600">❌ Aucun point relais défini</p>
                   {% if not contributor.shipped %}
                       <a href="{{ path('app_contributor_send_relay_selection_email', {'id': contributor.id}) }}" 
                          class="inline-block mt-2 bg-orange-500 text-white py-1 px-3 rounded text-sm hover:bg-orange-600">
                           Envoyer email de sélection
                       </a>
                   {% endif %}
               {% endif %}
           </div>
       </div>

       <div class="bg-white rounded-lg shadow-sm border border-gray-200 mb-6">
            <div class="p-6">
                <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
                    {# Colonne 1: Liste des contreparties #}
                    <div class="{% if contributor.shipped %}lg:col-span-2{% endif %}">
                        <h2 class="text-lg font-semibold mb-5">Contreparties à expédier</h2>
                        <div class="space-y-3">
                            {% for reward in contributor.rewards %}
                                <div class="flex items-start p-4 bg-gray-50 rounded-lg border border-gray-100 hover:bg-gray-100 transition-colors">
                                    <div class="flex-shrink-0 w-10 h-10 bg-blue-100 rounded-lg flex items-center justify-center mr-4">
                                        <svg class="w-5 h-5 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.746 0 3.332.477 4.5 1.253v13C19.832 18.477 18.246 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"/>
                                        </svg>
                                    </div>
                                    <div class="flex-grow min-w-0">
                                        <div class="flex items-start justify-between">
                                            <div>
                                                <h4 class="text-sm font-medium text-gray-900 leading-tight">
                                                    {{ reward.title }}
                                                </h4>
                                                {% if reward.variation %}
                                                    <p class="text-xs text-gray-500 mt-1">
                                                        Variation: {{ reward.variation }}
                                                    </p>
                                                {% endif %}
                                            </div>
                                            <div class="text-right ml-4 flex-shrink-0">
                                                <span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
                                                    ×{{ reward.quantity }}
                                                </span>
                                            </div>
                                        </div>
                                        <div class="flex items-center text-xs text-gray-500">
                                            <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16l6-2m-6 2l-6-2"/>
                                            </svg>
                                            {{ reward.weight|number_format(0) }}g par unité
                                        </div>
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                    </div>

                    {# Colonne 2: Informations de poids et contrôles #}
                    <div class="space-y-6 lg:col-span-1">
                        {# Récapitulatif du poids #}
                        <div class="bg-gradient-to-br from-blue-50 to-indigo-100 rounded-lg p-5 border border-blue-200">
                            <div class="text-center">
                                <div class="flex items-center justify-center mb-3">
                                    <svg class="w-8 h-8 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16l6-2m-6 2l-6-2"/>
                                    </svg>
                                </div>
                                <h3 class="text-sm font-medium text-gray-700 mb-2">Poids total du colis</h3>
                                <div class="text-3xl font-bold text-gray-900" id="current-weight">
                                    {{ contributor.totalWeight|number_format(0) }}
                                </div>
                                <div class="text-sm text-gray-600 mt-1">grammes</div>

                                {% if contributor.totalWeight > 1000 %}
                                    <div class="text-xs text-gray-500 mt-2">
                                        ({{ (contributor.totalWeight / 1000)|number_format(1) }}kg)
                                    </div>
                                {% endif %}

                                <div class="mt-3 text-xs" id="weight-info">
                                    <span class="inline-flex items-center px-2 py-1 rounded-full bg-green-100 text-green-700">
                                        <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 7h6m0 10v-3m-3 3h.01M9 17h.01M9 14h.01M12 14h.01M15 11h.01M12 11h.01M9 11h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"/>
                                        </svg>
                                        Calculé automatiquement
                                    </span>
                                    <br/><br/><br/><br/><br/>
                                </div>
                            </div>
                        </div>
                    </div>

                    {# Colonne 3: Informations de poids et contrôles #}
                    <div class="space-y-6 lg:col-span-1">
                        {# Contrôle du poids manuel #}
                        {% if not contributor.shipped %}
                            <div class="bg-white rounded-lg border border-gray-200 p-5">
                                <h3 class="text-sm font-medium text-gray-900 mb-4 flex items-center">
                                    <svg class="w-4 h-4 mr-2 text-amber-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                                    </svg>
                                    Ajustement manuel
                                </h3>

                                <div class="space-y-4">
                                    <div>
                                        <label for="manual_weight" class="block text-sm text-gray-700 mb-2">
                                            Poids personnalisé (grammes)
                                        </label>
                                        <div class="relative">
                                            <input type="number"
                                                   id="manual_weight"
                                                   name="manual_weight"
                                                   min="100"
                                                   max="5000"
                                                   step="10"
                                                   placeholder="Ex: 1200"
                                                   class="w-full pl-4 pr-12 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-all text-sm">
                                            <div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
                                                <span class="text-gray-400 text-sm">g</span>
                                            </div>
                                        </div>
                                    </div>

                                    <div class="flex space-x-2">
                                        <button type="button"
                                                id="apply-manual-weight"
                                                class="flex-1 bg-blue-600 hover:bg-blue-700 text-white font-medium py-2.5 px-4 rounded-lg transition-colors text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2">
                                            Appliquer
                                        </button>
                                        <button type="button"
                                                id="reset-weight"
                                                class="flex-1 bg-gray-100 hover:bg-gray-200 text-gray-700 font-medium py-2.5 px-4 rounded-lg transition-colors text-sm focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2"
                                                style="display: none;">
                                            Reset
                                        </button>
                                    </div>

                                    <div class="bg-amber-50 border border-amber-200 rounded-lg p-3">
                                        <div class="flex items-start">
                                            <svg class="w-4 h-4 text-amber-600 mt-0.5 mr-2 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L4.082 16.5c-.77.833.192 2.5 1.732 2.5z"/>
                                            </svg>
                                            <div class="text-xs text-amber-700">
                                                <p class="font-medium mb-1">Limite : 100g - 5kg maximum</p>
                                                <p>Ce poids sera utilisé uniquement pour cette expédition.</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        {% endif %}
                    </div>
                </div>
            </div>
        </div>

        <script>
        document.addEventListener('DOMContentLoaded', function() {
            const manualWeightInput = document.getElementById('manual_weight');
            const applyButton = document.getElementById('apply-manual-weight');
            const resetButton = document.getElementById('reset-weight');
            const currentWeightSpan = document.getElementById('current-weight');
            const weightInfo = document.getElementById('weight-info');

            const originalWeight = {{ contributor.totalWeight|number_format(0, '.', '') }};
            let currentWeight = originalWeight;
            let isManualWeight = false;

            // Fonction pour mettre à jour l'affichage du poids
            function updateWeightDisplay(weight, isManual = false) {
                currentWeight = weight;
                isManualWeight = isManual;

                currentWeightSpan.textContent = weight.toLocaleString('fr-FR');

                if (isManual) {
                    weightInfo.innerHTML = `
                        <span class="inline-flex items-center px-2 py-1 rounded-full bg-amber-100 text-amber-700">
                            <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"/>
                            </svg>
                            Poids manuel actif
                        </span>
                    `;
                    resetButton.style.display = 'block';
                } else {
                    weightInfo.innerHTML = `
                        <span class="inline-flex items-center px-2 py-1 rounded-full bg-green-100 text-green-700">
                            <svg class="w-3 h-3 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 7h6m0 10v-3m-3 3h.01M9 17h.01M9 14h.01M12 14h.01M15 11h.01M12 11h.01M9 11h.01M7 21h10a2 2 0 002-2V5a2 2 0 00-2-2H7a2 2 0 00-2 2v14a2 2 0 002 2z"/>
                            </svg>
                            Calculé automatiquement
                        </span>
                        <br/><br/><br/><br/><br/>
                    `;
                    resetButton.style.display = 'none';
                }

                // Mettre à jour les champs cachés dans les formulaires d'expédition
                updateShipmentForms(weight);
            }

            // Fonction pour mettre à jour les formulaires avec le poids manuel
            function updateShipmentForms(weight) {
                const shipmentForms = document.querySelectorAll('form');

                shipmentForms.forEach(form => {
                    const actionInput = form.querySelector('input[name="action"]');
                    if (actionInput && actionInput.value === 'create_shipment') {
                        const existingInput = form.querySelector('input[name="manual_total_weight"]');
                        if (existingInput) {
                            existingInput.remove();
                        }

                        if (isManualWeight) {
                            const hiddenInput = document.createElement('input');
                            hiddenInput.type = 'hidden';
                            hiddenInput.name = 'manual_total_weight';
                            hiddenInput.value = weight;
                            form.appendChild(hiddenInput);
                        }
                    }
                });
            }

            // Validation en temps réel de l'input
            function validateInput() {
                const value = parseInt(manualWeightInput.value);

                manualWeightInput.classList.remove('border-red-300', 'border-green-300');
                applyButton.classList.remove('opacity-50', 'cursor-not-allowed');
                applyButton.disabled = false;

                if (value && !isNaN(value)) {
                    if (value < 100 || value > 5000) {
                        manualWeightInput.classList.add('border-red-300');
                        applyButton.classList.add('opacity-50', 'cursor-not-allowed');
                        applyButton.disabled = true;
                    } else {
                        manualWeightInput.classList.add('border-green-300');
                    }
                }
            }

            // Appliquer le poids manuel
            applyButton.addEventListener('click', function() {
                const manualWeight = parseInt(manualWeightInput.value);

                if (!manualWeight || isNaN(manualWeight)) {
                    showNotification('Veuillez saisir un poids valide.', 'error');
                    return;
                }

                if (manualWeight < 100) {
                    showNotification('Le poids minimum est de 100g.', 'error');
                    return;
                }

                if (manualWeight > 5000) {
                    showNotification('Le poids maximum est de 5kg (5000g).', 'error');
                    return;
                }

                updateWeightDisplay(manualWeight, true);
                manualWeightInput.value = '';
                manualWeightInput.classList.remove('border-green-300');
                showNotification(`Poids manuel appliqué : ${manualWeight}g`, 'success');
            });

            // Revenir au calcul automatique
            resetButton.addEventListener('click', function() {
                updateWeightDisplay(originalWeight, false);
                manualWeightInput.value = '';
                manualWeightInput.classList.remove('border-green-300', 'border-red-300');
                showNotification('Retour au calcul automatique', 'info');
            });

            // Validation en temps réel
            manualWeightInput.addEventListener('input', validateInput);

            // Appliquer en appuyant sur Entrée
            manualWeightInput.addEventListener('keypress', function(e) {
                if (e.key === 'Enter') {
                    applyButton.click();
                }
            });

            // Fonction pour afficher les notifications
            function showNotification(message, type = 'info') {
                // Tu peux utiliser ton système de notifications existant ici
                // ou implémenter un simple console.log pour le moment
                console.log(`[${type.toUpperCase()}] ${message}`);
            }
        });
        </script>

        {% set estimated_price = contributor.estimatedShippingPrice %}
        <div class="p-4 bg-blue-50 rounded-lg mb-6">
            <h2 class="text-lg font-semibold mb-2">💰 Estimation du coût d'envoi</h2>
            {% if estimated_price > 0 %}
                <p><strong>Poids total :</strong> {{ contributor.totalWeight|number_format(0) }}g</p>
                <p><strong>Destination :</strong> {{ contributor.deliveryCountry ?? contributor.country ?? 'FR' }}</p>
                <p class="text-lg"><strong>Prix estimé :</strong>
                    <span class="text-blue-700 font-bold">{{ estimated_price|number_format(2) }} EUR</span>
                </p>
                <p class="text-xs text-gray-600 mt-2">
                    💡 Prix indicatif - Ajustez selon vos tarifs négociés
                </p>
            {% else %}
                <p class="text-orange-600">Destination non supportée ({{ contributor.deliveryCountry ?? contributor.country ?? 'FR' }})</p>
            {% endif %}
        </div>

       {# Vérifications avant envoi (seulement si pas encore expédié) #}
       {% if not contributor.shipped %}
           <div class="mb-6">
               <h2 class="text-lg font-semibold mb-4">Vérifications avant envoi</h2>

               <div class="space-y-3">
                   {% for checkName, check in shipping_readiness.checks %}
                       {% if checkName == 'relay_validation' %}
                           {# Cas spécial pour la validation du point relais avec détails #}
                           <div class="flex items-start p-3 rounded-lg {% if check.valid %}bg-green-50 border border-green-200{% else %}bg-red-50 border border-red-200{% endif %}">
                               <div class="flex-shrink-0 mr-3">
                                   {% if check.valid %}
                                       <span class="text-green-600 text-lg">✅</span>
                                   {% else %}
                                       <span class="text-red-600 text-lg">❌</span>
                                   {% endif %}
                               </div>
                               <div class="flex-grow">
                                   <p class="font-medium {% if check.valid %}text-green-700{% else %}text-red-700{% endif %}">
                                       Validation du point relais
                                   </p>
                                   <p class="text-sm {% if check.valid %}text-green-600{% else %}text-red-600{% endif %}">
                                       {{ check.message }}
                                   </p>

                                   {# Afficher les détails du point relais si valide #}
                                   {% if check.valid and check.relayData %}
                                       <div class="mt-3 p-3 bg-white rounded border">
                                           <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-xs">
                                               <div>
                                                   <p><strong>Nom :</strong> {{ check.relayData.Nom }}</p>
                                                   <p><strong>ID :</strong> {{ check.relayData.Pays }}{{ contributor.formatRelayId }}</p>
                                                   <p><strong>Adresse :</strong> {{ check.relayData.Adresse1 }}</p>
                                                   <p><strong>Ville :</strong> {{ check.relayData.CP }} {{ check.relayData.Ville }}</p>
                                                   {% if check.relayData.Distance %}
                                                       <p><strong>Distance :</strong> {{ check.relayData.Distance }}m</p>
                                                   {% endif %}
                                               </div>
                                               <div>
                                                   <ul class="text-xs space-y-1 ml-4">
                                                       {% if check.relayData.Horaires_Lundi %}<li><strong>Lundi :</strong> {{ check.relayData.Horaires_Lundi }}</li>{% endif %}
                                                       {% if check.relayData.Horaires_Mardi %}<li><strong>Mardi :</strong> {{ check.relayData.Horaires_Mardi }}</li>{% endif %}
                                                       {% if check.relayData.Horaires_Mercredi %}<li><strong>Mercredi :</strong> {{ check.relayData.Horaires_Mercredi }}</li>{% endif %}
                                                       {% if check.relayData.Horaires_Jeudi %}<li><strong>Jeudi :</strong> {{ check.relayData.Horaires_Jeudi }}</li>{% endif %}
                                                       {% if check.relayData.Horaires_Vendredi %}<li><strong>Vendredi :</strong> {{ check.relayData.Horaires_Vendredi }}</li>{% endif %}
                                                       {% if check.relayData.Horaires_Samedi %}<li><strong>Samedi :</strong> {{ check.relayData.Horaires_Samedi }}</li>{% endif %}
                                                       {% if check.relayData.Horaires_Dimanche %}<li><strong>Dimanche :</strong> {{ check.relayData.Horaires_Dimanche }}</li>{% endif %}
                                                   </ul>
                                               </div>
                                           </div>
                                       </div>
                                   {% endif %}
                               </div>
                           </div>
                       {% else %}
                           {# Cas normal pour les autres vérifications #}
                           <div class="flex items-center p-3 rounded-lg {% if check.valid %}bg-green-50 border border-green-200{% elseif check.blocking %}bg-red-50 border border-red-200{% else %}bg-orange-50 border border-orange-200{% endif %}">
                               <div class="flex-shrink-0 mr-3">
                                   {% if check.valid %}
                                       <span class="text-green-600 text-lg">✅</span>
                                   {% elseif check.blocking %}
                                       <span class="text-red-600 text-lg">❌</span>
                                   {% else %}
                                       <span class="text-orange-600 text-lg">⚠️</span>
                                   {% endif %}
                               </div>
                               <div>
                                   <p class="font-medium {% if check.valid %}text-green-700{% elseif check.blocking %}text-red-700{% else %}text-orange-700{% endif %}">
                                       {% if checkName == 'weight' %}Poids du colis
                                       {% elseif checkName == 'required_data' %}Données obligatoires
                                       {% elseif checkName == 'phone' %}Numéro de téléphone pour SMS
                                       {% elseif checkName == 'relay_point' %}Point relais valide
                                       {% elseif checkName == 'geographical_coherence' %}Cohérence géographique
                                       {% endif %}
                                   </p>
                                   <p class="text-sm {% if check.valid %}text-green-600{% elseif check.blocking %}text-red-600{% else %}text-orange-600{% endif %}">
                                       {% if checkName == 'required_data' %}
                                           {% if check.valid %}
                                               ✅ Toutes présentes : Email, Nom, Adresse, Code postal, Ville
                                           {% else %}
                                               ❌ {{ check.message }}
                                           {% endif %}
                                       {% elseif checkName == 'geographical_coherence' %}
                                           {{ check.message }}
                                           {% if check.details.contributor_location is defined and check.details.relay_location is defined %}
                                               {% if check.valid and check.details.reason == 'same_postal_code' %}
                                                   <br><small>📍 {{ check.details.contributor_location }} ↔ {{ check.details.relay_location }}</small>
                                               {% elseif not check.valid %}
                                                   <br><small>📍 Contributeur: {{ check.details.contributor_location }}</small>
                                                   <br><small>📍 Point relais: {{ check.details.relay_location }}</small>
                                               {% endif %}
                                           {% endif %}
                                       {% else %}
                                           {{ check.message }}
                                       {% endif %}
                                   </p>
                               </div>
                           </div>
                       {% endif %}
                   {% endfor %}
               </div>
           </div>
       {% endif %}

       {# Actions en bas #}
       <div class="pt-4 flex justify-between items-center border-t">
           <a href="{{ path('app_contributor_index') }}" class="bg-gray-200 hover:bg-gray-300 text-gray-700 font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
               ← Retour à la liste
           </a>

           <div class="flex space-x-3">
               {% if contributor.shipped %}
                   {# Actions pour contributeur expédié #}
                   <form method="post" class="inline" onsubmit="return confirm('Êtes-vous sûr de vouloir remettre ce contributeur en attente ? Assurez-vous d\'avoir annulé l\'expédition sur Mondial Relay Connect !')">
                       <input type="hidden" name="action" value="cancel_shipment">
                       <button type="submit" class="bg-red-600 hover:bg-red-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
                           ❌ Remettre en attente (faut annuler sur Mondial Relay en premier !)
                       </button>
                   </form>
               {% else %}
                   {# Actions pour contributeur en attente #}
                   {% if shipping_readiness.can_ship %}
                       <form method="post" class="inline">
                           <input type="hidden" name="action" value="create_shipment">
                           <button type="submit" class="bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline">
                               🚚 Créer l'expédition Mondial Relay
                           </button>
                       </form>
                   {% else %}
                       <button type="button" disabled class="bg-gray-400 text-white font-bold py-2 px-4 rounded cursor-not-allowed">
                           ❌ Impossible de créer l'expédition
                       </button>
                   {% endif %}
               {% endif %}
           </div>
       </div>

       {% if not contributor.shipped and not shipping_readiness.can_ship %}
           <div class="mt-4 text-sm text-red-600 bg-red-50 p-3 rounded">
               <strong>L'expédition ne peut pas être créée :</strong><br>
               Veuillez corriger les erreurs indiquées ci-dessus avant de procéder.
           </div>
       {% endif %}
   </div>
{% endblock %}