{{ header }} {% set col = column_left ? 9 : 12 %} {% set col = column_right ? col - 3 : col %}
<!-- Main :: Start-->
<main class="main">
	<!-- Breadcrumbs :: Start-->
	<div class="breadcrumbs">
	  <div class="container-fluid">
		<h1 class="breadcrumbs__title">{{ heading_title }}</h1>
		<ul class="breadcrumbs__menu">
		{% for i,breadcrumb in breadcrumbs %}
			{% if (i + 1 < breadcrumbs|length) %} 
			<li><a class="breadcrumbs__link" href="{{ breadcrumb.href }}"><span>{{ breadcrumb.text }}</span></a></li>
			{% else %} 
			<li>{{ breadcrumb.text }}</li>
			{% endif %}
		{% endfor %}
		</ul>
	  </div>
	</div>
	<!-- Breadcrumbs :: End-->
	{{ content_top }}
	<div class="row">
	{{ column_left }}
	<div class="col-xl-{{ col }}">
		<!-- Article :: Start-->
		<div class="article">
			<div class="container-fluid">
				{% if blog_background %}
				<div class="article__head">
					<div class="article__image">
						<img src="{{ image }}" alt="{{ heading_title }}" width="1500" height="1000">
					</div>
					{% if (tags is not empty) %}
					<ul class="article__tags">
						{% for tag in tags %}
						<li>
							<a href="{{ tag.href }}" class="article__tags-item ui-btn ui-btn--35 ui-btn--transparent">#{{ tag.title }}</a>
						</li>
						{% endfor %}
					</ul>
					{% endif %}
					<ul class="article__info">
						<li>
							<span class="article__info-item">
								<svg class="icon-views"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-views"></use>
								</svg>{{ viewed }}
							</span>
						</li>
						<li>
							<span class="article__info-item">
								<svg class="icon-comments"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-comments"></use>
								</svg>{{ totalComments }}
							</span>
						</li>
						<li>
							<span class="article__info-item">
								<svg class="icon-dot"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-dot"></use>
								</svg>{{ date_added }}
							</span>
						</li>
					</ul>
					{% if soc_share_blog %}
					<div class="article__share">
						<a class="ui-btn ui-btn--35 ui-btn--transparent js-share" href="#">{{ text_prostore_share }}<svg class="icon-share"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-share"></use>
							</svg>
						</a>
					</div>
					{% endif %}
				</div>
				{% endif %}
				
				<div class="article__body">
					<div class="row">
						<div class="col-xl-7 offset-xl-2">
							<div class="editor article__body--blog">
								{{ description }}
								{% if not blog_background %}<p>{{ text_tags }}
									{% if (tags is not empty) %}
										{% for i,tag in tags %}
											<a href="{{ tag.href }}">#{{ tag.title }}</a>{% if (i + 1 < tags|length) %},{% endif %}
										{% endfor %}
									{% endif %}</p>
								{% endif %}
							</div>
						</div>
					</div>
				</div>
				<div class="article__foot">
					<div class="row">
						<div class="col-xl-8 offset-xl-2">
							<div class="row row-gutter-10">
								{% if soc_share_blog %}
								<div class="col">
									<a class="ui-btn ui-btn--40 ui-btn--primary js-share" href="#">{{ text_prostore_share }}<svg class="icon-share"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-share"></use>
										</svg>
									</a>
								</div>
								{% endif %}
								<div class="col-auto">
									<span class="ui-mark">
										<svg class="icon-views"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-views"></use>
										</svg>{{ viewed }}
									</span>
								</div>
								<div class="col-auto is-xl-visible">
									<span class="ui-mark">
										<svg class="icon-comments"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-comments"></use>
										</svg>{{ totalComments }}
									</span>
								</div>
								<div class="col-auto is-xl-visible">
									<span class="ui-mark">
										{{ date_added }}
									</span>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div><!-- Article :: End-->
		{% if commenrtsenable %}
		<!-- Comments :: Start-->
		<div class="comments">
			<div class="container-fluid">
				<span class="h2 comments__title">{{ text_comments }} {% if totalComments > 0 %}<sup class="comments__counter">{{ totalComments }}</sup>{% endif %}
				</span>
				<div class="comments__wrapper">
					<div class="comments__content">
						<ul class="comments__list">
							{% if (totalComments != 0) %}
							{% for comment in comments %}
							<li>
								<div class="comments__item">
									<div class="comments__item-head">
										<div class="row">
											<div class="col-auto">
												<span class="comments__item-letter">{{ comment.author|first }}</span>
											</div>
											<div class="col">
												<span class="comments__item-title">{{ comment.author }}</span>
												<span class="comments__item-date">{{ comment.date_added }}</span>
											</div>
										</div>
									</div>
									<div class="comments__item-body">
										<p>{{ comment.text }}</p>
									</div>
								</div>
							</li>
							{% endfor %}
							{% else %}
							<li>
								<div class="comments__item">
									{{ text_first_comment }}
								</div>
							</li>
							{% endif %}
						</ul>
					</div>
					<div class="comments__sidebar">
						<div class="comments__form js-toggle">
							<button class="comments__form-btn js-toggle-btn">{{ text_comment }}</button>
							<div class="comments__form-offcanvas js-toggle-offcanvas">
								<div class="comments__form-offcanvas-in">
									<div class="message"></div>
									<form id="form-comment">
										<span class="ui-legend">{{ text_comment }}</span>
										<label class="ui-label">{{ text_comment_name }}</label>
										<input class="ui-input" type="text" value="" name="name" placeholder="{{ text_comment_name }}">
										<label class="ui-label">{{ text_comment_text }}</label>
										<textarea name="text" class="ui-textarea" placeholder="{{ text_comment_text }}"></textarea>
										{{ captcha }}
										<input type="hidden"  name="blog_id" value="{{ blog_id }}">
										<button type="button" class="ui-btn ui-btn--primary ui-btn--fullwidth" data-loading-text="{{ text_loading }}" onclick="comment.add('{{ blog_id }}');">{{ text_comment_add }}</button>
										{% if text_prostore_pdata %} 
											<div class="prostore-pdata">{{ text_prostore_pdata }}</div>
										{% endif %} 
									</form>
								</div>
								<button class="comments__form-close js-toggle-btn">{{ text_close }}</button>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div><!-- Comments :: End-->
		{% endif %}
		{% if (blogs is not empty) %}
		<!-- Blog-featured :: Start-->
		<div class="blog-featured">
			<div class="container-fluid">
				<div class="row align-items-center">
					<div class="col-md">
						<span class="h2 blog-featured__title">{{ text_related }}</span>
					</div>
					<div class="col-md-auto is-md-visible">
						<div class="blog-featured__all">
							<a class="ui-link ui-link--blue" href="{{ blog_href }}">{{ text_all_blog }}<svg class="icon-arrow-link"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-arrow-link"></use>
								</svg>
							</a>
						</div>
					</div>
				</div>
				<div class="blog-featured__swiper">
					<div class="swiper-container swiper-blog js-swiper-blog">
						<div class="swiper-wrapper">
							{% for blog in blogs %}
							<div class="swiper-slide">
								<a class="blog-featured__item" href="{{ blog.href }}">
									<div class="blog-featured__item-image">
										<img src="{{ blog.thumb }}" alt="{{ blog.name }}" {% if lazyload %}loading="lazy"{% endif %}>
									</div>
									<span class="h3 blog-featured__item-title">
										<u>{{ blog.name }}</u>
									</span>
									<span class="blog-featured__item-date">{{ blog.date }}</span>
								</a>
							</div>
							{% endfor %}
						</div>
					</div>
				</div>
			</div>
		</div><!-- Blog-featured :: End-->
		{% endif %}
	</div>
	{{ column_right }}
	</div>
	{% if products %}
    <!-- Products :: Start.-->
	<div class="products-featured">
		<div class="container-fluid">
			<span class="h2 products-featured__title">{{ text_related_products }}</span>
			<div class="products-featured__swiper">
				<div class="swiper-container swiper-products {% if (mobile_view == 'grid-responsive') %}swiper-products--responsive{% endif %} js-swiper-products">
					<div class="swiper-wrapper">
					  {% for product in products %}
					  <div class="swiper-slide">
							<div class="products__item {% if (mobile_view == 'grid-responsive') %}products__item--responsive{% endif %} {% if (category_time and product.special and product.special_date_end) %}products__item--countdown{% endif %}">
								<div class="products__item-in">
									<div class="products__item-topleft">
										<div class="products__item-badges">
											{% if (product.isnewest) %}<span class="ui-badge ui-badge--blue">{{ labelsinfo.new.name[language_id] }}</span>{% endif %}
											{% if (product.special and product.sales) %}<span class="ui-badge ui-badge--red">{{ labelsinfo.sale.name[language_id] }}</span>{% endif %}
											{% if (product.popular) %}<span class="ui-badge ui-badge--orange">{{ product.popular }}</span>{% endif %}
											{% if (product.hit) %}<span class="ui-badge ui-badge--purple">{{ product.hit }}</span>{% endif %}
											{% if (product.nocatch) %}<span class="ui-badge">{{ product.catch }}</span>{% elseif product.catch %}<span class="ui-badge">{{ product.catch }}</span>{% endif %}
											{% if (product.reward) %}<span class="ui-badge ui-badge--transparent">{{ text_prostore_reward_short }} {{ product.reward }}</span>{% endif %}
										</div>
										{% if (product.rating != constant('false')) %}
										<span class="products__item-rating">{{ product.rating }} <svg class="icon-star"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-star"></use></svg>
										</span>
										{% endif %}
									</div>
									<div class="products__item-buttons">
										<button type="button" class="ui-btn ui-btn--compare {% if product.wish_compare_data.compare_data.is_in_compare %}is-active{% endif %}" title="{{ button_compare }}" data-action="compare" data-for="{{ product.product_id }}">
											<svg class="icon-compare{% if product.wish_compare_data.compare_data.is_in_compare %}-active{% endif %}">
												<use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-compare{% if product.wish_compare_data.compare_data.is_in_compare %}-active{% endif %}"></use>
											</svg>
										</button>
										<button type="button" class="ui-btn ui-btn--favorite {% if product.wish_compare_data.wish_data.is_in_wish %}is-active{% endif %}" title="{{ button_wishlist }}" data-action="wishlist" data-for="{{ product.product_id }}">
											<svg class="icon-favorites{% if product.wish_compare_data.wish_data.is_in_wish %}-active{% endif %}">
												<use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-favorites{% if product.wish_compare_data.wish_data.is_in_wish %}-active{% endif %}"></use>
											</svg>
										</button>
									</div>
									{% if product.images %}
									<a class="products__item-gallery" href="{{ product.href }}">
										<div class="products__item-image is-active">
											<img src="{{ product.thumb }}" alt="{{ product.name }}" width="{{ image_product_width }}" height="{{ image_product_height }}" {% if lazyload %}loading="lazy"{% endif %}>
										</div>
										{% for imageX in product.images %}
										<div class="products__item-image">
											<img data-src="{{ imageX }}" src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==" alt="{{ product.name }}" width="{{ image_product_width }}" height="{{ image_product_height }}" {% if lazyload %}loading="lazy"{% endif %}>
										</div>
										{% endfor %}
										<div class="products__item-pagination">
											<div class="products__item-bullet is-active"></div>
											{% for imageX in product.images %}
											<div class="products__item-bullet"></div>
											{% endfor %}
										</div>
									</a>
									{% else %}
									<a class="products__item-image" href="{{ product.href }}">
										<img src="{{ product.thumb }}" alt="{{ product.name }}" width="{{ image_product_width }}" height="{{ image_product_height }}" {% if lazyload %}loading="lazy"{% endif %}>
									</a>
									{% endif %}
									<span class="products__item-status {% if (product.quantity > 0) %}products__item-status--true{% else %}products__item-status--false{% endif %}">{{ product.stock }}</span>
									{% if product.manufacturer %}<span class="products__item-id">{{ product.manufacturer }}</span>{% endif %}
									<a class="products__item-title" href="{{ product.href }}">{{ product.name }}</a>
									{% if product.price %}
									<p class="products__item-price b">{% if product.special %}{% if product.sales and product.discount %}<mark>-{{ product.discount }}</mark>{% endif %}<ins>{{ product.special }} </ins><del>{{ product.price }}</del>{% else %}{{ product.price }}{% endif %}
									</p>
									{% endif %}
									{% if (category_time and product.special and product.special_date_end) %}
									<div class="products__item-discount">
										<div class="ui-discount">
											<div class="row">
												<div class="col-12">
													<div class="ui-discount__desc">
														<figure class="ui-discount__icon">
															<svg class="icon-discount"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-discount"></use>
															</svg>
														</figure>
														<p class="ui-discount__caption">{{ time_text_1 }}<small>{{ time_text_2 }}</small>
														</p>
													</div>
												</div>
												<div class="col-12">
													<time class="ui-discount__countdown js-countdown" data-text-countdown="{{ text_countdown }}" datetime="{{ product.special_date_end }}"></time>
												</div>
											</div>
										</div>
									</div>
									{% endif %}
									<div class="products__item-action">
									{% if product.video %}
											<div class="container_video">
												<button class="btn-cartpr" data-toggle="modal" data-title="{{product.name}}" data-video="{{product.video}}" data-target="#videoModal">
												<i class="fa fa-video-camera"></i> Видео
												</button>
											</div>
										{% endif %}
										<div class="ui-add-to-cart {% if product.isincart %}is-active{% endif %}">
											<button type="button" class="ui-btn ui-btn--primary" onclick="{% if product.isincart %}window.location.href='{{cart_link}}';{% else %}cart.add('{{ product.product_id }}', '{{ product.minimum }}');{% endif %}" {% if product.buy_btn %}disabled{% endif %} data-add-to-cart="{{ text_prostore_in_cart }}">{% if product.isincart %}{{ text_prostore_in_cart }}{% else %}{{ button_cart }}{% endif %}<svg class="icon-cart"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-cart"></use>
												</svg>
											</button>
											<div class="ui-number">
												<button class="ui-number__decrease">
													<svg class="icon-decrease"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-decrease"></use>
													</svg>
												</button>
												<button class="ui-number__increase">
													<svg class="icon-increase"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-increase"></use>
													</svg>
												</button>
												<input class="ui-number__input" type="number" name="prod_id_quantity[{{ product.product_id }}]" value="{{ product.to_cart_quantity }}" min="0" max="9999">
											</div>
											<a class="ui-btn ui-btn--view js-btn-preview" title="{{ text_product_view_btn }}" data-for="{{ product.product_id }}" href="#popupprod">
												<svg class="icon-view"><use xlink:href="catalog/view/theme/prostore/sprites/sprite.svg#icon-view"></use>
												</svg>
											</a>
										</div>
									</div>
								</div>
							</div>
						</div>
						{% endfor %}
					</div>
					<div class="swiper-scrollbar js-swiper-products-scrollbar"></div>
				</div>
			</div>
		</div>
	</div>
	<!-- Products :: End-->
	{% endif %} 
	{{ content_bottom }}
