{% if products %}
  <div class="flex flex-row nowrap-xs">
    <a class="btn-default btn-medium btn-full btn-outline right-margin-x-small" href="{{ cart }}">
      <span>{{ text_cart }}</span>
    </a>
    <a class="btn-default btn-medium btn-full btn-proceed-checkout left-margin-x-small" href="{{ checkout }}">
      <span>{{ text_checkout }}</span>
    </a>
  </div>
  {% for product in products %}
    <a href="{{ product.href }}" class="flex flex-row middle-xs nowrap-xs top-margin-large">
      <div class="flex-auto right-margin-medium">
        <div style="width:40px;height:40px;">
          {% if product.thumb %}
            <img src="{{ product.thumb }}" alt="{{ product.name }}" title="{{ product.name }}" width="40" height="40" class="visible-block"/>
          {% endif %}
        </div>
      </div>
      <div class="flex-1 text-ellipsis">
        <span class="visible-block text-medium text-bold text-ellipsis bottom-margin-x-small">{{ product.name }}</span>
        <span class="text-small text-gray">Quantidade</span>
        <span class="text-small text-bold text-dark right-margin-x-small">{{ product.quantity }}</span>
        {% if product.isListaEscolar %}
          <span class="text-small text-gray">Origem</span>
          <span class="text-small text-bold text-dark right-margin-x-small">Lista Escolar</span>
        {% endif %}
      </div>
    </a>
  {% endfor %}
  {% if itens_cart_restantes %}
  <a href="{{ cart }}" class="visible-block text-small text-center vertical-padding-small top-margin-medium">
    <span>+{{ itens_cart_restantes }} produtos no carrinho</span>
  </a>
  {% endif %}
{% else %}
  <span class="text-medium text-bold text-dark visible-block text-center">{{ text_empty }}</span>
{% endif %}