{% load static %}
<div class="app-header header sticky">
    <div class="container-fluid main-container">
        <div class="d-flex">
            <a aria-label="Hide Sidebar" class="app-sidebar__toggle" data-bs-toggle="sidebar" href="javascript:void(0)"></a>
            <!-- sidebar-toggle-->
            {% if request.user.type == "admin" %}
                <a class="logo-horizontal " href="/dashboard">
            {% else %}
                <a class="logo-horizontal " href="/dashboard">
            {% endif %}
                <img src="{% static 'front/images/logo.png' %}" class="header-brand-img desktop-logo" style="width: 155px;" alt="logo">
                {% comment %} <img src="{% static 'front/images/logo.png' %}" class="header-brand-img light-logo1" style="width: 155px;" alt="logo"> {% endcomment %}
            </a>
            <!-- LOGO -->
            <div class="d-flex order-lg-2 ms-auto header-right-icons">
                <div class="dropdown d-none">
                    <a href="javascript:void(0)" class="nav-link icon" data-bs-toggle="dropdown">
                        <i class="fe fe-search"></i>
                    </a>
                    {% comment %} <div class="dropdown-menu header-search dropdown-menu-start">
                        <div class="input-group w-100 p-2">
                            <input type="text" class="form-control" placeholder="Search....">
                            <div class="input-group-text btn btn-primary">
                                <i class="fe fe-search" aria-hidden="true"></i>
                            </div>
                        </div>
                    </div> {% endcomment %}
                </div>
                <button class="navbar-toggler navresponsive-toggler d-lg-none ms-auto" type="button"
                        data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent-4"
                        aria-controls="navbarSupportedContent-4" aria-expanded="false"
                        aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon fe fe-more-vertical"></span>
                </button>
                <div class="navbar navbar-collapse responsive-navbar p-0">
                    <div class="collapse navbar-collapse" id="navbarSupportedContent-4">
                        <div class="d-flex order-lg-2">
                            {% comment %} <div class="dropdown d-lg-none d-flex">
                                <a href="javascript:void(0)" class="nav-link icon" data-bs-toggle="dropdown">
                                    <i class="fe fe-search"></i>
                                </a>
                                <div class="dropdown-menu header-search dropdown-menu-start">
                                    <div class="input-group w-100 p-2">
                                        <input type="text" class="form-control" placeholder="Search....">
                                        <div class="input-group-text btn btn-primary">
                                            <i class="fa fa-search" aria-hidden="true"></i>
                                        </div>
                                    </div>
                                </div>
                            </div> {% endcomment %}
                            <!-- CART -->
                            <div class="dropdown d-flex">
                                <a class="nav-link icon full-screen-link nav-link-bg">
                                    <i class="fe fe-minimize fullscreen-button"></i>
                                </a>
                            </div>
                            <!-- FULL-SCREEN -->
                            <!-- NOTIFICATIONS -->
                            <div class="dropdown d-flex profile-1">
                                <a href="javascript:void(0)" data-bs-toggle="dropdown" class="nav-link leading-none d-flex">
                                    <img src="{% static 'images/new.png' %}" alt="profile-user"
                                         class="avatar  profile-user brround cover-image">
                                </a>
                                <div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
                                    <div class="drop-heading">
                                        <div class="text-center">
                                            <h5 class="text-dark mb-0 fs-14 fw-semibold">{{ request.user.name }}</h5>
                                            {% if request.user.type == "admin" %}
                                                <small class="text-muted">{{ request.user.type }}</small>
                                            {% else %}
                                                <small class="text-muted">{{ request.user.memberdetails.memberID }}</small>
                                            {% endif %}
                                        </div>
                                    </div>
                                    <div class="dropdown-divider m-0"></div>
                                    {% if request.user.type != "admin" %}
                                        <a class="dropdown-item" href="/profile">
                                            <i class="dropdown-icon fe fe-user"></i> Profile
                                        </a>
                                    {% endif %}
                                    <a class="dropdown-item" href="/logout">
                                        <i class="dropdown-icon fe fe-alert-circle"></i> Sign out
                                    </a>
                                </div>
                                {% if request.user.type == "admin" %}
                                    <form id="logout-form" action="/logout' %}" method="POST" style="display: none;">
                                        {% csrf_token %}
                                    </form>
                                {% else %}
                                    <form id="logout-form" action="/memberlogout' %}" method="POST" style="display: none;">
                                        {% csrf_token %}
                                    </form>
                                {% endif %}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
