<?php
ob_start();
session_start();
require_once($_SERVER['DOCUMENT_ROOT'] . "/include/Function.php");

// $user_id = userDetails('id');

if (isset($_SESSION["name"])) {
    if ((time() - $_SESSION['last_login_timestamp']) > 60) // 900 = 15 * 60  
    {
        header("location:logout");
    } else {
        $_SESSION['last_login_timestamp'] = time();
        echo "<h1 align='center'>" . $_SESSION["name"] . "</h1>";
        echo '<h1 align="center">' . $_SESSION['last_login_timestamp'] . '</h1>';
        echo "<p align='center'><a href='logout.php'>Logout</a></p>";
    }
}


if (!$_SESSION['acct_email']) {
    header("location:../login.php");
    exit;
}




// // audit_logs
$sql = "SELECT * FROM audit_logs ORDER BY datenow DESC";
$stmt = $conn->prepare($sql);
$stmt->execute();

$logs = $stmt->fetch(PDO::FETCH_ASSOC);

$acct_balance = $row['acct_balance'];

?>


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

<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">
    <meta name="referrer" content="no-referrer-when-downgrade">
    <meta name="description" content="Exchange cryptocurrencies easily">
   <title><?= $pageName?> - <?= $page['url_name'] ?></title>
    <link rel="stylesheet" href="<?= $web_url ?>/static/assets/flaticon/css/uicons-regular-rounded.css">
    <link rel="stylesheet" href="<?= $web_url ?>/static/vendor/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="<?= $web_url ?>/static/docs/css/light.css">
    <link rel="stylesheet" href="<?= $web_url ?>/static/docs/css/animate.css">
    <link rel="stylesheet" href="<?= $web_url ?>/static/docs/css/major.css">
    <link rel="stylesheet" href="<?= $web_url ?>/static/assets/css/fontawesome.css">
    <link rel="shortcut icon" type="image/jpg" href="<?= $web_url ?>/static/assets/images/bsc.png" />
    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Ubuntu|Roboto|Source Sans Pro|Merriweather Sans|Noto Sans">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

    <link href="https://fonts.googleapis.com/css2?family=Anuphan:wght@500&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Anuphan:wght@400&display=swap" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Anuphan:wght@600&display=swap" rel="stylesheet">

    <link href="https://fonts.googleapis.com/css?family=Material+Icons|Material+Icons+Outlined" rel="stylesheet">
    <link rel="stylesheet" href="<?= $web_url ?>/static/assets/plugin/jquery/jquery-ui.min.css">
    <!-- animate -->
    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.2/font/bootstrap-icons.css">
    <!-- particle JS -->
    <script src="<?= $web_url ?>/static/vendor/jquery/jquery.js"></script>
    <script src="<?= $web_url ?>/static/assets/plugin/particles-js/particles.js"></script>
    <script src="<?= $web_url ?>/static/assets/plugin/particles-js/app.js"></script>

    <style>
        @media(max-width:576px) {
            .eo-cm-ip {
                top: -35px !important;
            }
        }
    </style>
</head>

