@php
$menu = DB::table('menus')
->select('id','menu_name','route')
->where('type','1')
->where('parent_id',0)
->get();
// foreach ($sidebar as $key => $value) {
// $sub_menu = DB::table('menus')->where(['status' => '1','parent_id' => $value->id]);
// $sidebar[$key]->sub_menu = json_decode(json_encode($sub_menu->get()),true);
// }
$user_login_history = DB::table('user_login_history')->where('user_id',Auth::user()->id)->orderByDesc('id')->first();
@endphp

<style>
    .btn-lang {
    color: #000;
    background-color: #6c757d;
    /* border-color: #ffc107; */
    color: white;
}
</style>
<div id="content" class="">
    <div
        class="row d-flex flex-column flex-md-row align-items-center px-3 py-3 px-md-4 py-lg-3 header-bg border-bottom">
        <div class="company-logo d-flex align-items-start col align-items-end">
            <img src="" class="ms-2 mr-2 rounded d-none d-md-block align-self-center" style="width: 30px;" />
            <div class="col-md-6 d-flex flex-column justify-content-around align-self-start" id="main-width">
                <h5 class="my-0 pt-md-2 me-md-auto font-500 pl-2 dropdown   text-md-left text-theme">
                    {{getSiteInfo('site_title')}}
                    <div class="dropdown">
                        <button class="dropbtn dropbtn1"><i class='bi-gear'
                                style='font-size:16;line-height:0;'></i></button>
                        <div class="dropdown-content">
                            @foreach ($menu as $item)
                            @can('view '.$item->route)
                            <a class="dropdown-item page" href="{{ url($item->route) }}">
                                @if(app()->getLocale() == "ar")
                                {{$item->menu_name}}
                                @else
                                {{$item->menu_name}}
                                @endif
                            </a>
                            @endcan
                            @endforeach

                        </div>
                    </div>

                </h5>
            </div>
        </div>
        <div class="col-md-6 ms-md-auto mx-auto d-flex align-items-center justify-content-end mobile_view"
            id="header-right-menu">
            {{-- languages --}}
            @if(app()->getLocale() == "ar")
                <a href="{{ url('/localeA/en')}}" class="ms-3 me-2 rounded btn btn-xs btn-lang rounded-pill px-3 font-en"
                id="lang-btn">English</a>
            @else
                <a href="{{ url('/localeA/ar')}}" class="ms-3 me-3 rounded btn btn-xs btn-lang rounded-pill px-3 font-en"
                id="lang-btn">Arabic</a>
            @endif

            <a class="btn btn-xs btn-lang rounded-pill px-3 me-3" type="button" id="themebtn" data-bs-toggle="modal"
                data-bs-target="#theme_changer_mod">
                {{trans('admin.Theme')}}
            </a>
            <button class="navbar-toggler collapsed btn p-0 rounded-pill btn-sm btn-light border mx-2 d-lg-none"
                type="button" data-toggle="collapse" data-target="#mainmenu" aria-controls="mainmenu"
                aria-expanded="false" aria-label="Toggle navigation"
                style="min-width: 30px; position:relative; min-height: 30px;">
                <i class='bi-grid-3x2-gap-fill' style='font-size:1em; line-height:0;'></i>
            </button>
            <button class="btn p-0 rounded-pill btn-sm btn-light border mx-2" id="setting-menu-btn"
                style="min-width: 30px; min-height: 30px;">
                <i class='bi-plus' style='font-size:1.4em; line-height:0;'></i>
            </button>
            <button class="btn p-0 rounded-pill btn-sm btn-light border mx-2" id="notification-btn"
                style="min-width: 30px; position:relative; min-height: 30px;">
                <i class='bi-bell-fill' style='font-size:1.3em; line-height:0;'></i>
                <span class="badge bg-warning rounded-pill py-1 me-2 blink-notify" style="position: absolute;"></span>
            </button>
            <button class="btn p-0 rounded-pill btn-sm btn-light border mx-2" id="grid-menu-btn"
                style="min-width: 30px; min-height: 30px;">
                <i class='bi-search' style='font-size:1.2em;line-height:0;'></i>
            </button>
            <button class="btn p-0 mx-2" id="user-prof-btn" style="background: none; border:0 !important">
                <img src="{{ asset(Auth::user()->photo) }}" class="rounded-pill border" width="30px" height="30px"
                    style="cursor: pointer; object-fit: cover;">
            </button>
        </div>
    </div>
    <!-- Main content -->
    <main class="container-fluid px-0">
        <div class="flyout" id="setting-menu" style="display: none;">
            <div class="flyout-header">
                <span class="close-details">
                    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 512 512"
                        xml:space="preserve" class="icon icon-xs">
                        <path
                            d="M455.2 9.2L256 208.4 56.8 9.2C44.5-3.1 24.6-3.1 12.2 9.2l-2.9 2.9C-3 24.4-3 44.4 9.3 56.7L208.4 256 9.2 455.2c-12.3 12.3-12.3 32.3 0 44.6l2.9 2.9c12.3 12.3 32.3 12.3 44.6 0L256 303.6l199.2 199.2c12.3 12.3 32.3 12.3 44.6 0l2.9-2.9c12.3-12.3 12.3-32.3 0-44.6L303.6 256 502.8 56.8c12.3-12.3 12.3-32.3 0-44.6l-2.9-2.9c-12.5-12.4-32.4-12.4-44.7-.1z">
                        </path>
                    </svg>
                </span>
                <h5 class="pt-3 fw-normal">{{trans('admin.grid_menu')}}</h5>
                <p class="mb-0">{{trans('admin.quick_action_menu')}}</p>

            </div>
            <div class="flyout-body p-3">
                <div class="row row-cols-3 g-3">
                    <a href="{{route('languages')}}">{{trans('admin.languages')}}</a>
                    <a href="{{route('notification')}}">{{trans('admin.notifications')}}</a>
                </div>
            </div>
        </div>
        <div class="flyout" id="user-prof" style="display: none;">
            <div class="flyout-header">
                <span class="close-details">
                    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 512 512"
                        xml:space="preserve" class="icon icon-xs">
                        <path
                            d="M455.2 9.2L256 208.4 56.8 9.2C44.5-3.1 24.6-3.1 12.2 9.2l-2.9 2.9C-3 24.4-3 44.4 9.3 56.7L208.4 256 9.2 455.2c-12.3 12.3-12.3 32.3 0 44.6l2.9 2.9c12.3 12.3 32.3 12.3 44.6 0L256 303.6l199.2 199.2c12.3 12.3 32.3 12.3 44.6 0l2.9-2.9c12.3-12.3 12.3-32.3 0-44.6L303.6 256 502.8 56.8c12.3-12.3 12.3-32.3 0-44.6l-2.9-2.9c-12.5-12.4-32.4-12.4-44.7-.1z">
                        </path>
                    </svg>
                </span>
                <div class="user-profile clearfix text-center">
                    <img src="{{ asset(Auth::user()->photo) }}" alt="not found" class="profile-pic">
                    <div class="over-flow text-uppercase">{{Auth::user()->type}}</div>
                    <div class="text-muted font-xxs user-id"></div>
                    <p><small class="text-muted over-flow"></small></p>
                    <p class="profile-accounts">
                    <form method="POST" action="{{ route('logout') }}">
                        <a class="text-primary" href="{{url('/profile')}}" style="text-decoration: none;"><i
                                class="bi-person-circle"></i>{{trans('admin.my_account')}} </a>
                        <span class="text-muted" style="padding:0 10px;">|</span>
                        @csrf
                        <a class="text-danger" href="{{ route('logout') }}"
                            onclick="event.preventDefault(); this.closest('form').submit();"
                            style="text-decoration: none;">
                            <i class="bi-door-open"></i> {{trans('admin.logout')}}
                        </a>
                    </form>
                    </p>
                </div>
            </div>
            <div class="flyout-body p-3">
                <div class="card">
                    <div class="card-header">
                        {{trans('admin.info')}}
                    </div>
                    <ul class="list-group list-group-flush">
                        <li class="list-group-item list-group-item-action">
                            {{trans('admin.name')}}<span class="float-end">{{ucfirst(Auth::user()->name)}}</span>
                        </li>
                        <li class="list-group-item list-group-item-action">
                            {{trans('admin.email')}}<span class="float-end">{{Auth::user()->email}}</span>
                        </li>
                    </ul>
                </div>
                <hr>
                <div class="card">
                    <div class="card-header">
                        {{trans('admin.log')}}
                    </div>

                    <ul class="list-group list-group-flush">
                        <li class="list-group-item list-group-item-action">
                            {{trans('admin.login_time')}} <span
                                class="float-end">{{$user_login_history->created_at ?? ""}}</span>
                        </li>
                        <li class="list-group-item list-group-item-action">
                            {{trans('admin.ip')}} <span class="float-end">{{$user_login_history->user_ip ?? ""}}</span>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="flyout" id="grid-menu" style="display: none;">
            <div class="flyout-header">
                <span class="close-details">
                    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 512 512"
                        xml:space="preserve" class="icon icon-xs">
                        <path
                            d="M455.2 9.2L256 208.4 56.8 9.2C44.5-3.1 24.6-3.1 12.2 9.2l-2.9 2.9C-3 24.4-3 44.4 9.3 56.7L208.4 256 9.2 455.2c-12.3 12.3-12.3 32.3 0 44.6l2.9 2.9c12.3 12.3 32.3 12.3 44.6 0L256 303.6l199.2 199.2c12.3 12.3 32.3 12.3 44.6 0l2.9-2.9c12.3-12.3 12.3-32.3 0-44.6L303.6 256 502.8 56.8c12.3-12.3 12.3-32.3 0-44.6l-2.9-2.9c-12.5-12.4-32.4-12.4-44.7-.1z">
                        </path>
                    </svg>
                </span>
                <h5 class="pt-3 fw-normal">{{trans('admin.search')}}</h5>
                <p class="mb-0">{{trans('admin.search_will_be_ready_soon')}}</p>
            </div>
            <div class="flyout-body py-3">
                <div class="form-group px-3">
                    <input type="search" name="search" list="searchtags" id="search" class="form-control rounded-pill">
                    <datalist id="searchtags">
                        <option value="Help">
                        <option value="How to Add Supplier">
                        <option value="Change Company Detail">
                        <option value="Support">
                        <option value="Customer Care">
                    </datalist>
                </div>
                <div class="list-group list-group-flush mt-3">
                    <a href="#"
                        class="list-group-item list-group-item-action px-4">{{trans('admin.please_bear_with_us')}}</a>
                </div>
            </div>
        </div>
        <div class="flyout" id="notification" style="display: none;">
            <div class="flyout-header">
                <span class="close-details">
                    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" x="0" y="0" viewBox="0 0 512 512"
                        xml:space="preserve" class="icon icon-xs">
                        <path
                            d="M455.2 9.2L256 208.4 56.8 9.2C44.5-3.1 24.6-3.1 12.2 9.2l-2.9 2.9C-3 24.4-3 44.4 9.3 56.7L208.4 256 9.2 455.2c-12.3 12.3-12.3 32.3 0 44.6l2.9 2.9c12.3 12.3 32.3 12.3 44.6 0L256 303.6l199.2 199.2c12.3 12.3 32.3 12.3 44.6 0l2.9-2.9c12.3-12.3 12.3-32.3 0-44.6L303.6 256 502.8 56.8c12.3-12.3 12.3-32.3 0-44.6l-2.9-2.9c-12.5-12.4-32.4-12.4-44.7-.1z">
                        </path>
                    </svg>
                </span>
                <h5 class="pt-3 fw-normal">{{trans('admin.notifications')}}</h5>
                <p class="mb-0">{{trans('admin.your_notifications')}}</p>
            </div>
            <div class="flyout-body pb-3">
                <div class="list-group list-group-flush mt-3">
                </div>
            </div>
        </div>