<?php
require_once 'includes/config.php';
require_once 'includes/Otp.php';

$otp = new Otp();

$phone = $_POST['phone'];     // digits only
$input = $_POST['otp_code']; // what user entered

$result = $otp->verify($phone, $input);

if ($result['ok']) {
    // ✅ Correct and not expired
    session_start();
    $_SESSION['verified_phone'] = $phone;
    header('Location: /dashboard.php');
    exit;
} else {
    // ❌ Wrong, expired, or too many tries
    $error = $result['msg']; // "Wrong OTP. 2 attempt(s) left."
}

<!-- Login form — 2 steps: phone → OTP -->

<!-- Step 1 -->
<div id="step1">
  <input type="tel" id="phone" placeholder="8801712345678"/>
  <button onclick="sendStep()">Send OTP</button>
</div>

<!-- Step 2 -->
<div id="step2" style="display:none">
  <input type="text" id="otp" maxlength="6" placeholder="Enter OTP"/>
  <button onclick="verifyStep()">Verify</button>
</div>

<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
function sendStep() {
  $.post('ajax.php', { action: 'send_otp', phone: $('#phone').val() }, function(r) {
    if (r.success) { $('#step1').hide(); $('#step2').show(); }
    else alert(r.error);
  });
}
function verifyStep() {
  $.post('ajax.php', { action: 'verify_otp', phone: $('#phone').val(), code: $('#otp').val() }, function(r) {
    if (r.ok) { alert('Verified! Redirecting...'); location.href='/dashboard.php'; }
    else alert(r.msg);
  });
}
</script>