{% extends 'layout/checkout.html.twig' %}

{% block title %}{% trans from 'meta' %}checkout.title{% endtrans %}{% endblock %}

{% block meta %}
    <meta name="robots" content="index,follow">
    <meta name="description" lang="{{ app.request.locale }}"
          content="{% trans from 'meta' %}shop.description{% endtrans %}">
    <meta property="og:site_name" content="{% trans from 'meta' %}shop.title{% endtrans %}">
    <meta property="og:title" content="{% trans from 'meta' %}shop.title{% endtrans %}">
    <meta property="og:type" content="website">
    <meta property="og:url" content="{{ app.request.uri }}">
    <meta property="og:image" content="{{ absolute_url(asset(viti_theme_asset('images/logo_600x450.jpg'))) }}">
    <meta property="og:locale" content="{{ app.request.locale }}">
    <meta property="og:image:type" content="image/jpeg">
    <meta property="og:image:width" content="600">
    <meta property="og:image:height" content="450">
    <meta property="og:description"
          content="{% trans from 'meta' %}shop.description{% endtrans %}">
{% endblock meta %}

{% block main %}
    {% set payment_warnings = app.flashes('warning') %}
    {% set payment_errors = app.flashes('error') %}

    {% if payment_warnings is not empty or payment_errors is not empty %}
        <section data-payment-return-container class="theme-checkout-alerts">
            <div class="theme-checkout-container">
                {% for message in payment_warnings %}
                    <div data-payment-return-alert class="theme-checkout-alert theme-checkout-alert--warning">
                        <div class="theme-checkout-alert__title">
                            {{ 'checkout_design.payment_return_warning'|trans }}
                        </div>
                        <div>{{ message }}</div>
                        <p>
                            {{ (payment_pending|default(false)) ? 'checkout_design.payment_pending_auto_refresh'|trans : 'checkout_design.payment_retry_notice'|trans }}
                        </p>
                    </div>
                {% endfor %}

                {% for message in payment_errors %}
                    <div data-payment-return-alert class="theme-checkout-alert theme-checkout-alert--error">
                        <div class="theme-checkout-alert__title">
                            {{ 'checkout_design.payment_return_error'|trans }}
                        </div>
                        <div>{{ message }}</div>
                        <p>{{ 'checkout_design.payment_retry_notice'|trans }}</p>
                    </div>
                {% endfor %}
            </div>
        </section>
    {% endif %}

    {{ component('cart:CheckoutForm', {
        cartId: checkout_cart_id|default(null),
        disableUserAutofill: disable_user_autofill|default(false)
    }) }}
{% endblock %}
