
<li class="itemMedium">

    {% set item_image = placeholder_images.item_small.value %}
    {% set item_image_hover = "" %}
    {% set image_alt = item.name %}

    {% if external_image is not empty %}
        {% set item_image = item.image %}
        {% set item_image_hover = "" %}
        {% set image_alt = item.alt %}
    {% endif %}

    {% if item.images is not empty and item.images[item.image_default]['name'] is not empty %}
        {% set item_image = item.images[item.image_default]['name'] %}
        {% set image_alt = item.images[item.image_default]['alt'] %}
    {% endif %}

    {# Set hover image if applicable #}
    {% if item.images is not empty
        and item.images[item.image_hover]['name'] is not empty
        and item.image_default != item.image_hover
        and settings.ITEM_PREVIEW_HOVER_IMAGE == true
    %}
        {% set item_image_hover = item.images[item.image_hover]['name'] %}
    {% endif %}

    {% set main_item_link = item.url %}

    {% if assessment_completed is empty and item.item_assessment_complete is empty and item.product_type == 'doctor' %}

        {% set requires_assessment = true %}


        {% set alt_button_text = 'More info' %}

    {% endif %}

    <div class="innerItem">

        <a href="{{ main_item_link }}" class="cardTop">

            <div class="itemHeader">

                <div class="itemImageWrap{% if item_image_hover is not empty %} hasHoverImage{% endif %}{% if (item_image is empty) %} noImage{% endif %}">

                    <div class="innerImage">
                        {% if (item_image is not empty) %}
                            <img src="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['thumbs']['path'] }}/{{ item_image }}"
                                 alt="{{ image_alt ?: item.name }}"/>
                        {% else %}
                            <img src="{{ settings.THEME_URL }}/images/placeholders/no-image.jpg" />
                        {% endif %}
                    </div> <!-- .innerImage -->

                </div> <!-- .itemImageWrap -->

                <div class="innerTextBox">

                    <h2>
                        {{ item.name }}
                    </h2>

                    <h4>{{ item.main_category }}</h4>

                </div><!-- .innerTextBox -->

            </div> <!-- .itemHeader -->

            <div class="itemBody {% if show_footer is empty %} noBottomPadding{% endif %}">

                <div class="itemPrices">
                    {% include 'shop/item/partials/item_price_small.twig' with {
                        use_from_price: true
                    }%}
                </div> <!-- .itemPrices -->


                <div class="itemCTA">
                    <button type="button" class="button buttonOutlined">
                        {% if alt_button_text is empty %}
                            View product
                        {% else %}
                            {{ alt_button_text }}
                        {% endif %}
                    </button>
                </div> <!-- .itemCTA -->


            </div> <!-- .itemBody -->

        </a> <!-- .innerItem -->


        {{ hooks_do_action('item_small_end', item) }}

    </div> <!-- .innerItem -->


</li>