</main>
<!-- Main :: End-->
{% if soc_share_blog %}
<!-- Popups :: Start-->
<div class="fancybox-is-hidden popup" id="share">
	<span class="popup__title">{{ text_prostore_share }}</span>
	<div class="popup__form">{% if soc_share_code %}{{ soc_share_code }}{% else %}{% endif %}</div>
</div>
<!-- Popups :: End-->
{% endif %}
{{ footer }}
{% if schema %} 
<!-- Schema Org :: Start-->
<script type="application/ld+json">
	  {
		"@context": "http://schema.org",
		"@type": "BreadcrumbList",
		"itemListElement": [
		{% for i,breadcrumb in breadcrumbs %}
		{
		  "@type": "ListItem",
		  "position": {{ i + 1 }},
		  "item": {
			"@id": "{{ breadcrumb.href }}",
			"name": "{{ breadcrumb.text }}"
		  }
		}{% if (i + 1 < breadcrumbs|length) %},{% endif %}
		{% endfor %}
		]
	  }
</script>
<script type="application/ld+json">
	{
		"@context": "http://schema.org",
		"@type": "BlogPosting",
		"mainEntityOfPage":{
		"@type":"WebPage",
		"@id":"{{ href }}"
		},
		"headline": "{{ heading_title }}",
		"image": {
		"@type": "ImageObject",
		"url": "{{ image }}"
		},
		"datePublished": "{{ schema_date_added }}",
		"dateModified": "{{ schema_date_added }}",
		"author": {
		"@type": "Organization",
		"name": "{{ store }}"
		},
		"publisher": {
		"@type": "Organization",
		"name": "{{ store }}",
		"logo": {
		"@type": "ImageObject",
		"url": "{{ schema_logo }}"
		}
		},
		"description": "{{ schema_meta_description }}",
		"articleBody": "{{ schema_description }}"
	}
</script>
 <!-- Schema Org :: End-->
{% endif %}
</body></html>