{% load history_tags %}
{% load basket_tags %}
{% load currency_filters %}
{% load thumbnail %}
{% load i18n %}
{% load staticfiles %}

<div class="side-menu-header bg-primary p-3 text-center open-shop">
    <h1 class="m-0 text-white">{% trans "Basket" %}</h1>
    <div class="close-shop">
        <i class="far fa-chevron-left"></i>
    </div>
</div>
{% if request.basket.num_lines %}
<ul class="basket-mini-items nav flex-column flex-nowrap">
    {% for line in request.basket.all_lines %}
        <li class="nav-item product-line">
            <div class="row">
                <div class="col-4">
                    <div class="image_container">
                        {% with image=line.product.primary_image %}
                            {% thumbnail image.original "100x100" upscale=False as thumb %}
                            <a href="{{ line.product.get_absolute_url }}"><img class="thumbnail" src="{{ thumb.url }}" alt="{{ line.product.get_title }}"></a>
                            {% endthumbnail %}
                        {% endwith %}
                    </div>
                </div>
                <div class="col-8">
                    <strong class="d-block"><a href="{{ line.product.get_absolute_url }}">{{ line.description }}</a></strong>
                    <span class="text-muted d-block"><small>{% trans 'Quantity' %}: {{ line.quantity }}</small> </span>
                    <div class="product_options text-muted {% if line.attributes.all %}py-1{% endif %}">
                    {% for option in line.attributes.all %}
                        <small class="d-block"><b class="pr-1">{{ option.option }}:</b>{{ option.display_value }}</small>
                    {% endfor %}
                    </div>
                    {% if request.basket.is_tax_known %}
                    <b class="d-block mt-1">{{ line.unit_price_incl_tax|currency:request.basket.currency }}</b>
                    {% else %}
                    <b class="d-block mt-1">{{ line.unit_price_excl_tax|currency:request.basket.currency }}</b>
                    {% endif %}
                </div>
            </div>
        </li>
    {% endfor %}
</ul>
<div class="form-group form-actions basket-bottom">
     <div class="text-center py-3 border-bottom">{% blocktrans with amount=request.basket.num_items count counter=request.basket.num_items %}You have <small class="badge bg-primary text-white">{{ amount }}</small> item in your basket.{% plural %}You have <small class="badge bg-primary text-white">{{ amount }}</small> items in your basket.{% endblocktrans %}</div>

    <div class="basket_totals p-3 text-center">
        {% if request.basket.offer_discounts or request.basket.grouped_voucher_discounts %}
            <p class="mb-1">{% trans "Discount" %}: {{ basket.total_discount|currency:basket.currency }}</p>
        {% endif %}
        {% if request.basket.is_tax_known %}
            <p class="m-0">{% trans "Total:" %} {{ request.basket.total_incl_tax|currency:request.basket.currency }}</p> 
        {% else %}
            <p class="m-0">{% trans "Total:" %} {{ request.basket.total_excl_tax|currency:request.basket.currency }}</p> 
        {% endif %}
    </div>
    <div class="p-3">
        <div class="row">
            <div class="col-sm-6">
                <a href="{% url 'basket:summary' %}" class="btn btn-default btn-sm btn-block">{% trans "View basket" %}</a>
            </div>
            <div class="col-sm-6">
                <a href="{% url 'checkout:index' %}" class="btn btn-primary btn-sm btn-block"><i class="icon-shopping-cart"></i> {% trans "Checkout" %}</a>
            </div>
        </div>
    </div>
</div>
{% else %}
    <div class="p-3 text-center"><p>{% trans "Your basket is empty." %}</p></div>
{% endif %}