<li>

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

    {% 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'] %}
    {% 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 %}

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

        <a href="{{ item.url }}">

            {% if (item_image is not empty) %}
                <img
                        src="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['large']['path'] }}/{{ item_image }}"
                        alt="{{ item.name }}"
                        width="740"
                        height="740"
                        loading="lazy"
                >

            {% else %}
                {{ item.name }}
            {% endif %}

        </a>

        {% if item_image_hover is not empty %}
            <div class="itemHoverImage">
                <a href="{{ item.url }}">

                    <img 
                            src="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['large']['path'] }}/{{ item.images[item['image_hover']]['name'] }}"
                            width="740"
                            height="740"
                            alt="{{ item.name }}"
                    />
                 </a>
            </div>
        {% endif %}

        {% if item.item_message is not empty %}
            <a href="{{ item.url }}">
                <div class="itemImageMessageWrap {{ item.item_message_type }}">
                    <div class="itemImageMessage">
                        {{ item.item_message }}
                    </div>
                </div>
            </a>
        {% endif %}

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

    <div class="innerTextBox">

        <h2>
            <a href="{{ item.url }}">
                {{ item.name }}
            </a>
        </h2>

        <div class="itemPriceWrap">
            <a href="{{ item.url }}">

                {% if settings.QUICK_ADDTOBASKET == true and item.price > 0 and item.sizes|length > 1 %}
                    <div class="priceStandard">From {{ item.price|multi_currency|raw }}</div>
                {% else %}
                    {% if item.sale_price > 0 %}
                        <div class="priceNow"><span>Save {{ item.percentage_off }}%</span> Now {{ item.sale_price|multi_currency|raw }}</div>
                        <div class="priceWas">Was {{ item.price|multi_currency|raw }}</div>
                    {% else %}
                        <div class="priceStandard">{{ item.price|multi_currency|raw }}</div>
                    {% endif %}
                {% endif %}

            </a>

        </div>

    </div>

    <a href="{{ item.url }}" class="button">View Item</a>

{#
    {% if settings.QUICK_ADDTOBASKET == true %}
        <div class="buttonGroup">
            <a href="{{ item.url }}" class="button">View Item</a>
            <button class="button buttonAlt js_quickAdd">Quick Buy</button>
        </div>
        {% include 'shop/item/quick_addtobasket.twig' %}
    {% endif %}
#}

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

</li>
