<!DOCTYPE html>
<!--[if IE]><![endif]-->
<!--[if IE 8 ]><html dir="{{ direction }}" lang="{{ lang }}" class="ie8"><![endif]-->
<!--[if IE 9 ]><html dir="{{ direction }}" lang="{{ lang }}" class="ie9"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!-->
<html dir="{{ direction }}" lang="{{ lang }}">
<!--<![endif]-->
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>{{ title }}</title>
	<base href="{{ base }}" />
	{% if description %}
		<meta name="description" content="{{ description }}" />
	{% endif %}
	{% if keywords %}
		<meta name="keywords" content="{{ keywords }}" />
	{% endif %}
	<script src="catalog/view/javascript/jquery/jquery-2.1.1.min.js"></script>
	<link href="catalog/view/javascript/bootstrap/css/bootstrap.min.css" rel="stylesheet" media="screen" />
	<script src="catalog/view/javascript/bootstrap/js/bootstrap.min.js"></script>
	<link href="catalog/view/javascript/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
	<link href="https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital,wght@0,400;0,700;1,400&display=swap" rel="stylesheet">
	
	{# Mahardhi Edit #}
	<script src="catalog/view/javascript/mahardhi/jquery.elevateZoom.min.js"></script>
	<script src="catalog/view/javascript/jquery/magnific/jquery.magnific-popup.min.js"></script>
	<script src="catalog/view/javascript/mahardhi/owl.carousel.min.js"></script>
	<script type="text/javascript" src="catalog/view/javascript/mahardhi/quickview.js"></script>	
	<link href="catalog/view/theme/mahardhi/stylesheet/mahardhi/mahardhi-font.css" rel="stylesheet">
	<link href="catalog/view/theme/mahardhi/stylesheet/mahardhi/animate.min.css" rel="stylesheet">
	<link href="catalog/view/theme/mahardhi/stylesheet/mahardhi/owl.carousel.min.css" rel="stylesheet">
	<link href="catalog/view/theme/mahardhi/stylesheet/mahardhi/owl.theme.default.min.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="catalog/view/javascript/jquery/magnific/magnific-popup.css">
	{# End #}

	<script type="text/javascript" src="catalog/view/javascript/mahardhi/slick.js"></script>	
	<link href="catalog/view/theme/mahardhi/stylesheet/mahardhi/slick.css" rel="stylesheet">

	{% if advanceSearch %}
		<script src="catalog/view/javascript/mahardhi/mahardhi_search.js"></script>
	{% endif %}
	{{ inline_style }}
	<link href="catalog/view/theme/mahardhi/stylesheet/stylesheet.css" rel="stylesheet">
	{% for style in styles %}
		<link href="{{ style.href }}" type="text/css" rel="{{ style.rel }}" media="{{ style.media }}" />
	{% endfor %}
	{# Mahardhi Edit #}
	{% if direction == 'rtl' %}
		<link href="catalog/view/theme/mahardhi/stylesheet/mahardhi/rtl.css" rel="stylesheet">
	{% endif %}
	{# End #}
	{% for script in scripts %}
		<script src="{{ script }}"></script>
	{% endfor %}
	<script src="catalog/view/javascript/common.js"></script>
	{# Mahardhi Edit #}
	<script src="catalog/view/javascript/mahardhi/jquery-ui.min.js"></script>
	<link rel="stylesheet" type="text/css" href="catalog/view/theme/mahardhi/stylesheet/mahardhi/jquery-ui.min.css">
	<script src="catalog/view/javascript/mahardhi/custom.js"></script>	
	{# End #}
	{% for link in links %}
		<link href="{{ link.href }}" rel="{{ link.rel }}" />
	{% endfor %}
	{% for analytic in analytics %}
		{{ analytic }}
	{% endfor %}
</head>
<body class="{{ class }}">
	<div class="loader"></div>
	<nav id="top">
		<div class="container">
			<div class="top-left">
				<div class="welcome-text">{{ text_welcome }}</div>
	        </div> 
	        <div class="top-right">
		        <!-- start contact -->
				<div class="customer-support hidden-xs">
					<i class="icon-phone"></i>
		        	<div class="customer-detail">{{ text_telephone }} : {{ telephone }}</div>
				</div>
			</div>
		</div>
	</nav>
	<header>
		<div class="header-top">
			<div class="container">	
				<div class="header-inner">
					<div class="header-left">	
						<div class="language">{{ language }}</div>
						<div class="currency">{{ currency }}</div>	
					</div>
					
		        	<!-- start logo -->
			        <div id="logo">
						{% if logo %}
							<a href="{{ home }}"><img src="{{ logo }}" title="{{ name }}" alt="{{ name }}" class="img-responsive" /></a>
						{% else %}
							<h1><a href="{{ home }}">{{ name }}</a></h1>
						{% endif %}
					</div>

					<div class="header-right header-links">
						<!-- start account -->								
						<div id="header_ac" class="dropdown">
							<a href="{{ account }}" title="{{ text_account }}" class="dropdown-toggle" data-toggle="dropdown">
								<i class="icon-user"></i>{#<span class="account-here">{{ text_account }}</span>#}
							</a>
							<ul class="dropdown-menu dropdown-menu-right account-link-toggle">
								{% if logged %}
									<li><a href="{{ account }}">{{ text_account }}</a></li>
									<li><a href="{{ order }}">{{ text_order }}</a></li>
									<li><a href="{{ transaction }}">{{ text_transaction }}</a></li>
									<li><a href="{{ download }}">{{ text_download }}</a></li>
									<li><a href="{{ logout }}">{{ text_logout }}</a></li>								
								{% else %}
									<li><a href="{{ register }}">{{ text_register }}</a></li>
									<li><a href="{{ login }}">{{ text_login }}</a></li>								
								{% endif %}						
							</ul>
						</div>

        				{# <div class="wishlist-header"><a href="{{ wishlist }}" id="wishlist-total" title="{{ text_wishlist }}"><i class="icon-heart"></i></a></div> #}

						<!-- start cart -->	
						<div class="header_cart">{{ cart }}</div>
					</div>
				</div>					
			</div>
		</div>
		
		<div class="container">
			<div class="header-bottom">
				<div class="header-menu">
				<!-- start menu -->
					{{menu}}

				<!-- start search -->
				<div class="btn_search">
					<a class="search-btn">
				        <i class="icon-search"></i>
				    </a>
				    <div class="search-down">
					{{ search }}
					</div>
				</div>	
					</div>
			</div>
		</div>
	</header>