{% extends '@kohinos/common/layout.html.twig' %}

{% block content %}
<div class='container homepage'>
    {% include '@kohinos/block/breadcrumb.html.twig' with {'label' : 'Paiement SSA confirmé' } %}

    <div class="card mx-auto mt-4" style="max-width: 600px;">
        <div class="card-header bg-success text-white">
            <i class="fa fa-check-circle"></i> Paiement confirmé
        </div>
        <div class="card-body text-center">
            <div class="mb-4">
                <i class="fa fa-check-circle text-success" style="font-size: 4rem;"></i>
            </div>

            <h4 class="mb-3">Merci pour votre participation !</h4>

            <p class="mb-4">
                Votre paiement HelloAsso a été accepté !<br>
                Votre cotisation SSA sera finalisée dans les 30 prochaines minutes.<br>
                Vous recevrez une confirmation par email une fois le traitement terminé.
            </p>

            {% if donUrl is defined and donUrl is not empty %}
                <hr class="my-4">
                <div class="alert alert-info">
                    <i class="fa fa-heart"></i> <strong>Envie de soutenir davantage notre projet ?</strong>
                    <p class="mb-0 mt-2">Vous pouvez effectuer un don supplémentaire via HelloAsso.</p>
                </div>
                <a href="{{ donUrl }}" target="_blank" rel="noopener noreferrer" class="btn btn-lg btn-outline-primary mb-3">
                    <i class="fa fa-heart"></i> Faire un don
                </a>
            {% endif %}

            <div class="mt-4">
                <a href="{{ path('index') }}" class="btn btn-primary">
                    <i class="fa fa-home"></i> Retour à l'accueil
                </a>
            </div>
        </div>
    </div>
</div>
{% endblock %}