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

{% block title %}Devis signe - Association E-Cosplay{% endblock %}

{% block body %}
<main class="max-w-2xl mx-auto px-4 py-16">
    <div class="glass p-10 text-center">
        <div class="mx-auto mb-6 w-20 h-20 bg-green-500/20 flex items-center justify-center">
            <svg class="w-10 h-10 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="3" d="M5 13l4 4L19 7"/>
            </svg>
        </div>

        <h1 class="text-3xl font-bold heading-page mb-3">{{ customer.raisonSociale ? 'Cher ' ~ customer.raisonSociale : 'Merci ' ~ customer.firstName }} !</h1>
        <p class="text-sm text-gray-600 leading-relaxed mb-8">
            Notre equipe vous remercie de votre choix de travailler avec nous.<br>
            Votre devis <span class="font-mono font-bold">{{ devis.orderNumber.numOrder }}</span> a bien ete <strong>signe</strong>.<br>
            Vous recevrez sous 72h l'avis de paiement associe pour effectuer le paiement du service.
        </p>

        <div class="glass p-6 mb-6 text-left">
            <div class="grid grid-cols-2 gap-4 text-xs">
                <div>
                    <p class="font-bold uppercase tracking-widest text-gray-400 mb-1">Numero</p>
                    <p class="font-mono font-bold text-base">{{ devis.orderNumber.numOrder }}</p>
                </div>
                <div>
                    <p class="font-bold uppercase tracking-widest text-gray-400 mb-1">Date signature</p>
                    <p class="font-bold text-base">{{ "now"|date('d/m/Y') }}</p>
                </div>
                <div>
                    <p class="font-bold uppercase tracking-widest text-gray-400 mb-1">Total HT</p>
                    <p class="font-mono text-base">{{ devis.totalHt }} &euro;</p>
                </div>
                <div>
                    <p class="font-bold uppercase tracking-widest text-gray-400 mb-1">{% if tva_enabled %}Total TTC{% else %}Total{% endif %}</p>
                    <p class="font-mono font-bold text-base">{{ tva_enabled ? devis.totalTtc : devis.totalHt }} &euro;</p>
                </div>
            </div>
        </div>

        {% if devis.auditPdf %}
            <div class="mb-6">
                <a href="{{ vich_uploader_asset(devis, 'auditPdfFile') }}" target="_blank"
                   class="px-4 py-2 bg-indigo-600 text-white font-bold uppercase text-[10px] tracking-widest hover:bg-indigo-700 transition-all">
                    Voir l'audit de signature
                </a>
            </div>
        {% endif %}

        <p class="text-[10px] text-gray-400 uppercase tracking-widest">
            Une question ? <a href="mailto:client@e-cosplay.fr" class="text-[#fabf04] hover:underline">client@e-cosplay.fr</a>
        </p>
    </div>
</main>
{% endblock %}
