<script type="text/javascript" src="%%GLOBAL_AppPath%%/javascript/jquery/plugins/jCarousel/jCarousel.js?%%GLOBAL_JSCacheToken%%"></script>
<script type="text/javascript" src="%%GLOBAL_AppPath%%/javascript/jquery.cookie.min.js"></script>
%%GLOBAL_ProductDetailFlashMessages%%
<script type="text/javascript">
	var ProductThumbWidth = '';
	var productId = %%GLOBAL_ProductId%%;
</script>
%%Discount.FreeShippingEligibility%%
<div class="product-view row">
	<div class="left-content-product col-lg-12 col-xs-12">
		<div class="row">
			<div class="content-product-left col-sm-6 col-xs-12">
				<div id="thumb-slider" class="thumb-vertical-outer">
					<span class="btn-more prev-thumb nt"><i class="fa fa-angle-up"></i></span>
					<span class="btn-more next-thumb nt"><i class="fa fa-angle-down"></i></span>
					<ul class="thumb-vertical">
						%%SNIPPET_ProductTinyImages%%
					</ul>
				</div>
				%%SNIPPET_ProductThumbImage%%
			</div>
			<div class="content-product-right col-sm-6 col-xs-12">
				<div class="title-product">
					<h1>%%GLOBAL_ProductName%%</h1>
					%%SNIPPET_ProductExpectedReleaseDate%%
					<span itemscope itemtype="https://schema.org/Product">
						<meta itemprop="sku" content="%%GLOBAL_SKU%%">
						<meta itemprop="mpn" content="%%GLOBAL_SKU%%">
						<meta itemprop="name" content="%%GLOBAL_ProductName%%">
						<meta itemprop="brand" content="%%GLOBAL_BrandName%%">
						<span itemprop="offers" itemscope itemtype="https://schema.org/Offer">
							<meta itemprop="priceCurrency" content="BRL"/>
							<meta itemprop="price" content="%%GLOBAL_preco%%">
							<link itemprop="itemCondition" href="https://schema.org/NewCondition"/>
							<link itemprop="availability" href="https://schema.org/InStock"/>
						</span>
					</span>
				</div>

				
				%%GLOBAL_FacebookLikeButtonAbove%%
				%%GLOBAL_FacebookLikeButtonBelow%%


				<div class="product-label form-group" style="display: %%GLOBAL_sslogado%%">
					<div class="product_page_price price" itemprop="offerDetails" itemscope="" itemtype="https://data-vocabulary.org/Offer">
						<span style="display: %%GLOBAL_HideCondition%%"><button type="button" class="btn btn-danger">%%GLOBAL_ProductCondition%%</button></span>
						<span class="price-new VariationProductPrice" itemprop="price">%%GLOBAL_ProductPrice%%</span>
						<span class="price-old" style="display: %%GLOBAL_Hidetextode%%">%%GLOBAL_RetailPrice%%</span>

						%%GLOBAL_ProZ%%
						%%GLOBAL_SchemaEstoque%%
						%%GLOBAL_ProdBoleto%%
					</div>

					<div class="stock" style="display: %%GLOBAL_HideAvailability%%"><span>Disponibilidade:</span> <span class="status-stock">%%GLOBAL_Availability%%</span></div>
				</div>

				<div style="display: %%GLOBAL_ocultfreteimg%%">
					%%GLOBAL_fretegratis%%
				</div>

				<div class="product-box-desc">
					<div class="inner-box-desc">
						<div class="brand" style="display: %%GLOBAL_HideBrandLink%%"><span>Fabricante:</span> <a href="%%GLOBAL_BrandLink%%">%%GLOBAL_BrandName%%</a></div>
						<div class="model" style="display: %%GLOBAL_HideSKU%%"><span>C&oacute;digo:</span> %%GLOBAL_SKU%%</div>
						<div class="model" style="%%GLOBAL_HideMinQty%%"><span>%%LNG_ProductMinQty%%:</span> %%GLOBAL_MinQty%% %%LNG_units%%</div>
						<div class="model" style="%%GLOBAL_HideMaxQty%%"><span>%%LNG_ProductMaxQty%%:</span> %%GLOBAL_MaxQty%% %%LNG_units%%</div>
					</div>
				</div>

				%%SNIPPET_ProductAddToCart%%

				<a style="display: %%GLOBAL_Hideorc%%" href="%%GLOBAL_ShopPath%%/remote.php?w=orcamento&id=%%GLOBAL_ProductId%%" data-toggle="modal" data-target="#orcamento" class="btn btn-primary"> <i class="fa fa-check-square-o fa-1x"></i> %%GLOBAL_btorcar%%</a>

				<div style="display: %%GLOBAL_Hidefretegratis%%">
					<hr>
					<div style="display: %%GLOBAL_HideShipping%%">
						%%Panel.QuoteFrete%%
					</div>
				</div>

			</div>
		</div>
	</div>
</div>
<div class="modal fade" id="orcamento" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
	<div class="modal-dialog" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
				<h4 class="modal-title" id="myModalLabel">Carregando ...</h4>
			</div>
			<div class="modal-body">
			</div>
		</div>
	</div>
</div>


<script type="text/javascript">
	$(document).ready(function() {
		var zoomCollection = '.large-image img';
		$( zoomCollection ).elevateZoom({
			zoomType    : "inner",
			lensSize    :"200",
			easing:true,
			gallery:'thumb-slider',
			cursor: 'pointer',
			loadingIcon: '%%GLOBAL_TPL_PATH%%/Assets/image/theme/lazy-loader.gif',
			galleryActiveClass: "active"
		});

		$("#thumb-slider-vertical .owl2-item").each(function() {
			$(this).find("[data-index='0']").addClass('active');
		});

		$(".thumb-vertical-outer .next-thumb").click(function () {
			$( ".thumb-vertical-outer .lSNext" ).trigger( "click" );
		});

		$(".thumb-vertical-outer .prev-thumb").click(function () {
			$( ".thumb-vertical-outer .lSPrev" ).trigger( "click" );
		});

		$(".thumb-vertical-outer .thumb-vertical").lightSlider({
			item: 3,
			autoWidth: false,
			vertical:true,
			slideMargin: 15,
			verticalHeight:340,
			pager: false,
			controls: true,
			prevHtml: '<i class="fa fa-angle-up"></i>',
			nextHtml: '<i class="fa fa-angle-down"></i>',
			responsive: [
			{
				breakpoint: 1199,
				settings: {
					verticalHeight: 330,
					item: 3,
				}
			},

			{
				breakpoint: 1024,
				settings: {
					verticalHeight: 235,
					item: 2,
					slideMargin: 5,
				}
			},

			{
				breakpoint: 768,
				settings: {
					verticalHeight: 340,
					item: 3,
				}
			},

			{
				breakpoint: 480,
				settings: {
					verticalHeight: 100,
					item: 1,
				}
			}
			]
		});
	});
</script>