<%- include('includes/head.ejs') %>

<style>
    form{
        text-align: center; 
    }
    h1{
        text-align: center;
        padding-top: 30px;
    }
    .form-control{
        width: 400px;
        margin: 0 auto;
    }
</style>
<h1 class="title">Sign Up</h1>
<br>

<form action="/signup" method="POST">
    <input type="hidden" name="_csrf" value="<%= csrfToken %>" >
    <div class="mb-3">
        <label for="nombre" class="form-label"><strong>Nombre</strong></label>
        <input name="nombre" id="nombre" class="form-control" type="text">
      </div>
    <div class="mb-3">
        <label for="username" class="form-label"><strong>Username</strong></label>
        <input name="username" id="username" class="form-control" type="text">
      </div>
    <div class="mb-3">  
        <label for="password" class="form-label"><strong>Password</strong></label>
        <input name="password" id="password" class="form-control" type="password">
        <br><br>
        <input class="btn btn-primary" type="submit" value="Entrar">
    </div>
</form>

<%- include('includes/foot.ejs') %>