@php
    $show_sidemenu = true;
@endphp
<div id="kt_app_header" class="app-header">
    <div class="app-container container-fluid d-flex align-items-stretch justify-content-between" id="kt_app_header_container">
        <div class="d-flex align-items-center d-lg-none ms-n2 me-2" title="Show sidebar menu">
            <div class="btn btn-icon btn-active-color-primary w-35px h-35px" id="kt_app_sidebar_mobile_toggle">
                <span class="svg-icon svg-icon-1">
                    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path d="M21 7H3C2.4 7 2 6.6 2 6V4C2 3.4 2.4 3 3 3H21C21.6 3 22 3.4 22 4V6C22 6.6 21.6 7 21 7Z" fill="currentColor" />
                        <path opacity="0.3" d="M21 14H3C2.4 14 2 13.6 2 13V11C2 10.4 2.4 10 3 10H21C21.6 10 22 10.4 22 11V13C22 13.6 21.6 14 21 14ZM22 20V18C22 17.4 21.6 17 21 17H3C2.4 17 2 17.4 2 18V20C2 20.6 2.4 21 3 21H21C21.6 21 22 20.6 22 20Z" fill="currentColor" />
                    </svg>
                </span>
            </div>
        </div>
        <div class="d-flex align-items-center flex-grow-1 flex-lg-grow-0">
            <a href="{{route('admin_dashboard')}}" class="d-lg-none">
                <img alt="Logo" src="{{ asset('backend/images/user_profile/' . $admin_logo->config_value) }}" class="h-30px" />
            </a>
        </div>
         <div class="d-flex align-items-stretch justify-content-between flex-lg-grow-1" id="kt_app_header_wrapper">
            <div class="app-header-menu app-header-mobile-drawer align-items-stretch" data-kt-drawer="true" data-kt-drawer-name="app-header-menu" data-kt-drawer-activate="{default: true, lg: false}" data-kt-drawer-overlay="true" data-kt-drawer-width="250px" data-kt-drawer-direction="end" data-kt-drawer-toggle="#kt_app_header_menu_toggle" data-kt-swapper="true" data-kt-swapper-mode="{default: 'append', lg: 'prepend'}" data-kt-swapper-parent="{default: '#kt_app_body', lg: '#kt_app_header_wrapper'}">
                <div class="menu menu-rounded menu-column menu-lg-row my-5 my-lg-0 align-items-stretch fw-semibold px-2 px-lg-0" id="kt_app_header_menu" data-kt-menu="true">
                    <div data-kt-menu-trigger="{default: 'click', lg: 'hover'}" data-kt-menu-placement="bottom-start" class="menu-item here show menu-here-bg menu-lg-down-accordion me-0 me-lg-2">
                        <h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">
                            @if(Auth::user()->role_id ===1) 
                                Admin Panel 
                            @elseif(Auth::user()->role_id === 2)
                                District
                            @elseif(Auth::user()->role_id === 3)
                                Club
                            @elseif(Auth::user()->role_id === 6)
                                State
                            @elseif(Auth::user()->role_id === 4)
                                Judge
                            @else
                                Gymnast 
                            @endif
                            
                        </h1>
                    </div>
                </div>
            </div>
            <div class="app-navbar flex-shrink-0">
                <div class="app-navbar-item align-items-stretch ms-1 ms-lg-3">
                    <div id="kt_header_search" class="header-search d-flex align-items-stretch" data-kt-search-keypress="true" data-kt-search-min-length="2" data-kt-search-enter="enter" data-kt-search-layout="menu" data-kt-menu-trigger="auto" data-kt-menu-overflow="false" data-kt-menu-permanent="true" data-kt-menu-placement="bottom-end">
                    </div>
                </div>
                <div class="app-navbar-item ms-1 ms-lg-3" id="kt_header_user_menu_toggle">
                    <div class="cursor-pointer symbol symbol-35px symbol-md-40px" data-kt-menu-trigger="{default: 'click', lg: 'hover'}" data-kt-menu-attach="parent" data-kt-menu-placement="bottom-end">
                        @if(Auth::user()->profile_image)
                            <img alt="Logo" src="{{asset('backend/images/user_profile/'.Auth::user()->profile_image)}}" />
                        @else 
                            <img alt="Logo" src="{{asset("assets/images/avatars/blank.png")}}" />
                        @endif
                    </div>
                    <div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg menu-state-color fw-semibold py-4 fs-6 w-275px" data-kt-menu="true">
                        <div class="menu-item px-3">
                            <div class="menu-content d-flex align-items-center px-3">
                                <div class="symbol symbol-50px me-5">
                                    @if(Auth::user()->profile_image)
                                        <img alt="Logo" src="{{asset('backend/images/user_profile/'.Auth::user()->profile_image)}}" />
                                    @else 
                                        <img alt="Logo" src="{{asset("assets/images/avatars/blank.png")}}" />
                                    @endif
                                </div>
                                <div class="d-flex flex-column">
                                    <div class="fw-bold d-flex align-items-center fs-5">   
                                            {{Auth::user()->first_name." ".Auth::user()->last_name}}
                                    </div>
                                    <span class="fw-semibold text-muted text-hover-primary fs-7">{{Auth::user()->email}}</span>
                                </div>
                            </div>
                        </div>
                        <div class="separator my-2"></div>
                            <div class="menu-item px-5">
                                <a href="{{route('user_profile')}}" class="menu-link px-5 @if(Request::segment(1) == "profile") active @endif">My Profile</a>
                            </div>
                            <div class="menu-item px-5">
                                <a href="{{route("admin_logout")}}" class="menu-link px-5">Sign Out</a>
                            </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>