{% load reviews_tags %}
{% load thumbnail %}
{% load i18n %}
{% load display_tags %}
{% load staticfiles %}

{% block product %}
    <article data-product-id="{{ product.pk }}" class="card product-card shadow-sm gift-sets-card text-center">
        <div class="card-header">
            {% block product_title %}
                <h3><a href="{{ product.get_absolute_url }}"
                       title="{{ product.get_title }}">{{ product.get_title }}</a></h3>
            {% endblock %}
            <small>{{ product.attr.model }}</small>
        </div>
        <div class="card-img">
            {% block product_image %}
                <div class="image_container">
                    {% with image=product.primary_image %}
                        {% thumbnail image.original "450x450" upscale=False as thumb %}
                            <a href="{{ product.get_absolute_url }}"><img src="{{ thumb.url }}"
                                                                          alt="{{ product.get_title }}"
                                                                          class="thumbnail img-fluid"></a>
                        {% empty %}

                        {% endthumbnail %}
                    {% endwith %}
                </div>
            {% endblock %}
        </div>
        <div class="card-body">
            <div class="row flex-row">
                <div class="col-12 text-center">
                    {% block product_price %}
                        <div class="product_price mb-2">
                            {% include "catalogue/partials/stock_record.html" %} (Fee P&P)
                        </div>
                        <a href="{{ product.get_absolute_url }}" class="btn btn-primary btn-hook">More info</a>
                    {% endblock %}
                </div>
            </div>
        </div>
    </article>
    <div class="space-2"></div>
{% endblock %}