<body class="white-bg">

    <!-- Page Preloader -->
    <div class="page-preloader">
        <div class="page-preloader-wrapper">
            <div class="loader justify-content-center m-0" style="height: 10px;">
                <span class="bar" style="border-radius: 0px;"></span>
                <span class="bar" style="border-radius: 0px;"></span>
                <span class="bar" style="border-radius: 0px;"></span>
                <span class="bar" style="border-radius: 0px;"></span>
            </div>
        </div>
    </div>
    <!-- End Page Preloader -->

    <div class="site-container">
        <!-- mobile nav bar -->

        <!-- sidebar Mobile -->
        <div class="d-block d-sm-none">
            <div class="overlayDiv" id="overlayDiv" onclick="hideSideBarSm()" style="z-index: 9;"></div>
            <div class="side-bar-mobile white-bg" id="sideBarSm" style="display: none; width: 90%;">
                <div class="side-bar-mobile-inner anuphan-2">
                    <div class="mt-3 container" style="padding-bottom: 40px;">
                        <!-- --- -->
                        <div class="row mb-3 text-right border-bottom-light pb-3">
                            <div class="col-12">
                                <i class="material-icons grey-color" style="font-size: 22px;" onclick="hideSideBarSm()">close</i>
                            </div>
                        </div>



                        <a href="#">
                            <div class="side-link  p-2 mt-4">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">currency_bitcoin</i>
                                <span class="ml-1">Buy Crypto</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">equalizer</i>
                                <span class="ml-1">Market</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">swap_vertical_circle</i>
                                <span class="ml-1">Trade</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">token</i>
                                <span class="ml-1">Derivatives</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">savings</i>
                                <span class="ml-1">Earn</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">data_usage</i>
                                <span class="ml-1">Payment</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">settings_overscan</i>
                                <span class="ml-1">NFT</span>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">account_balance</i>
                                <span class="ml-1">Institutional</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">textsms</i>
                                <span class="ml-1">Feed</span>
                            </div>
                        </a>
                        <a href="#">
                            <div class="side-link  mt-3 p-2">
                                <i class="bi bi-grid-3x3-gap-fill grey-color-3" style="font-size: 14px;"></i>
                                <span class="ml-1">Products</span>
                                <i class="fa fa-caret-down grey-color-3 float-right top-3"></i>
                            </div>
                        </a>

                        <div class="mt-3 row border-top">
                            <div class="col-12">
                                <a href="#">
                                    <div class="side-link mt-1 p-2">
                                        <i class="material-icons grey-color-3 top-4" style="font-size: 18px;">api</i>
                                        <span class="ml-1">Theme</span>
                                        <i class="material-icons grey-color-3 top-4 float-right" style="font-size: 18px;">light_mode</i>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- ## -->
        <div class="d-none d-md-block row border-bottom">
            <div class="col-12">
                <nav class="navbar navbar-expand-lg px-4 sticky-top  dark-bg shadow-none" style="z-index:999 !important;">
                    <a class="navbar-brand" href="/">
                        <p class="m-0 name-brand bold-text">
                            <img src="<?= $web_url ?>/static/assets/images/logo.png" alt="bscotc" style="height: 25px; width: 130px;">
                        </p>
                    </a>
                    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                        <span class="navbar-toggler-icon"></span>
                    </button>
                    <div class="collapse navbar-collapse" id="navbarNav" style="font-family: 'anuphan';">
                        <ul class="navbar-nav" style="font-size: 14px;">
                            <li class="nav-item mt-2">
                                <i class="bi bi-grid-3x3-gap-fill" style="font-size: 20px;"></i>
                                <i class="bi bi-caret-down-fill grey-color ml-1 n-top-2" style="font-size: 12px;"></i>
                            </li>
                            <li class="nav-item ml-4">
                                <a href="#" class="nav-link xsmall  mt-2">
                                    Buy Crypto
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    Markets
                                    <i class="fa fa-caret-down grey-color-3"></i>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    Trade
                                    <i class="fa fa-caret-down grey-color-3"></i>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    Derivatives
                                    <i class="fa fa-caret-down grey-color-3"></i>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    Earn
                                    <i class="fa fa-caret-down grey-color-3"></i>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    Payment
                                    <i class="fa fa-caret-down grey-color-3"></i>
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    NFT
                                </a>
                            </li>
                            <li class="nav-item">
                                <a href="#" class="nav-link xsmall mt-2">
                                    Institutional
                                    <i class="fa fa-caret-down grey-color-3"></i>
                                </a>
                            </li>
                        </ul>

                        <ul class="navbar-nav ml-auto" style="font-size: 14px;">
                            <li class="nav-item mr-2 ml-4 mt-1">
                                <a href="./deposit.php" class="nav-link">
                                    <button class="px-4 py-1 xsmall anuphan reg-btn add-radius-sm">
                                        <i class="bi bi-download"></i>
                                        Deposit
                                    </button>
                                </a>
                            </li>
                            <li class="nav-item mt-3">
                                <img src="<?= $web_url ?>/static/assets/images/avatar-5.png" alt="profile" style="width: 25px; height: 25px;" class="n-top-2 pointer" onclick="accountMangt(this)">
                            </li>
                            <li class="nav-item mt-3">
                                <i class="bi bi-globe ml-3 n-top-3" style="font-size: 18px;"></i>
                            </li>
                            <li class="nav-item mt-3">
                                <i class="bi bi-moon-fill ml-3 n-top-1" style="font-size: 12px;"></i>
                            </li>
                        </ul>
                    </div>
                </nav>
            </div>
        </div>

        <!-- mobile nav bar -->
        <div class="d-block d-sm-none">
            <div class="container-fluid anuphan" style="z-index: 4;">
                <div class="row py-3">
                    <div class="col-5">
                        <a href="/">
                            <img src="<?= $web_url ?>/static/assets/images/logo.png" alt="bscotc" style="height: 25px; width: 120px;">
                        </a>
                    </div>
                    <div class="col-7">
                        <div class="d-flex justify-content-end">
                            <a href="./deposit.php">
                                <button class="anuphan-2 py-1 xsmall fit-content px-3">
                                    <i class="bi bi-download"></i>
                                    Deposit
                                </button>
                            </a>
                            <img src="<?= $web_url ?>/static/assets/images/avatar-5.png" alt="profile" style="width: 25px; height: 25px;" class="top-2 ml-3" onclick="accountMangt(this)">
                            <i class="material-icons ml-2 top-1" style="font-size: 30px;" onclick="openSideBarSm()">menu</i>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- account control panel -->
        <div class="account-control-panel-overlay" style="display: none; background: rgba(0, 0, 0, 0.2) !important;" onclick="closeAccountMangt()"></div>
        <div class="account-control-panel dark-bg3 shadow-sm p-0" style="padding: 0px; display: none; box-shadow: none; border-radius: 0;">
            <div>
                <div class="border-bottom mb-1">
                    <p class="m-0 mt-2 p-3">
                        <b><?= $row['acct_email'] ?></b>
                    </p>

                </div>

                <a href="./dashboard.php" class="mainWhite">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-3 grey-color-3" style="font-size: 18px">person</i> &nbsp;
                        <span>Dashboard</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./security.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-3 grey-color-3" style="font-size: 18px">lock</i> &nbsp;
                        <span>Security</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./settings.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-4 grey-color-3" style="font-size: 18px">tune</i> &nbsp;
                        <span>Settings</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./profile.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-3 grey-color-3" style="font-size: 18px">fact_check</i> &nbsp;
                        <span>Identification</span>
                    </div>
                </a>
                 <a class="mainWhite pointer" href="./ticket.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-3 grey-color-3" style="font-size: 18px">fact_check</i> &nbsp;
                        <span>Ticket</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./wallet.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-3 grey-color-3" style="font-size: 18px">account_balance_wallet</i> &nbsp;
                        <span>Wallet</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./transactions.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-4 grey-color-3" style="font-size: 18px">receipt_long</i> &nbsp;
                        <span>Orders</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./view-rooms.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-4 grey-color-3" style="font-size: 18px">token</i> &nbsp;
                        <span>OTC Orders</span>
                    </div>
                </a>
                <a class="mainWhite pointer" href="./otc.php">
                    <div class="a-p-inner px-3 py-2 pb-3">
                        <i class="material-icons top-4 grey-color-3" style="font-size: 18px">swap_horiz</i> &nbsp;
                        <span>New OTC Trade</span>
                    </div>
                </a>
                <!-- <a href="./logout.php">
                    <div class="a-p-inner px-3 py-2 pb-3" style="border-radius: 0px 0px 6px 6px;">
                        <i class="material-icons-outlined top-4 grey-color-3 mr-2" style="font-size: 18px;">logout</i>
                        <small class="xsmall">Sign out</small>
                    </div>
                </a> -->
            </div>
        </div>


        <script>
            // account management modal
            const accountMangt = (e) => {
                $('.account-control-panel-overlay').fadeIn(150)
                $('.account-control-panel').show('drop', {
                    direction: 'up'
                }, 200)
            }
            const closeAccountMangt = (e) => {
                $('.account-control-panel-overlay').fadeOut(150)
                $('.account-control-panel').hide('drop', {
                    direction: 'up'
                }, 200)
                $(e).attr('onclick', 'accountMangt(this)')
                $('.accountMangtBtn').each(function() {
                    $(this).attr('onclick', 'accountMangt(this)')
                })
            }
        </script>

        <!-- form loader -->
        <div class="dialog-xm activity-loader" style="display: none; background-color: rgba(0, 0, 0, 0.3);">
            <div class="dialog-content-xm fit-content dark-bg3 p-3 px-4 shadow-none" style="border-radius: 0px;">
                <div class="loader" style="height: 10px;">
                    <span class="bar" style="border-radius: 0px;"></span>
                    <span class="bar" style="border-radius: 0px;"></span>
                    <span class="bar" style="border-radius: 0px;"></span>
                    <span class="bar" style="border-radius: 0px;"></span>
                </div>
            </div>
        </div>
        <!-- auth form loader -->

        <!-- messages -->

        <!-- end messages -->