<!DOCTYPE html>
<html dir="ltr">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <!-- Favicon -->
    <link rel="apple-touch-icon" sizes="180x180" href="https://investbamboo.com/favicon.ico">
    <link rel="icon" type="image/png" sizes="32x32" href="https://investbamboo.com/favicon.ico">
    <link rel="icon" type="image/png" sizes="16x16" href="https://investbamboo.com/favicon.ico">
    <link rel="manifest" href="app-assets/favicon/site.webmanifest.txt">
    <link rel="mask-icon" href="app-assets/favicon/safari-pinned-tab.svg" color="#0010f7">
    <meta name="msapplication-TileColor" content="#0010f7">
    <meta name="theme-color" content="#ffffff">

    <!-- Font -->
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&amp;display=swap" rel="stylesheet" />

    <!-- Plugin -->
    <link rel="stylesheet" type="text/css" href="app-assets/css/plugin/swiper-bundle.min.css">
    <link rel="stylesheet" type="text/css" href="app-assets/icons/iconly/index.min.css">
    <link rel="stylesheet" type="text/css" href="app-assets/icons/remix-icon/index.min.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/bootstrap.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/colors.css">

    <!-- Base -->
    <link rel="stylesheet" type="text/css" href="app-assets/css/base/typography.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/base/base.css">

    <!-- Theme -->
    <link rel="stylesheet" type="text/css" href="app-assets/css/theme/colors-dark.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/theme/theme-dark.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/custom-rtl.css">

    <!-- Layouts -->
    <link rel="stylesheet" type="text/css" href="app-assets/css/layouts/sider.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/layouts/header.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/layouts/page-content.css">
    <link rel="stylesheet" type="text/css" href="app-assets/css/components.css">
    <!-- Customizer -->
    <link rel="stylesheet" type="text/css" href="app-assets/css/layouts/customizer.css">
    <!-- Pages -->
    <link rel="stylesheet" type="text/css" href="app-assets/css/pages/dashboard-analytics.css">

    <!-- Custom -->
    <link rel="stylesheet" type="text/css" href="assets/css/style.css">

    <title> Admin Dashboard </title>

</head>

