{default_translation_domain domain='fo.default'}
{loop type="product" name="add_product_to_cart" id={product attr="id"}}
<div class="clearfix">
        <table>
            <tr>
                <td class="col-md-4">
                    {loop name="product_thumbnail" type="image" product=$ID width="218" height="146" resize_mode="borders" limit="1"}
                        <img itemprop="image" src="{$IMAGE_URL}" alt="Product #{$LOOP_COUNT}">
                    {/loop}
                </td>
                <td class="col-md-4">
                    <h2>{$TITLE}</h2>
                    {loop type="attribute_combination" name="product_options" product_sale_elements="$PRODUCT_SALE_ELEMENTS_ID"}
                        <p>{$ATTRIBUTE_TITLE}</p>
                        <p>{$ATTRIBUTE_AVAILABILITY_TITLE}</p>
                    {/loop}
                </td>
                <td class="col-md-4">

                    {if $IS_PROMO == 1}
                        {assign "real_price" $TAXED_PROMO_PRICE}
                        <div class="special-price"><span class="price">{$TAXED_PROMO_PRICE} {currency attr="symbol"}</span></div>
                        <small class="old-price"> <span class="price">{$TAXED_PRICE} {currency attr="symbol"}</span></small>
                    {else}
                        {assign "real_price" $TAXED_PRICE}
                        <div class="special-price"><span class="price">{$TAXED_PRICE} {currency attr="symbol"}</span></div>
                    {/if}

                </td>
            </tr>
        </table>
    <a href="{url path="/cart"}" role="button" class="btn btn_add_to_cart pull-right"><span>{intl l="View Cart"}</span></a>
    <button type="button" class="btn btn-checkout pull-right" data-dismiss="modal"><span>{intl l="Continue Shopping"}</span></button>
</div>
{ifloop rel="accessories"}
    <aside id="products-upsell" role="complementary" aria-labelledby="products-upsell-label">
        <div class="products-heading">
            <h3 id="products-upsell-label">{intl l="Upsell Products"}</h3>
        </div>
        <div class="products-content">
            <ul class="products-grid product-col-3 hover-effect">
                {loop type="accessory" name="accessories" product="$ID" order="random" limit="3"}
                    {include file="includes/single-product.html" product_id=$ACCESSORY_ID hasBtn=false hasDescription=false width="218" height="146"}
                {/loop}
            </ul>
        </div>
    </aside><!-- #products-upsell -->
{/ifloop}
{/loop}