{% extends PAYMENT_BASE_TEMPLATE %}
{% load i18n %}
{% block title %}
Payment Success
{% endblock %}

{% block description %}
{% trans 'Your payment was successful! Thank you for your purchase.' %}
{% endblock %}

{% block body %}
<div class="container" style="margin-top:5%;">
    <div class="row">
        <div class="jumbotron" style="box-shadow: 2px 2px 4px #000000;">
            <h2 class="text-center">{% trans 'PAYMENT RECEIVED' %}</h2>
            <h3 class="text-center">{% trans 'Thank you for your payment, it’s processing' %}</h3>

            <p class="text-center">{% trans 'Your confirmation # is' %}: <a href="{{ payment_info.get_absolute_url }}">
                {{ order_id }}</a></p>
            <p class="text-center">
                {% blocktranslate %}
                You will receive a confirmation email with details of the payment and a
                link to track it. Thank you
                {% endblocktranslate %} {{ first_name }}!
            </p>
            <center>
                <div class="btn-group" style="margin-top:50px;">
                    <a href="{% url PAYMENT_REDIRECT_SUCCESS_URL %}"
                       class="btn btn-lg btn-warning">{% trans 'CONTINUE' %}</a>
                </div>
            </center>
        </div>
    </div>
</div>
{% endblock %}
{% block customCSS %}
<style>
    .container {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        min-height: 80vh;
    }

    .jumbotron {
        background-color: #fff;
        padding: 50px;
        border-radius: 10px;
    }
</style>
{% endblock %}