<body >
    <main class="hp-bg-color-dark-90 d-flex min-vh-100">
        <?php include 'aside.php'; ?>

        <div class="hp-main-layout">
            <?php include 'top-nav.php'; ?>
            <?php include 'mobile-nav.php'; ?>

            <div class="hp-main-layout-content">
                <div class="row mb-32 gy-32">

                  <div class="col-12">
                      <div class="row align-items-center justify-content-between g-24">
                          <div class="col-12 col-md-6">
                              <h3> Hello, John 👋</h3>
                              <p> Role: Super Admin </p>
                              <p> Email: john@bamboosecurities.com </p>
                          </div>
                      </div>
                  </div>

                  <div class="col-12">
                      <div class="row g-32">

                        <div class="col-12 col-md-6 col-xl-4">
                            <div class="card">
                                <div class="card-body">
                                    <div class="row g-16">
                                        <div class="col-6 hp-flex-none w-auto">
                                            <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                <i class="iconly-Light-People text-dark hp-text-color-dark-primary-2" style="font-size: 24px;"></i>
                                            </div>
                                        </div>

                                        <div class="col">
                                            <h3 class="mb-4 mt-8"> 23 </h3>
                                            <a href="#"> Tenants  </a>
                                        </div>

                                    </div>
                                </div>
                            </div>
                        </div>

                          <div class="col-12 col-md-6 col-xl-4">
                              <div class="card">
                                  <div class="card-body">
                                      <div class="row g-16">
                                          <div class="col-6 hp-flex-none w-auto">
                                              <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                  <i class="iconly-Light-TwoUsers text-dark hp-text-color-dark-primary-2  " style="font-size: 24px;"></i>
                                              </div>
                                          </div>

                                          <div class="col">
                                              <h3 class="mb-4 mt-8"> 5,302 </h3>
                                              <a href="#"> Tenant Customers  </a>
                                          </div>

                                      </div>
                                  </div>
                              </div>
                          </div>

                          <div class="col-12 col-md-6 col-xl-4">
                              <div class="card">
                                  <div class="card-body">
                                      <div class="row g-16">
                                          <div class="col-6 hp-flex-none w-auto">
                                              <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                  <i class="ri-2x ri-stock-line text-dark" style="font-size: 24px;"></i>
                                              </div>
                                          </div>

                                          <div class="col">
                                              <h3 class="mb-4 mt-8"> 23 </h3>
                                              <a href="#"> Instruments  </a>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>

                          <div class="col-12 col-md-6 col-xl-4">
                              <div class="card">
                                  <div class="card-body">
                                      <div class="row g-16">
                                          <div class="col-6 hp-flex-none w-auto">
                                              <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                  <i class="ri-2x ri-account-box-line text-dark" style="font-size: 24px;"></i>
                                              </div>
                                          </div>

                                          <div class="col">
                                              <h3 class="mb-4 mt-8"> 10,3095 </h3>
                                              <a href="#"> Active Broker Accounts  </a>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>

                          <div class="col-12 col-md-6 col-xl-4">
                              <div class="card">
                                  <div class="card-body">
                                      <div class="row g-16">
                                          <div class="col-6 hp-flex-none w-auto">
                                              <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                  <i class="ri-2x ri-exchange-dollar-line text-dark" style="font-size: 24px;"></i>
                                              </div>
                                          </div>

                                          <div class="col">
                                              <h3 class="mb-4 mt-8"> USD 25,123 </h3>
                                              <a href="#"> Paid Commissions  </a>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>

                          <div class="col-12 col-md-6 col-xl-4">
                              <div class="card">
                                  <div class="card-body">
                                      <div class="row g-16">
                                          <div class="col-6 hp-flex-none w-auto">
                                              <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                  <i class="ri-2x ri-money-dollar-box-line text-dark" style="font-size: 24px;"></i>
                                              </div>
                                          </div>

                                          <div class="col">
                                              <h3 class="mb-4 mt-8"> USD 45,304 </h3>
                                              <a href="#"> Unpaid Commissions  </a>
                                          </div>
                                      </div>
                                  </div>
                              </div>
                          </div>

                          <div class="col-12 col-xl-12">
                              <div class="row g-32">

                                <div class="col-12 col-md-6 col-xl-4">
                                    <div class="card">
                                        <div class="card-body">
                                            <div class="row g-16">
                                                <div class="col-6 hp-flex-none w-auto">
                                                    <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                        <i class="ri-2x ri-user-unfollow-line text-dark" style="font-size: 24px;"></i>
                                                    </div>
                                                </div>

                                                <div class="col">
                                                    <h3 class="mb-4 mt-8"> 34 </h3>
                                                    <a href="#"> Suspended Tenants  </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-12 col-md-6 col-xl-4">
                                    <div class="card">
                                        <div class="card-body">
                                            <div class="row g-16">
                                                <div class="col-6 hp-flex-none w-auto">
                                                    <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                        <i class="ri-2x ri-admin-line text-dark" style="font-size: 24px;"></i>
                                                    </div>
                                                </div>

                                                <div class="col">
                                                    <h3 class="mb-4 mt-8"> 3493 </h3>
                                                    <a href="#"> Suspended Users  </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-12 col-md-6 col-xl-4">
                                    <div class="card">
                                        <div class="card-body">
                                            <div class="row g-16">
                                                <div class="col-6 hp-flex-none w-auto">
                                                    <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                        <i class="ri-2x ri-map-pin-line text-dark" style="font-size: 24px;"></i>
                                                    </div>
                                                </div>

                                                <div class="col">
                                                    <h3 class="mb-4 mt-8"> 15 </h3>
                                                    <a href="#"> Active Countries  </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-12 col-md-6 col-xl-4">
                                    <div class="card">
                                        <div class="card-body">
                                            <div class="row g-16">
                                                <div class="col-6 hp-flex-none w-auto">
                                                    <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                        <i class="ri-2x ri-arrow-down-line text-dark" style="font-size: 24px;"></i>
                                                    </div>
                                                </div>

                                                <div class="col">
                                                    <h3 class="mb-4 mt-8"> USD 53,302,405 </h3>
                                                    <a href="#"> Buy Orders  </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-12 col-md-6 col-xl-4">
                                    <div class="card">
                                        <div class="card-body">
                                            <div class="row g-16">
                                                <div class="col-6 hp-flex-none w-auto">
                                                    <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                        <i class="ri-2x ri-arrow-up-line text-dark" style="font-size: 24px;"></i>
                                                    </div>
                                                </div>

                                                <div class="col">
                                                    <h3 class="mb-4 mt-8"> 234,495,340 </h3>
                                                    <a href="#"> Sell Orders  </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <div class="col-12 col-md-6 col-xl-4">
                                    <div class="card">
                                        <div class="card-body">
                                            <div class="row g-16">
                                                <div class="col-6 hp-flex-none w-auto">
                                                    <div class="avatar-item d-flex align-items-center justify-content-center avatar-lg bg-dark-1 hp-bg-color-dark-light rounded-circle">
                                                        <i class="ri-2x ri-user-settings-line text-dark" style="font-size: 24px;"></i>
                                                    </div>
                                                </div>

                                                <div class="col">
                                                    <h3 class="mb-4 mt-8"> 7 </h3>
                                                    <a href="#"> Admin Operators  </a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>


                              </div>
                          </div>

                      </div>
                  </div>

                </div>
            </div>

        </div>
    </main>

    <?php include 'theme.php'; ?>

    <div class="scroll-to-top">
        <button type="button" class="btn btn-primary btn-icon-only rounded-circle hp-primary-shadow">
            <svg stroke="currentColor" fill="currentColor" stroke-width="0" viewBox="0 0 24 24" height="16px" width="16px" xmlns="http://www.w3.org/2000/svg">
                <g>
                    <path fill="none" d="M0 0h24v24H0z"></path>
                    <path d="M13 7.828V20h-2V7.828l-5.364 5.364-1.414-1.414L12 4l7.778 7.778-1.414 1.414L13 7.828z"></path>
                </g>
            </svg>
        </button>
    </div>

    <!-- Plugin -->
    <script src="app-assets/js/plugin/jquery.min.js"></script>
    <script src="app-assets/js/plugin/bootstrap.bundle.min.js"></script>
    <script src="app-assets/js/plugin/swiper-bundle.min.js"></script>
    <script src="app-assets/js/plugin/jquery.mask.min.js"></script>
    <script src="app-assets/js/plugin/autocomplete.min.js"></script>
    <script src="app-assets/js/plugin/moment.min.js"></script>

    <!-- Layouts -->
    <script src="app-assets/js/layouts/header-search.js"></script>
    <script src="app-assets/js/layouts/sider.js"></script>
    <script src="app-assets/js/components/input-number.js"></script>

    <!-- Base -->
    <script src="app-assets/js/base/index.js"></script>
    <!-- Customizer -->
    <script src="app-assets/js/customizer.js"></script>
    <!-- Charts -->
    <script src="app-assets/js/plugin/apexcharts.min.js"></script>
    <script src="app-assets/js/charts/apex-chart.js"></script>

    <!-- Custom -->
    <script src="assets/js/main.js"></script>
</body>

</html>
