<div class="comment-form my-5">
    <p class="position-relative fs-4 fw-bold sp-module-title">Añadir Comentario</p>
    
    <div class="container mt-4">
    <div class="row justify-content-center">
        <div class="col-lg-6 col-md-8 col-12">
            <form class="comment-form" method="post" action="{{ site.link ~ '/wp-comments-post.php' }}">
                {% if user %}

                    <div class="mb-3 row">
                        <label for="nombre" class="form-label">Nombre</label>
                        <input class="form-control form-control-sm" type="text" name="author" value="{{ user.name }}" />
                    </div>

                    <div class="mb-3 row">
                        <label for="nombre" class="form-label">Email</label>
                        <input class="form-control form-control-sm" type="email" name="email" value="{{ user.email }}" />
                    </div>

                    <input type="hidden" name="url" value="{{ user.link }}" />

                {% else %}
                    <div class="mb-3">
                        <label for="nombre" class="form-label">Email</label>
                        <input class="form-control form-control-sm" required name="email" type="email" id="email" />
                    </div>

                    <div class="mb-3">
                        <label for="nombre" class="form-label">Nombre</label>
                        <input class="form-control form-control-sm" required name="author" type="text" />
                    </div>

                    <div class="mb-3">
                        <label for="nombre" class="form-label">Website</label>
                        <input class="form-control form-control-sm" name="url" type="url" />
                    </div>
                {% endif %}
                <div class="mb-3 row">
                    <label for="comment" class="form-label">Comentario</label>
                    <textarea class="form-control form-control-sm" placeholder="Deja un comentario..." name="comment" cols="60" rows="3">
                    </textarea>
                </div>

                <input name="comment_post_ID" value="{{ post.id }}" type="hidden" />
                <input name="comment_parent" value="{{ comment.id|default('0') }}" type="hidden" />

                <button type="submit" name="Submit" class="btn btn-primary-cnt">Enviar</button>
                <button type="reset" class="btn btn-primary-cnt">Cancelar</button>
                
                <div class="alert alert-warning mt-5" role="alert">
                    <p>Tu comentario será revisado por el administrador antes de ser publicado.</p>
                </div>
            </form>
        </div>
    </div>
    </div>
</div>
