{% load i18n static mingo_settings %}
<style>
    body {
        background-image: url('/static/media/auth/bg10.jpeg');
    }
    [data-bs-theme="dark"] body {
        background-image: url('/static/media/auth/bg10-dark.jpeg');
    }
</style>

<div class="d-flex flex-column flex-lg-row flex-column-fluid">
    <div class="d-flex flex-lg-row-fluid">
        <div class="d-flex flex-column flex-center pb-0 pb-lg-10 p-10 w-100">
            <img class="theme-light-show mx-auto mw-100 w-150px w-lg-300px mb-10 mb-lg-20" src="/static/media/auth/agency.png" alt="">
            <img class="theme-dark-show mx-auto mw-100 w-150px w-lg-300px mb-10 mb-lg-20" src="/static/media/auth/agency-dark.png" alt="">
            <h1 class="text-gray-800 fs-2qx fw-bold text-center mb-7"> Fast, Efficient and Productive</h1>
            <div class="text-gray-600 fs-base text-center fw-semibold"></div>
        </div>
    </div>
    <!--begin::Aside-->

    <!--begin::Body-->
    <div class="d-flex flex-column-fluid flex-lg-row-auto justify-content-center justify-content-lg-end p-12">
        <div class="bg-body d-flex flex-column flex-center rounded-4 w-md-600px p-10">
            <div class="d-flex flex-center flex-column align-items-stretch h-lg-100 w-md-400px">
                <div class="d-flex flex-center flex-column flex-column-fluid pb-15 pb-lg-20">
                    <form class="form w-100" action="{{ app_path }}" method="post" id="login-form">
                        {% csrf_token %}
                        <div class="text-center mb-11">
                            <h1 class="text-gray-900 fw-bolder mb-3">Sign In</h1>
                            <div class="text-gray-500 fw-semibold fs-6">Your Journey Starts Here.</div>
                        </div>
                        {% if form.errors and not form.non_field_errors %}
                            <p class="text-danger">{% blocktranslate count counter=form.errors.items|length %}Please correct the error below.{% plural %}Please correct the errors below.{% endblocktranslate %}</p>
                        {% endif %}

                        {% if form.non_field_errors %}
                            {% for error in form.non_field_errors %}
                            <p class="text-danger">{{ error }}</p>
                            {% endfor %}
                        {% endif %}
                        
                        <div class="fv-row mb-8">
                            {{ form.username.errors }}
                            {{ form.username }}
                        </div>
                        <div class="fv-row mb-3">
                            {{ form.password.errors }}
                            {{ form.password }}
                            <input type="hidden" name="next" value="{{ next }}">
                        </div>
                        <div class="d-flex flex-stack flex-wrap gap-3 fs-base fw-semibold mb-8">
                            <div></div>
                            {% url 'admin_password_reset' as password_reset_url %}
                            {% if password_reset_url %}
                                <a href="{{ password_reset_url }}" class="link-primary">Forgot Password ?</a>
                            {% endif %}
                        </div>
                        <div class="d-grid mb-10">
                            <button type="submit" id="kt_sign_in_submit" class="btn btn-primary">
                                <span class="indicator-label">Log In</span>
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>