<ul class="navbar-nav bg-sidebar sidebar sidebar-dark accordion" id="accordionSidebar">

    <!-- Sidebar - Brand -->
    <a class="sidebar-brand d-flex align-items-center justify-content-center my-3" href="index.php">
        <div class="sidebar-brand-icon ">
            <i class="fas fa-fw fa-home"></i>
        </div>
        <div class="sidebar-brand-text mx-3 my-5">SMS</div>
    </a>
    <!-- Nav Item - Dashboard -->
    <li class="nav-item active">
        <a class="nav-link" href="index.php">
            <i class="fas fa-users fa-fw"></i>
            <span>Users</span></a>
    </li>
    <hr class="sidebar-divider my-0">
    <!-- Nav Item - Dashboard -->
    <li class="nav-item">
        <a class="nav-link" href="index.php">
            <i class="fas fa-fw fa-tachometer-alt"></i>
            <span>Dashboard</span></a>
    </li>
    <!-- Divider -->

    <hr class="sidebar-divider">
    <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages3" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fas fa-fw fa-tags"></i>
            <span>Bills</span>
        </a>
        <div id="collapsePages3" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="view_additional_charges.php">View Additional <br>Charges</a>
                <a class="collapse-item" href="view_bills.php">View Bills</a>
            </div>
        </div>
    </li>
    <hr class="sidebar-divider">
    <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages4" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fas fa-users" aria-hidden="true"></i>
            <span>Complaints</span>
        </a>
        <div id="collapsePages4" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="raise_complaint.php">Raise Complaint</a>
                <a class="collapse-item" href="manage_complaints.php">Manage Complaints</a>
            </div>
        </div>
    </li>
    <hr class="sidebar-divider">

    <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages5" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fa fa-eye" aria-hidden="true"></i>
            <span>Visitors</span>
        </a>
        <div id="collapsePages5" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="add_visitors.php">Add Visitors</a>
                <a class="collapse-item" href="manage_visitors.php">Manage Visitors</a>
            </div>
        </div>
    </li>
    <hr class="sidebar-divider">

    <!-- <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages6" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fas fa-search" aria-hidden="true"></i>
            <span>Search</span>
        </a>
        <div id="collapsePages6" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="search_visitor.php">Search Visitor</a>
            </div>
        </div>
    </li>

    <hr class="sidebar-divider"> -->

    <!-- <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages7" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fas fa-file" aria-hidden="true"></i>
            <span>Report</span>
        </a>
        <div id="collapsePages7" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="visitor_reports.php">Visitors b/w dates</a>
            </div>
        </div>
    </li> -->

    <!-- <hr class="sidebar-divider"> -->

    <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages8" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fas fa-shield-alt" aria-hidden="true"></i>
            <span>Security</span>
        </a>
        <div id="collapsePages8" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="view_security.php">View Security</a>
            </div>
        </div>
    </li>

    <!-- <hr class="sidebar-divider">

    <li class="nav-item">
        <a class="nav-link collapsed" href="#" data-toggle="collapse" data-target="#collapsePages9" aria-expanded="true"
            aria-controls="collapseUtilities">
            <i class="fas fa-clock" aria-hidden="true"></i>
            <span>Meetings</span>
        </a>
        <div id="collapsePages9" class="collapse" aria-labelledby="headingUtilities" data-parent="#accordionSidebar">
            <div class="bg-white py-2 collapse-inner rounded">
                <a class="collapse-item" href="schedule_meetings.php">View Meetings</a>
            </div>
        </div>
    </li> -->

    <hr class="sidebar-divider">

    <li class="nav-item">
        <a class="nav-link" href="shoutbox.php">
            <i class="fas fa-fw fa-volume-up"></i>
            <span>Shoutbox</span></a>
    </li>

    <!-- Divider -->
    <hr class="sidebar-divider d-none d-md-block mb-5">
    <!-- Sidebar Toggler (Sidebar) -->
    <div class="text-center d-none d-md-inline">
        <button class="rounded-circle border-0" id="sidebarToggle"></button>
    </div>
</ul>
<!-- End of Sidebar -->
<!-- Content Wrapper -->
<div id="content-wrapper" class="d-flex flex-column">
    <!-- Main Content -->
    <div id="content">