{{-- Users Menu --}}
<li class="has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect">
        <i class="bx bx-group p-1"></i>
        <span>Users</span>
    </a>
    {{-- Regular submenu for expanded mode --}}
    <ul class="sub-menu" aria-expanded="false">
        <li>
            <a href="{{ route('user.master') }}">User List</a>
        </li>
    </ul>
    {{-- Flyout menu for collapsed mode --}}
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Users</div>
        <ul>
            <li class="pt-2"><a href="{{ route('user.master') }}">User List</a></li>
        </ul>
    </div>
</li>

{{-- Location Menu --}}
<li class="has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect">
        <i class="bx bxs-map p-1"></i>
        <span>Location</span>
    </a>
    {{-- Regular submenu for expanded mode --}}
    <ul class="sub-menu" aria-expanded="false">
        <li class="pt-2">
            <a href="{{ route('countrylist') }}">Country List</a>
        </li>
        <li class="pt-2">
            <a href="{{ route('statelist') }}">State List</a>
        </li>
        <li class="pt-2">
            <a href="{{ route('citylist') }}">City List</a>
        </li>
    </ul>
    {{-- Flyout menu for collapsed mode --}}
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Location</div>
        <ul>
            <li class="pt-2"><a href="{{ route('countrylist') }}">Country List</a></li>
            <li class="pt-2"><a href="{{ route('statelist') }}">State List</a></li>
            <li class="pt-2"><a href="{{ route('citylist') }}">City List</a></li>
        </ul>
    </div>
</li>

<li class="mt-1 has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect" aria-expanded="false">
        <i class="bx bx-package p-1"></i>
        <span key="t-packages">Packages</span>
    </a>
    <ul class="sub-menu" aria-expanded="false">
        <li class="mt-1">
            <a href="{{ route('package.list') }}" class="waves-effect">
                <span key="t-package-list">Package List</span>
            </a>
        </li>
    </ul>
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Packages</div>
        <ul>
            <li class="pt-2"><a href="{{ route('package.list') }}">Package List</a></li>
        </ul>
    </div>
</li>

<li class="mt-1 has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect" aria-expanded="false">
        <i class="bx bx-building p-1"></i>
        <span key="t-companies">Companies</span>
    </a>
    <ul class="sub-menu" aria-expanded="false">
        <li class="mt-1">
            <a href="{{ route('company.list') }}" class="waves-effect">
                <span key="t-company-list">Company List</span>
            </a>
        </li>
    </ul>
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Companies</div>
        <ul>
            <li class="pt-2"><a href="{{ route('company.list') }}">Company List</a></li>
        </ul>
    </div>
</li>

<li class="mt-1 has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect" aria-expanded="false">
        <i class="bx bx-bell p-1"></i> <!-- Notification icon -->
        <span key="t-notifications">Notifications</span>
    </a>
    <ul class="sub-menu" aria-expanded="false">
        <li class="mt-1">
            <a href="{{ route('notification.list') }}" class="waves-effect">
                <span key="t-notification-list">Notification List</span>
            </a>
        </li>
    </ul>
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Notifications</div>
        <ul>
            <li class="pt-2"><a href="{{ route('notification.list') }}">Notification List</a></li>
        </ul>
    </div>
</li>
<li class="mt-1 has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect" aria-expanded="false">
        <i class="bx bx-paper-plane p-1"></i> <!-- Icon for Requests -->
        <span key="t-requests">Requests</span>
    </a>
    <ul class="sub-menu" aria-expanded="false">
        <li class="mt-1">
            <a href="{{ route('request.list') }}" class="waves-effect">
                <span key="t-request-list">Request List</span>
            </a>
        </li>
    </ul>
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Requests</div>
        <ul>
            <li class="pt-2"><a href="{{ route('request.list') }}">Request List</a></li>
        </ul>
    </div>
</li>
<li class="mt-1 has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect" aria-expanded="false">
        <i class="bx bx-phone-outgoing p-1"></i>
        <span key="t-requests">Viewer</span>
    </a>
    <ul class="sub-menu" aria-expanded="false">
        <li class="mt-1">
            <a href="{{ route('viewer.list') }}" class="waves-effect">
                <span key="t-request-list">Viewer</span>
            </a>
        </li>
    </ul>
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Viewer</div>
        <ul>
            <li class="pt-2"><a href="{{ route('viewer.list') }}">Viewer</a></li>
        </ul>
    </div>
</li>
{{-- <li class="mt-1 has-flyout">
    <a href="javascript: void(0);" class="has-arrow waves-effect" aria-expanded="false">
        <i class='bx bx-file p-1 side-icon-background'></i>
        <span key="t-template">Templates</span>
    </a>
    <ul class="sub-menu" aria-expanded="false">
        <li class="mt-1">
            <a href="{{ route('templatelist') }}" class="waves-effect">
                <span key="t-templatelist">Template List</span>
            </a>
        </li>
    </ul>
    <div class="sidebar-flyout">
        <div class="flyout-header pb-2 pt-0">Templates</div>
        <ul>
            <li class="pt-2"><a href="{{ route('templatelist') }}">Template List</a></li>
        </ul>
    </div>
</li> --}}