{% set productUrl = seoUrl('frontend.detail.page', { productId: page.product.id }) %}
{% set productImage = page.product.cover.media.url %}
{% set productName = page.product.translated.name %}

{% if socialShareActive %}
	<ul class="bc-social-icon">
		{% if theme_config('theme-product-detail-socialshare-facebook') %}
			<li class="li-social ">
				<a href="https://www.facebook.com/sharer/sharer.php?u={{ productUrl }}" title="Facebook" aria-label="Facebook" target="_blank" rel="noopener noreferrer">
					<img src="{{ asset( '/storefront/assets/images/icons/social/facebook.svg','@BrandCrockAquaTheme' ) }}" alt="Facebook" width="10" height="20">
				</a>
			</li>
		{% endif %}
		{% if theme_config('theme-product-detail-socialshare-whatsapp') %}
			<li class="li-social ">
				<a href="https://api.whatsapp.com/send?text={{ page.product.translated.name }}%20{{ productUrl }}" title="WhatsApp" aria-label="WhatsApp" target="_blank" rel="noopener noreferrer">
					<img src="{{ asset( '/storefront/assets/images/icons/social/whatsapp.svg','@BrandCrockAquaTheme' ) }}" alt="WhatsApp" width="10" height="20">
				</a>
			</li>
		{% endif %}
		{% if theme_config('theme-product-detail-socialshare-instagram') %}
			<li class="li-social ">
				<a href="https://www.instagram.com/" title="Instagram" aria-label="Instagram" target="_blank" rel="noopener noreferrer">
					<img src="{{ asset( '/storefront/assets/images/icons/social/instagram.svg','@BrandCrockAquaTheme' ) }}" alt="Instagram" width="10" height="20">
				</a>
			</li>
		{% endif %}
		{% if theme_config('theme-product-detail-socialshare-twitter') %}
			<li class="li-social ">
				<a href="https://twitter.com/intent/tweet?text={{ page.product.translated.name }}&url={{ productUrl }}" title="Twitter" aria-label="Twitter" target="_blank" rel="noopener noreferrer">
					<img src="{{ asset( '/storefront/assets/images/icons/social/twitter.svg','@BrandCrockAquaTheme' ) }}" alt="Twitter" width="10" height="20">
				</a>
			</li>
		{% endif %}
		{% if theme_config('theme-product-detail-socialshare-pinterest') %}
			<li class="li-social ">
				<a href="https://pinterest.com/pin/create/button/?url={{ productUrl }}&media={{ productImage }}&description={{ productName }}" title="Pinterest" aria-label="Pinterest" target="_blank" rel="noopener noreferrer">
					<img src="{{ asset( '/storefront/assets/images/icons/social/pinterest.svg','@BrandCrockAquaTheme' ) }}" alt="Pinterest" width="10" height="20">
				</a>
			</li>
		{% endif %}
	</ul>
{% endif %}
