@extends('front.layout')
@section('title')
   @yield('account_title')
@endsection
@section('css')
    <!-- SPECIFIC CSS -->
    <link href="{{url('assets/front/css/listing.css')}}" rel="stylesheet">
    <!-- YOUR CUSTOM CSS -->
    <link href="{{url('assets/front/css/custom.css')}}" rel="stylesheet">
    <link href="{{url('assets/front/css/cart.css')}}" rel="stylesheet">

    @yield('account_css')
@endsection
@section('content')
<style>
    @media (min-width: 1281px) {
        .collapse{
            display: block!important;
        }
    }
    .sidebar_header{
        cursor: pointer;
    }
</style>
<main>
    <div class="container rtl">
            <div class="row">
                <div class="col-lg-12">
                    <div class="top_panel">
                        <div class="container header_panel">
                            <small>{{__('What are you looking for?')}}</small>
                        </div>
                        <!-- /header_panel -->

                        <div class="container">
                            <div class="search-input">
                                <form action="{{route('search')}}">
                                    <div class="row">
                                        <div class="col-md-1">
                                            <button style="background: #ffdc5d;color: #fff;top: 0;width: 100%;height: 100%" type="submit"><i class="ti-search"></i></button>
                                        </div>
                                        <div class="col-md-11" style="padding: 0;">
                                            <input type="text" placeholder="{{__('Search here')}}" class="search_products" name="term"
                                                   value="@if(request()->has('term')) {{request()->term}} @endif">
                                        </div>

                                    </div>
                                </form>
                            </div>
                        </div>
                        <!-- /related -->
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-sm-12 col-xs-12">
                    <div class="sidebar">
                          <h5 class="text-center sidebar_header" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
                            <i class="fa fa-bars" aria-hidden="true"></i>
                            {{__('My account')}}
                          </h5>
                          <div class="collapse" id="collapseExample">
                                <a href="{{route('my_account')}}" id="my_account">
                                    <i class="ti-user"></i>
                                    {{__('My account')}}
                                </a>
                                <a href="{{route('notifications')}}" id="notifications">
                                    <i class="ti-book"></i>
                                    {{__('Notifications')}}
                                    <span style="background-color: red;color:white;padding:0px 5px 0px 5px;border-radius:40px;float: left;">
                                        @if($product_notifications_count)
                                            {{$product_notifications_count}}
                                        @endif
                                    </span>
                                </a>
                                <a href="{{route('documents')}}" id="documents">
                                    <i class="ti-book"></i>
                                    {{__('Documents')}}
                                    <span style="background-color: red;color:white;padding:0px 5px 0px 5px;border-radius:40px;float: left;">
                                    @if($document_notifications_count)
                                        {{$document_notifications_count}}
                                    @endif
                                    </span>
                                </a>
                                <a href="{{route('notes')}}" id="notes">
                                    <i class="ti-notepad"></i>
                                    {{__('Notes')}}
                                </a>
                                <a href="{{route('checkout')}}" id="order">
                                    <i class="ti-shopping-cart"></i>
                                    {{__('Order now')}}
                                </a>
                                <a href="{{route('products')}}" id="products">
                                    <i class="ti-package"></i>
                                    {{__('Our products')}}
                                </a>
                                <a href="{{route('account')}}" id="account">
                                    <i class="ti-user"></i>
                                    {{__('Account setting')}}
                                </a>
                                <a href="{{route('show_store')}}" id="show_store">
                                    <i class="ti-user"></i>
                                    {{__('Store setting')}}
                                </a>
                                <a href="{{route('change_password')}}" id="change_password">
                                    <i class="ti-key"></i>
                                    {{__('Change password')}}
                                </a>
                                <a href="{{route('orders')}}" id="orders">
                                    <i class="ti-truck"></i>
                                    {{__('Orders')}}
                                </a>
                                <a href="{{route('payments')}}" id="payments">
                                    <i class="ti-money"></i>
                                    {{__('Balance')}}
                                </a>
                        </div>

                        {{-- <a href="#logout" id="orders">Contact</a> --}}
                    </div>

                </div>
                <div class="col-lg-9 col-sm-12 col-xs-12">
                    <!-- Page content -->
                    @yield('account_content')
                </div>
            </div>
    </div>
</main>
@endsection
@section('scripts')
   @yield('account_scripts')
@endsection