{% extends '@SyliusShop/layout.html.twig' %}

{% form_theme form '@SyliusShop/Form/theme.html.twig' %}

{% import '@SyliusUi/Macro/messages.html.twig' as messages %}

{% set header = 'sylius.ui.your_shopping_cart' %}

{% block title %}{{ header|trans }} | {{ parent() }}{% endblock %}
{% block beforeContent %}
    {% if not cart.empty %}
        {{ sylius_template_event('sylius.shop.cart.header', {'header': header, 'cart': cart}) }}
    {% endif %}
{% endblock %}
{% block content %}
    {% if not cart.empty %}
        <div class="row">
            <form method="post" action="{{ path('sylius_shop_cart_clear') }}" >
                <input type="hidden" name="_method" value="DELETE" />
                <input type="hidden" name="_csrf_token" value="{{ csrf_token(cart.id) }}" />
                <button type="submit" id="sylius-cart-clear" {{ sylius_test_html_attribute('cart-clear-button') }} class="btn btn-lg btn-line-fill btn-sm">
                    <i class="icon remove"></i> {{ 'sylius.ui.clear_cart'|trans }}
                </button>
            </form>
        </div>
        <div class="section">
            <div class="container">
            
                {{ sylius_template_event('sylius.shop.cart.items', {'cart': cart, 'form': form}) }}
                <div class="row">
                    <div class="col-12">
                        <div class="medium_divider"></div>
                        <div class="divider center_icon"><i class="ti-shopping-cart-full"></i></div>
                        <div class="medium_divider"></div>
                    </div>
                </div>
                {{ sylius_template_event('sylius.shop.cart.summary', {'cart': cart}) }}
            </div>
        </div>
        {{ sylius_template_event('sylius.shop.cart.suggestions', {'cart': cart}) }}
    {% else %}
        <div class="my-5">
            {{ messages.info('sylius.ui.your_cart_is_empty') }}
        </div>
    {% endif %}
{% endblock %}