{% if specials %}
	{% for special in specials %}
		<div class="{{ special.content }} card-aqui">
			<div class="itembox content-box rel paper">
				<div class="itembox-container clearfix {{ class_actions_one_line }}">
					<div>
						{% if special.image %}
							<a
								href="{{ special.href }}" title="{{ special.description }}" class="itembox-image-link">
								<!-- O estilo inline foi utilizado porque o valor tem que vir do php -->
								<div class="container-img" {{ special.ratio }}>
									{% if efeitoimg == constant('Type_EfeitoImagem::Tp_Padrao') %}
										<picture>
											<source class="load-image" srcset="" data-src="{{ special.image.webp }}">
											<img class="load-image" src="" data-src="{{ special.image.jpg }}" alt="{{ special.description }}">
										</picture>
									{% else %}
										<picture>
											<source class="load-image" srcset="" data-src="{{ special.image.webp }}">
											<img class="itembox-primary-image load-image" src="" data-src="{{ special.image.jpg }}" alt="{{ special.description }}">
										</picture>
										<picture>
											<source class="load-image" srcset="" data-src="{{ special.image_extra.webp }}">
											<img class="itembox-secondary-image load-image" src="" data-src="{{ special.image_extra.jpg }}" alt="{{ special.description }}">
										</picture>
									{% endif %}
								</div>
							</a>
						{% else %}
							<a href="{{ special.href }}" title="{{ special.description }}" class="itembox-image-link">
								<div class="container-img" {{ special.ratio }}>
									<picture>
										<source class="load-image" srcset="" data-src="{{ special.image.webp }}">
										<img class="itembox-primary-image load-image" data-src="https://placehold.co/300x260?text=sem+imagem" alt="{{ special.description }}">
									</picture>
								</div>
							</a>
						{% endif %}
					</div>
					<div class="itembox-content">
						<div class="itembox-inner">
							<h3 class="itembox-title font-family-header">
								<a class="product-name" href="{{ special.href }}" title="{{ special.description }}">
									{{ special.description }}
								</a>
							</h3>
						</div>
						<button type="button" data-special-href="{{ special.href }}" class="btn-default btn-medium-square js-btn-special">
							<span>Ver Produtos</span>
						</button>
					</div>
				</div>
			</div>
		</div>
	{% endfor %}
{% else %}
	<div class="col-xs">
		<span class="text-medium">{{ text_empty }}</span>
	</div>
{% endif %}

<script type="text/javascript">
	window.waitEvent('scripts_document', function () {
		$('.js-btn-special').on('click', function () {
			location.href = $(this).data('special-href');
		});
	});
</script>