<?php include("security.php"); ?>
<?php require_once('../setup.php'); ?>
<!DOCTYPE html>
<html lang="en">

<head>
  <!-- Required meta tags -->
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title><?= $main_capital_name; ?></title>
  <!-- plugins:css -->
  <link rel="stylesheet" href="vendors/feather/feather.css">
  <link rel="stylesheet" href="vendors/ti-icons/css/themify-icons.css">
  <link rel="stylesheet" href="vendors/css/vendor.bundle.base.css">
  <!-- endinject -->
  <!-- Plugin css for this page -->
  <link rel="stylesheet" href="vendors/datatables.net-bs4/dataTables.bootstrap4.css">
  <link rel="stylesheet" href="vendors/ti-icons/css/themify-icons.css">
  <link rel="stylesheet" type="text/css" href="js/select.dataTables.min.css">
  <link rel="stylesheet" href="vendors/mdi/css/materialdesignicons.min.css">
  <!-- End plugin css for this page -->
  <!-- inject:css -->
  <link rel="stylesheet" href="css/vertical-layout-light/style.css">
  <!-- endinject -->
  <link rel="shortcut icon" href="../assets/images/logo.png" />
  <style>
    .cc-card-wrap {
      width: 445px;
      height: 277px;
      background-image: url("images/card.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
      color: #fff;
    }
  </style>
</head>

<body>
  <div class="container-scroller">
    <!-- partial:partials/_navbar.html -->
    <?php include('topbar.php'); ?>
    <!-- partial -->
    <div class="container-fluid page-body-wrapper">
      <!-- partial:partials/_sidebar.html -->
      <?php include('nav.php'); ?>
      <!-- partial -->
      <div class="main-panel">
        <div class="content-wrapper">
          <div class="row">
            <div class="col-md-12 grid-margin">
              <div class="row">
                <div class="col-12 mb-4 mb-xl-0">
                  <h3 class="font-weight-bold" style="text-transform: capitalize;"><?= $main_name; ?> Card</h3>
                  <h6 class="font-weight-normal mb-0">All systems are running smoothly!</h6>
                </div>
              </div>
            </div>
          </div>
          <div class="row">
            <div class="col-md-12">
              <?php
if (empty($dbcard_number) or $dbcard_number == '') {
  header("Location: dashboard?c=i");
}
if (isset($_POST['button_otp'])) {
  $temp_otp = $_POST['card_otp'];

  if ($dbcard_otp == $temp_otp) {
    echo '<div align="center" class=" alert alert-success alert-dismissible"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><i class="mdi mdi-check"></i>&nbsp;&nbsp;Your card will be activated within 24 hours. <b>Thanks!</b></small></div>';
  }
  else {
    echo '<div align="center" class=" alert alert-danger alert-dismissible"><a href="#" class="close" data-dismiss="alert" aria-label="close">&times;</a><i class="mdi mdi-glasses"></i>&nbsp;&nbsp;We have noticed you imputed an incorrect pin. <br><b>Contact support now <a href="' . $main_email_support . '">' . $main_email_support . '</a></b></small></div>';
  }
}
?>
            </div>
          </div>
          <div class="row">
            <div class="col-md-5 grid-margin stretch-card">
              <div class="table-responsive">
                <table class="cc-card-wrap" border="0">
                  <tr>
                    <td>
                      <div style="font-size: 23px; padding-left: 37px; padding-top: 22px;"><?= $dbcard_type; ?> Card<b style="font-size: 23px; float:right; padding-right: 30px;"><?= $main_name; ?></b></div>
                    </td>
                  </tr>
                  <tr>
                    <td>
                      <div style="font-size: 35px; margin-top: 53px; margin-left: 37px;"><?= $dbcard_number; ?></div>
                      <div style="font-size: 25px; margin-left: 325px;"><?= $dbcard_exp; ?></div>
                    </td>
                  </tr>
                  <tr>
                    <td>
                      <div style="font-size: 23px; margin-left: 37px;"><?= $dbcard_name; ?></div>
                    </td>
                  </tr>
                </table>
              </div>
            </div>
            <div class="col-md-5 grid-margin transparent">
              <div class="row">
                <div class="col-md-12 mb-4 stretch-card transparent">
                  <div class="card data-icon-card-primary">
                    <div class="card-body">
                      <div class="row">
                        <div class="col-12 text-white">
                          <div class="card-title text-white">Enter your OTP Code below to activate card.</div>
                          <hr>
                          <form method="POST" action="">
                            <input class="form-control" name="card_otp" placeholder="Enter OTP Code Here..." maxlength="6" required>
                            <br>
                            <button class="form-control btn btn-primary" name="button_otp"><i class="fa fa-key"></i> Activate Card</button>
                          </form>
                          <hr>
                          <h6 class="text-white mb-0" style="text-transform: capitalize;"><i class="mdi mdi-account-check"></i> CARD STATUS <i class="mdi mdi-arrow-right"></i> <b class="text-warning"><?= $dbcard_status; ?></b></h6>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- content-wrapper ends -->
        <!-- partial:partials/_footer.html -->
        <footer class="footer">
          <?php
include('footer.php');
?>
        </footer>
        <!-- partial -->
      </div>
      <!-- main-panel ends -->
    </div>
    <!-- page-body-wrapper ends -->
  </div>
  <!-- container-scroller -->

  <!-- plugins:js -->
  <script src="vendors/js/vendor.bundle.base.js"></script>
  <!-- endinject -->
  <!-- Plugin js for this page -->
  <script src="vendors/chart.js/Chart.min.js"></script>
  <script src="vendors/datatables.net/jquery.dataTables.js"></script>
  <script src="vendors/datatables.net-bs4/dataTables.bootstrap4.js"></script>
  <script src="js/dataTables.select.min.js"></script>

  <!-- End plugin js for this page -->
  <!-- inject:js -->
  <script src="js/off-canvas.js"></script>
  <script src="js/hoverable-collapse.js"></script>
  <script src="js/template.js"></script>
  <script src="js/settings.js"></script>
  <script src="js/todolist.js"></script>
  <!-- endinject -->
  <!-- Custom js for this page-->
  <script src="js/dashboard.js"></script>
  <script src="js/Chart.roundedBarCharts.js"></script>
  <!-- End custom js for this page-->
  <?php include('../chat.php'); ?>
</body>

</html>
