<?php
/**
 * The header for our theme
 *
 * This is the template that displays all of the <head> section and everything up until <div id="content">
 *
 * @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
 *
 * @package Better_Morning
 */
global $vtd_option, $woocommerce;
?>
<!DOCTYPE html>
<html><!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<?php wp_head(); ?>
<link href="<?php echo IMAGE_PATH; ?>images/favicon.png" rel="shortcut icon">
<script src="<?php echo JS_PATH; ?>vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>       

</head>
<body <?php body_class(); ?>>
<div class="main_wrap">
    
<!-- start header -->
<header>    
    <!-- start header bottom -->
    <section class="header_btm">
        <div class="container">
            <div class="row">
                <div class="col-md-2 col-sm-12">
                    <div class="logo">
                        <a href="<?php echo site_url(); ?>"><img src="<?php echo $vtd_option['logo']['url'] ?>" alt="Logo" title="Logo" class="img-responsive" /></a>                        
                    </div>
                </div>
                <div class="col-md-4 col-sm-5 no-padding">
                    <div class="navbar navbar-default" role="navigation">                        
                        <div class="navbar-header">
                            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                                <span class="sr-only">Toggle navigation</span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                                <span class="icon-bar"></span>
                            </button>
                            <a class="navbar-brand hide-desktop" href="#">Menu</a>
                        </div>
                        <div class="collapse navbar-collapse">
                        <?php   $menu = array(
            			                'menu'            => 'Main-Menu',
            			                'menu_id'         => '2',
            			                'menu_class'      => 'nav navbar-nav',
            			               
                                        'walker'          => new wp_bootstrap_navwalker()
			                      ) ;
			    			 wp_nav_menu($menu);
						?>  
                    </div>
                    </div>
                </div>
                <div class="col-md-6 col-sm-7">
                    <div class="serch-section">
                        <ul>
                            <li>
                                
                                <form method="post" action="<?php echo home_url('/');?>" class="srch-bx">
                                    <input class="form-control" type="text" placeholder="search your product..." name="s">
                                    <button><i class="fa fa-search"></i></button>
                                </form>

                            </li>
                        <?php if(is_user_logged_in()) {?>
                            <li><a class="black-btn" href="<?php echo esc_url(get_permalink(61)); ?>">LogOut</a></li>
                            <li><a class="red-outline-btn" href="<?php echo esc_url(get_permalink(61)); ?>">My Account</a></li>
                        <?php } else { ?>    
                            <li><a class="black-btn" href="<?php echo esc_url(get_permalink(61)); ?>">Login</a></li>
                            <li><a class="red-outline-btn" href="<?php echo esc_url(get_permalink(61)); ?>">Register</a></li>
                        <?php } ?>
                            <li><a href="<?php echo esc_url(get_permalink(57)); ?>" class="cart-btn"><span><?php echo WC()->cart->get_cart_contents_count();?></span> <i class="fa fa-shopping-cart"></i></a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <!-- end header bottom -->    
</header>
<!-- end header -->

<?php if(is_front_page()){ ?>    
<!-- start banner -->
<div class="banner">
    <ul id="slider1" class="bxslider">
        <?php 
        $i=1;
          if(!empty($vtd_option['header-slides']))  {
            foreach ($vtd_option['header-slides'] as $slide) {
        ?>
        <li>
            <img src="<?php echo $slide['image'];?>" alt="Banner<?php echo $i; ?>" title="Banner<?php echo $i; ?>"/>
            <div class="banner-overlay">
                <?php echo $slide['description']; ?>
            </div>
        </li>
        <?php $i++; } } ?>
    </ul>

    <section class="category-wrap">
        <div class="container">
            <div class="row">
                <div class="col-sm-12">
                    <ul class="list-style1">
                   <?php if( have_rows('category_details') ){
                      while( have_rows('category_details') ){ the_row(); 
                             $icon = get_sub_field('category_icon');
                             $image = get_sub_field('category_image');
                             $name = get_sub_field('category_name');
                             $link = get_sub_field('category_link');
                   ?>
                        <li>
                            <a href="<?php echo $link; ?>">
                                <div class="category-bx">
                                    <figure class="category-img">
                                        <img src="<?php echo $image; ?>" class="img-responsive" alt=""/>
                                    </figure>
                                    <div class="category-overlay">
                                        <img src="<?php echo $icon; ?>" class="img-responsive"/>
                                        <h3><?php echo $name; ?></h3>
                                    </div>
                                </div>
                            </a>
                        </li>
                    <?php } } ?>
                    </ul>
                </div>
            </div>
        </div>
    </section>

</div>
<!-- end banner -->
<?php } else { ?>
<!-- start banner -->
<div class="small_banner">
    <img class="img-responsive" src="<?php echo $vtd_option['inner_banner']['url'];?>">
</div>
<!-- end banner -->
<?php } ?>