{% extends 'layouts/base.html' %}
{% load i18n %}
{% load pyaa %}
{% load pyaa_status %}
{% load static %}

{% block content %}

<div class="container mx-auto px-4 py-8 max-w-xl text-center">
    <div class="text-6xl text-error mb-4">
        <i class="fa-solid fa-circle-xmark"></i>
    </div>

    {% element page_header centered=True %}
        {% translate "message.shop-payment-error.title" %}
    {% endelement %}

    <p class="text-base-content/70 mb-6">
        {% trans "message.shop-payment-error.subtitle" %}
    </p>

    <div class="bg-base-200 rounded-lg p-4 mb-6">
        <p class="mb-2">
            <strong>{% trans "message.shop-payment-date" %}</strong><br>
            {{ paid_item.created_at }}
        </p>
        <p class="mb-0">
            <strong>{% trans "message.shop-payment-status" %}</strong><br>
            <span class="badge badge-error">{{ paid_item.get_status_display }}</span>
        </p>
    </div>

    {% if paid_item_type == "subscription" %}
    <a href="{% url 'account_subscriptions' %}" class="btn btn-error">
        {% translate "button.account-subscriptions" %}
    </a>
    {% elif paid_item_type == "credit-purchase" %}
    <a href="{% url 'account_credit_purchases' %}" class="btn btn-error">
        {% translate "button.account-credit-purchases" %}
    </a>
    {% elif paid_item_type == "product-purchase" %}
    <a href="{% url 'account_product_purchases' %}" class="btn btn-error">
        {% translate "button.account-product-purchases" %}
    </a>
    {% endif %}
</div>

{% endblock content %}