<!doctype html>
<html lang="{{ current_locale() }}" class="h-100">
    {% set current_theme = current_theme() %} {% from "macros/form_errors.j2" import render_field_errors, render_form_errors %}

    <head>
        <title>{{_("Inicio de sesión")}}.</title>

        {{ current_theme.headertags() }} {{ current_theme.local_style() }}
        <title>{{_("Inicio de sesión")}}</title>

        <style>
            .bd-placeholder-img {
                font-size: 1.125rem;
                text-anchor: middle;
                -webkit-user-select: none;
                -moz-user-select: none;
                user-select: none;
            }

            @media (min-width: 768px) {
                .bd-placeholder-img-lg {
                    font-size: 3.5rem;
                }
            }
        </style>
        <!-- Custom styles for this template -->
        <link href="{{ url_for('static', filename='css/signin.css') }}" rel="stylesheet" />
    </head>

    <body class="text-center">
        <main class="form-signin">
            <form method="post">
                {{ form.csrf_token }} {{ render_form_errors(form) }}
                <a href="{{ url_for('home.pagina_de_inicio') }}">
                    <img
                        class="mb-4"
                        src="{{ url_for('static', filename='icons/logo/logo.svg') }}"
                        alt="NOW - LMS"
                        width="200"
                    />
                </a>
                <h1 class="h3 mb-3 fw-normal">{{_("Inicio de Sesión")}}</h1>
                {% with messages = get_flashed_messages() %}{% if messages %}{% for message in messages %}
                <div class="alert alert-success">{{ message }}</div>
                {% endfor %}{% endif %}{% endwith %}
                <label for="usuario" class="visually-hidden">{{ _("Usuario") }}</label>
                {{ form.usuario( class="form-control", id="usuario", placeholder=_("Usuario"), autocomplete="username",
                autocapitalize="off", autocorrect="off", spellcheck="false" ) }} {{ render_field_errors(form.usuario) }}

                <label for="acceso" class="visually-hidden">{{ _("Contraseña") }}</label>
                {{ form.acceso( class="form-control", id="acceso", placeholder=_("Contraseña"), type="password",
                autocomplete="current-password", autocapitalize="off", autocorrect="off", spellcheck="false" ) }} {{
                render_field_errors(form.acceso) }}
                <button class="w-100 btn btn-lg btn-primary btn-block" type="submit">{{_("Iniciar Sesión")}}</button>
                {% if show_forgot_password %}
                <div class="mt-3">
                    <a href="{{ url_for('user.forgot_password') }}" class="text-decoration-none">
                        <i class="bi bi-key" aria-hidden="true"></i> {{_("¿Olvidaste tu contraseña?")}}
                    </a>
                </div>
                {% endif %}
                <a href="{{ url_for('home.pagina_de_inicio') }}"
                    ><i class="bi bi-arrow-left" aria-hidden="true"></i> {{_("Regresar")}}</a
                >
                <p class="mt-5 mb-3 text-muted text-center">BMO Soluciones &copy; 2025</p>
                <img src="{{ url_for('static', filename='/img/bmo-logo.png') }}" alt="BMO Soluciones" />
            </form>
        </main>
    </body>
</html>
