{% import "main/common/Macro/money.html.twig" as money %}

<div class="box box-products">
    <div class="box-title">
        <h4>{{ "order.cart.index.product_box.title"|trans }}</h4>
    </div>
    <div class="box-content">
        <table class="table table-cart table-mobile">
            <thead>
            <tr>
                <th>{{ "order.cart.index.product_box.table.product"|trans }}</th>
                <th>{{ "order.cart.index.product_box.table.price"|trans }}</th>
                <th>{{ "order.cart.index.product_box.table.qty"|trans }}</th>
                <th>{{ "order.cart.index.product_box.table.total"|trans }}</th>
                <th></th>
            </tr>
            </thead>

            <tbody>
            {% import "main/common/Macro/productVariantValues.html.twig" as productVariantValue %}

            {% for cart in carts %}

                {% set product = cart.product %}
                {% set productLang = getProductLang({'product':product}) %}
                {% set detailLink = path('main_product_show',{'id':product.id|default,'alias':productLang.alias|default}) %}
                {% set productVariant   = cart.productVariant %}
                {% set productPricing   = getProductPricing({'productVariant':productVariant}) %}
                {% set productPrice     = productPricing.salesPrice %}


                {% set price = cart.qty * productPrice|default("0") %}
                <tr data-cart="{{ cart.id }}">
                    <td class="product-col">
                        <div class="product">
                            <figure class="product-media">
                                <a href="#">
                                    {% set productImage = product.productImages|first|default %}
                                    {% if productImage %}
                                        {% set dir = getProductImageDir(product|default) %}
                                        {% set imageFullPath=  dir|default~productImage.filename|default %}
                                        <img src="{{ imageFullPath|imagine_filter('thumb',{"thumbnail": {"size": [400,400] }}) }}">
                                    {% endif %}
                                </a>
                            </figure>

                            <h3 class="product-title">

                                <a href="{{ detailLink }}">{{ productLang.name|default }}</a>
                                {{ productVariantValue.info(productVariant) }}


                            </h3><!-- End .product-title -->
                        </div><!-- End .product -->
                    </td>
                    <td class="price-col text-truncate">{{ money.convertAndFormat(productPrice|default) }} </td>
                    <td class="quantity-col">
                        <div class="cart-product-quantity">
                            <input type="number" name="qty[{{ cart.id }}]" class="form-control qty cart-qty"
                                   value="{{ cart.qty|default("0") }}" min="1" step="1" data-decimals="0" required>
                        </div><!-- End .cart-product-quantity -->
                    </td>
                    <td class="total-col text-truncate">{{ money.convertAndFormat(price|default) }} </td>
                    <td class="remove-col">
                        <button class="btn-remove">
                            {#<i class="fas fa-trash"></i>#}
                            x
                        </button>
                    </td>
                </tr>
            {% endfor %}
            </tbody>
        </table>
    </div>
</div>