{% load reviews_tags thumbnail i18n display_tags staticfiles loyalty_tags %}

{% block product %}
    <article data-product-id="{{ product.pk }}" class="card product-card shadow text-center mb-5">
        <div class="card-header">
            {% block product_title %}
                <h3>
                    <a href="{{ product.get_absolute_url }}" title="{{ product.get_title }}">{{ product.get_title }}</a>
                </h3>
            {% endblock %}
        </div>
        <div class="card-img card-img-top">
            {% block product_image %}
                <div class="image_container">
                    {% with image=product.primary_image %}
                        {% thumbnail image.original "x600" upscale=False as thumb %}
                            <a href="{{ product.get_absolute_url }}"><img src="{{ thumb.url }}"
                                                                          alt="{{ product.get_title }}"
                                                                          class="thumbnail img-fluid"></a>
                        {% endthumbnail %}
                    {% endwith %}
                </div>
            {% endblock %}
        </div>
        <div class="card-body">
            <div class="row flex-row">
                <div class="col-6 d-flex align-self-center">
                    {% block product_price %}
                        <div class="product_price">
                            {% include "catalogue/partials/stock_record.html" %}
                            {% if total_point >= product.attr.points_required %}
                                {% if not product.is_parent and not product.has_options %}
                                    {% include "catalogue/partials/add_to_basket_form_compact.html" %}
                                {% else %}
                                    <a href="{{ product.get_absolute_url }}" class="btn btn-primary shadow-sm">More
                                        info</a>
                                {% endif %}
                            {% else %}
                                <strong>{{ product.attr.points_required }}</strong> Beanie points required
                            {% endif %}
                        </div>
                    {% endblock %}
                </div>
            </div>
        </div>
    </article>
{% endblock %}