<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Subscription</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet"
    integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
  <link rel="stylesheet" href="<?=URL?>/assets/css/custom.css">
  <link rel="stylesheet" href="<?=URL?>/assets/plugin/sweetalert/sweetalert.css">
  <script src="<?=URL?>/assets/js/jquery-3.7.1.min.js"></script>
  <script src="<?=URL?>/assets/plugin/sweetalert/jquery.sweet-alert.custom.js"></script>
  <script src="<?=URL?>/assets/plugin/sweetalert/sweetalert.min.js"></script>
  <script src="<?=URL?>/assets/js/common.js?v=<?=CURRENT_VERSION?>"></script>
  <script>
    let SITE_URL='<?=URL?>';
    let ajax_url=SITE_URL+'/?ajax=1';
  </script>
  </head>

<body class="bg-light">
  <header>
    <div class="contianer">
      <div class="row">
        <div class="col-md-12">

          <nav class="navbar navbar-dark navbar-expand-lg fixed-top" style="background: #0e3a71 !important">
            <div class="container">
              <a href="/" class="navbar-brand d-flex">
                <div>
                  <img style="height: 60px;" src="./assets/images/bplogo2.png" alt="">
                </div>
                <!-- <div>
              <h1 class="site-name mt-3 ml-3" style="font-size: 28px">Service Subscription</h1>
            </div> -->
              </a>

              <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
                data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false"
                aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
              </button>

              <div id="navbarNavAltMarkup" class="collapse navbar-collapse">
                <ul class="navbar-nav ms-auto">
                  <li class="nav-item">
                    <a href="<?=URL?>" class="nav-link active">
                      Service Payment
                    </a>
                  </li>
                  <li class="nav-item ">
                    <a href="<?=URL?>/?bil-history"
                      class="nav-link active ">
                      Bill History
                    </a>
                  </li>
                </ul>
              </div>
            </div>
          </nav>
        </div>
      </div>
    </div>
  </header>
  <main style="margin-top: 100px">
    <div class="container">
      <div class="row">