<?php
session_start();
include_once('../include/session.php');
require_once '../include/class.user.php';
if (!isset($_SESSION['uname'])) {
    header("Location: login.php");
    exit();
}
$reg_user = new USER();

$uname = $_SESSION['uname'];
$stmt = $reg_user->runQuery("SELECT * FROM account WHERE uname = '$uname'");
$stmt->execute();
$row = $stmt->fetch(PDO::FETCH_ASSOC);

if (!isset($_SESSION['uname']) && $row['phone_verify'] == 0) {
    header('Location: login.php');
    exit();
}

if (isset($_SESSION['uname']) && $row['phone_verify'] == 1) {
    header('Location: pin_auth.php');
    exit();
}

if (isset($_POST['otp'])) {
    if ($_POST['otp'] === $row['tmp_otp']) {
        include_once("email_login_notification.php");
        header("Location: summary.php");
    } else {
        echo "<p style='text-decoration:bold;'>Oops!! you have entered a wrong otp code.</p>";
    }
}
?>

<html>
<head>
    <link rel="stylesheet" href="css/style.css">
    <link href="https://fonts.googleapis.com/css?family=Ubuntu" rel="stylesheet">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css">
    <title>Verify</title>
    <style>
        body {
            background-image: url('https://alphaedgecb.com/account/assets/bannerfront.jpg'); /* Background image URL */
            background-size: cover; /* Ensures the image covers the entire background */
            background-repeat: no-repeat; /* Prevents the image from repeating */
            background-position: center; /* Centers the image */
            font-family: 'Ubuntu', sans-serif;
        }

        .main {
            background-color: rgba(255, 255, 255, 0.9); /* Semi-transparent white for contrast */
            width: 400px;
            height: auto;  /* Adjust height to fit content properly */
            margin: 7em auto;
            border-radius: 1.5em;
            box-shadow: 0px 11px 35px 2px rgba(0, 0, 0, 0.14);
        }

        .sign {
            padding-top: 40px;
            color: #0000cc;
            font-weight: bold;
            font-size: 20px;
            text-align: center;
        }

        .un, .pass {
            width: 76%;
            color: rgb(38, 50, 56);
            font-weight: 700;
            font-size: 14px;
            letter-spacing: 1px;
            background: rgba(136, 126, 126, 0.04);
            padding: 10px 20px;
            border: 2px solid rgba(0, 0, 0, 0.02);
            border-radius: 20px;
            outline: none;
            box-sizing: border-box;
            margin: 30px auto; /* Center horizontally with auto margin */
            display: block; /* Ensures display is block for centering */
            text-align: center;
            font-family: 'Ubuntu', sans-serif;
        }

        .un:focus, .pass:focus {
            border: 2px solid rgba(0, 0, 0, 0.18) !important;
        }

        .submit {
            cursor: pointer;
            border-radius: 5em;
            color: #fff;
            background: linear-gradient(to right, #0000cc, #0000cc);
            border: 0;
            padding: 10px 40px;
            font-family: 'Ubuntu', sans-serif;
            margin: 20px auto; /* Center the submit button */
            font-size: 13px;
            display: block; /* Ensuring it centers properly */
            box-shadow: 0 0 20px 1px rgba(0, 0, 0, 0.04);
        }

        footer {
            text-align: center;
            padding-top: 20px;
        }

        @media (max-width: 600px) {
            .main {
                border-radius: 0px;
            }
        }
    </style>
</head>
<body>
    <?php
    if (isset($_GET['inactive'])) {
    ?>
        <div class='alert alert-info col-4'>
            <button class='close' data-dismiss='alert'>×</button>
            <strong>Sorry!</strong> This Account is not Activated. Contact CustomerCare to Activate it.
        </div>
    <?php
    }
    ?>
    
    <div class="main">
        <p class="sign">Please, insert the code<br> sent to your email/Phone!</p>
        
        <form method="POST" class="form1">
            <input type="text" name="otp" class="un" placeholder="Enter One Time Passcode (OTP)" autofocus />
            <button type="submit" name="login" class="submit">PROCEED</button>
            <footer>
                <p style="text-align: center;"> © AlphaEdge Commercial Bank. All Rights Reserved.</p>
            </footer>
        </form>
    </div>
</body>
</html>