{% import "@SyliusShop/Common/Macro/money.html.twig" as money %}

{% set items_subtotal = sylius_order_items_subtotal(order) %}
{% set tax_included = sylius_order_tax_included(order) %}
{% set tax_excluded = sylius_order_tax_excluded(order) %}

<div class="card card-body bg-gray-50" id="sylius-checkout-subtotal" {{ sylius_test_html_attribute('checkout-subtotal') }}>
    <ul class="list-style-none mb-0 p-0">
        {% for item in order.items %}
            {% set variant = item.variant %}
            {% set product = variant.product %}

            <li class="grid align-items-center gap-2 py-2 border-bottom border-light">
                <div class="g-col-2">{% include '@SyliusShop/Product/_mainImage.html.twig' with {product, filter: 'sylius_shop_product_tiny_thumbnail'} %}</div>
                <div class="g-col-7 d-flex flex-column justify-content-center">
                    <b class="fw-medium small">{{ item.getVariant.product.name }}</b>
                    <div class="mt-1 small">
						<span class="">{{ item.quantity }}
							x
						</span>
                        <span class="fw-medium">{{ money.convertAndFormat(item.unitPrice) }}</span>
                    </div>
                </div>
                <div class="g-col-3 text-end" id="sylius-item-{{ item.variant.product.slug }}-subtotal" {{ sylius_test_html_attribute('item-subtotal', item.variant.product.slug) }}>
                    {{ money.convertAndFormat(item.subtotal) }}
                </div>
            </li>
        {% endfor %}

        <div class="d-flex flex-wrap justify-content-between py-2 fw-medium">
            <span>{{ 'sylius.ui.items_total'|trans }}:</span>
            <strong>{{ money.convertAndFormat(items_subtotal) }}</strong>
        </div>

        <div class="d-flex flex-wrap justify-content-between py-2 fw-medium">
            <span>{{ 'sylius.ui.taxes_total'|trans }}:</span>
            {% if not tax_included and not tax_excluded %}
                <div id="sylius-summary-tax-none">{{ money.convertAndFormat(0) }}</div>
            {% endif %}
            {% if tax_excluded %}
                <div id="sylius-summary-tax-excluded">{{ money.convertAndFormat(tax_excluded) }}</div>
            {% endif %}
            {% if tax_included %}
                <div>
                    <small>({{ 'sylius.ui.included_in_price'|trans }})</small>
                    <span id="sylius-summary-tax-included">{{ money.convertAndFormat(tax_included) }}</span>
                </div>
            {% endif %}
        </div>

        <div class="d-flex flex-wrap justify-content-between py-2 fw-medium">
            <span>{{ 'sylius.ui.discount'|trans }}:</span>
            <strong id="sylius-summary-promotion-total">{{ money.convertAndFormat(order.orderPromotionTotal) }}</strong>
        </div>

        <div class="d-flex flex-wrap justify-content-between py-2 fw-medium">
            <span>{{ 'sylius.ui.shipping_estimated_cost'|trans }}:</span>
            <strong>
                {% if order.getAdjustmentsTotal('shipping') > order.shippingTotal %}
                    <small>
                        <s>{{ money.convertAndFormat(order.getAdjustmentsTotal('shipping')) }}</s>
                    </small>
                {% endif %}
                <span id="sylius-summary-shipping-total">{{ money.convertAndFormat(order.shippingTotal) }}</span>
            </strong>
        </div>

        <div class="d-flex flex-wrap justify-content-between py-2 fw-medium h4 mb-0">
            <span>{{ 'sylius.ui.total'|trans }}:</span>
            <strong id="sylius-summary-grand-total">{{ money.convertAndFormat(order.total) }}</strong>
        </div>
    </ul>
</div>