<header class="header">
    <div class="header-middle">
        <div class="container">
            <div class="header-left mr-md-4">
                <a href="#" class="mobile-menu-toggle  w-icon-hamburger">
                </a>
                <a href="{{url('/')}}" class="logo ml-lg-0">
                    <img class="logoimg" src="{{asset('web/images/logo/logo.png')}}" style="max-height:60px;width:auto;" />
                </a>
                <form method="get" action="#" class="header-search hs-expanded hs-round d-none d-md-flex input-wrapper">@csrf
                    <div class="select-box">
                        <select id="category" name="cat">
                            <option value="0">All Categories</option>
                            @foreach($cats as $c)
                            <option value="{{url('cat-'.$c->id)}}">{{$c->cat_name}}</option>
                            @endforeach
                        </select>
                    </div>
                    <input type="text" class="form-control" name="search" id="search"
                        placeholder="Search in..." required />
                    <button class="btn btn-search" type="submit"><i class="w-icon-search"></i></button>
                </form>
            </div>
            
            <div class="header-right ml-4">
                @auth('member')
                <a class="account label-down link" href="{{url('dashboard')}}" style="margin-right:2.3rem;">
                    <i class="w-icon-account" style="font-size: 2.7rem;"></i>
                    <span class="account-label d-lg-show">Overview</span>
                </a>
                @else
                <a class="account label-down link" href="{{url('login')}}" style="margin-right:2.3rem;">
                    <i class="w-icon-account" style="font-size: 2.7rem;"></i>
                    <span class="account-label d-lg-show">My Account</span>
                </a>
                @endauth

                <div class="dropdown cart-dropdown cart-offcanvas mr-0 mr-lg-2">
                    <div class="cart-overlay"></div>
                    <a href="#" class="cart-toggle label-down link">
                        <i class="w-icon-cart">
                            <span class="cart-count" style="display: block;">{{$count}}</span>
                        </i>
                        <span class="cart-label">Cart</span>
                    </a>
                    <div class="dropdown-box">
                        <div class="cart-header">
                            <span>Shopping Cart</span>
                            <a href="#" class="btn-close">Close<i class="w-icon-long-arrow-right"></i></a>
                        </div>
                        <div class="shopping-cart-products-1" style="height: 80% !important;overflow: auto;">
                            <table style="width: 100%;border: 1px solid #80808024;">
                                <thead style="background: #d8d8d8;text-align: left;">
                                    <tr>
                                        <th style="padding-left: 5px;">Image</th>
                                        <th>QTY</th>
                                        <th>Price</th>
                                        <th>Total</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($cartpro as $cp)
                                    <tr style="border-bottom: 1px solid #80808024;">
                                        <td style="display: flex;"><img style="width:50px;" src="{{URL::to($cp->image)}}"><a style="padding: 0;margin-top: -20px;" href="{{url('cdelete/'.$cp->id)}}">x</a></td>
                                        <td>{{$cp->qty}}</td>
                                        <td>{{$cp->price}}</td>
                                        <td>{{$cp->total}}</td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                            
                            <div class="cart-total">
                                <label>Sub-Total:</label>
                                <span class="price" style="padding:10px;margin-left:-15px;">Tk. {{$subtotal}}</span>
                            </div>
                            
                            <a href="{{url('cart')}}" class="btn btn-primary text-center" style="width: 92px;">Checkout</a>                                   
                        </div><br>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="header-bottom sticky-content fix-top sticky-header has-dropdown">
        <div class="container">
            <div class="inner-wrap">
                <div class="header-left">
                    <div class="dropdown category-dropdown has-border" data-visible="true">
                        <a href="#" class="category-toggle text-dark" role="button" data-toggle="dropdown"
                            aria-haspopup="true" aria-expanded="true" data-display="static"><i class="w-icon-category"></i><span>Categories</span></a>

                        <div class="dropdown-box">
                            <ul class="menu vertical-menu category-menu">  
                                @foreach($cats->slice(0, 8) as $c)                               
                                <li><a href="{{url('cat-'.$c->id)}}"><img style="width:25px;padding-right: 8px" src="{{URL::to($c->icon)}}"> {{$c->cat_name}}</a></li>
                                @endforeach
                            </ul>
                                     
                        </div>
                    </div>
                    <nav class="main-nav">
                        <ul class="menu active-underline">
                            @if(Session::get('page')=="home") <?php $active = "active"; ?> @else <?php $active = ""; ?> @endif 
                            <li class="{{$active}}"><a href="{{url('/')}}">Home</a></li>     
                            @if(Session::get('page')=="about") <?php $active = "active"; ?> @else <?php $active = ""; ?> @endif                       
                            <li class="{{$active}}"><a href="{{url('about')}}">About Us</a></li>
                            @if(Session::get('page')=="gallery") <?php $active = "active"; ?> @else <?php $active = ""; ?> @endif
                            <li class="{{$active}}"><a href="{{url('gallery')}}">Gallery</a></li>
                            @if(Session::get('page')=="news") <?php $active = "active"; ?> @else <?php $active = ""; ?> @endif
                            <li class="{{$active}}"><a href="{{url('news')}}">News</a></li>
                            @if(Session::get('page')=="contact") <?php $active = "active"; ?> @else <?php $active = ""; ?> @endif
                            <li class="{{$active}}"><a href="{{url('contact')}}">Contact Us</a></li> 
                            @if(Session::get('page')=="faqs") <?php $active = "active"; ?> @else <?php $active = ""; ?> @endif                   
                            <li class="{{$active}}"><a href="{{url('faqs')}}">FAQs</a></li>
                        </ul>
                    </nav>
                </div>
                <!-- <div class="header-right">
                    <a href="#" class="d-xl-show"><i class="w-icon-map-marker mr-1"></i>D-Shop</a>
                    <a href="#"><i class="w-icon-sale"></i>Daily Deals</a>
                </div> -->
            </div>
        </div>
    </div>
</header>