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

    <section>
        <style>
            section{
                margin-bottom: 20px;
            }
            h1{
                margin-top: 1em;
                margin-left: 1em;
                font-size: 76px;
            }
        </style>
        <h1>
            <%= userInfo.user_Name %>
        </h1>
        <div class="row">
            <div class="col-md-4">
                <br><br><br>
                <div class="container text-center">
                    <svg xmlns="http://www.w3.org/2000/svg" width="300" height="300" fill="currentColor" class="bi bi-person-fill"
                        viewBox="0 0 16 16">
                        <path d="M3 14s-1 0-1-1 1-4 6-4 6 3 6 4-1 1-1 1H3Zm5-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z" />
                    </svg>
                </div>
            </div>
            <div class="col-md-8">
                <br><br><br>
                <div class="row g-2">
                    <div class="col-md">
                        <form class="form-floating">
                            <input type="email" class="form-control" id="floatingInputValue" value="<%=userInfo.user_Name%>" disabled>
                            <label for="floatingInputValue">Nombre:</label>
                        </form>
                    </div>
                    <div class="col-md">
                        <form class="form-floating">
                            <input type="password" class="form-control" id="floatingInputValue" value="<%=userInfo.user_Name%>" disabled>
                            <label for="floatingInputValue">Contraseña:</label>
                        </form>
                    </div>
                </div>
                <br><br><br>
                <div class="row g-2">
                    <div class="col-md">
                        <form class="form-floating">
                            <input type="email" class="form-control" id="floatingInputValue" value="<%=userInfo.user_Mail%>" disabled>
                            <label for="floatingInputValue">Correo:</label>
                        </form>
                    </div>
                    <div class="col-md">
                        <form class="form-floating">
                            <input type="text" class="form-control" id="floatingInputValue"  value="<%=userInfo.user_Skill%>" disabled>
                            <label for="floatingInputValue">Skill:</label>
                        </form>
                    </div>
                </div>
                <br><br><br>
                <div class="row g-2">
                    <div class="col-md">
                        <form class="form-floating">
                            <input type="tel" class="form-control" id="floatingInputValue" placeholder="name@example.com" value="<%=userInfo.user_Phone%>" disabled>
                            <label for="floatingInputValue">Teléfono:</label>
                        </form>
                    </div>
                    <div class="col-md">
                        <form class="form-floating">
                            <input type="text" class="form-control" id="floatingInputValue" placeholder="name@example.com" value="<%=userInfo.user_WeeklyAgilePoints%>" disabled>
                            <label for="floatingInputValue">WeeklyAP:</label>
                        </form>
                    </div>
                </div>
                <br><br><br><br>
            </div>
        </div>

        <div class="container text-center">
            <div class="row">
                <div class="col-md-4">
                    <a class="btn btn-outline-secondary" type="button" href="/inicio">
                        Regresar  
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-arrow-return-left" viewBox="0 0 16 16">
                            <path fill-rule="evenodd" d="M14.5 1.5a.5.5 0 0 1 .5.5v4.8a2.5 2.5 0 0 1-2.5 2.5H2.707l3.347 3.346a.5.5 0 0 1-.708.708l-4.2-4.2a.5.5 0 0 1 0-.708l4-4a.5.5 0 1 1 .708.708L2.707 8.3H12.5A1.5 1.5 0 0 0 14 6.8V2a.5.5 0 0 1 .5-.5z"/>
                        </svg>
                    </a>
                </div>
                <div class="col-md-4">
                    <a class="btn btn-outline-secondary" type="button" href="#">
                        Editar
                        <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-pencil-square" viewBox="0 0 16 16">
                            <path d="M15.502 1.94a.5.5 0 0 1 0 .706L14.459 3.69l-2-2L13.502.646a.5.5 0 0 1 .707 0l1.293 1.293zm-1.75 2.456-2-2L4.939 9.21a.5.5 0 0 0-.121.196l-.805 2.414a.25.25 0 0 0 .316.316l2.414-.805a.5.5 0 0 0 .196-.12l6.813-6.814z"/>
                            <path fill-rule="evenodd" d="M1 13.5A1.5 1.5 0 0 0 2.5 15h11a1.5 1.5 0 0 0 1.5-1.5v-6a.5.5 0 0 0-1 0v6a.5.5 0 0 1-.5.5h-11a.5.5 0 0 1-.5-.5v-11a.5.5 0 0 1 .5-.5H9a.5.5 0 0 0 0-1H2.5A1.5 1.5 0 0 0 1 2.5v11z"/>
                          </svg>
                      </a>
                </div>
                <div class="col-md-4">
                    <a class="btn btn-outline-danger" type="button" href="/usuarios/logout">Cerrar sesión</a>
                </div>
            </div>
        </div>
    </section>

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