{% extends "base.html" %}

{% load static %}

{% block body_main %}
<style>
    .login-container {
        height: 100vh;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    }
    .login-card {
        border-radius: 15px;
        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
        border: none;
    }
    .form-control {
        height: 50px;
        border-radius: 8px;
        padding-left: 20px;
    }
    .btn-login {
        height: 50px;
        border-radius: 8px;
        font-weight: 600;
        background: linear-gradient(to right, #667eea, #764ba2);
        border: none;
    }
    .brand-logo {
        width: 80px;
        height: 80px;
        margin-bottom: 20px;
    }
</style>
<div class="container">
    <div class="row justify-content-center my-5">
        <div class="col-md-5 col-lg-4">
            <div class="login-card card p-4">
                <div class="card-body">
                    {% block form %}
                    {% endblock %}
                </div>
            </div>
        </div>
    </div>
</div>

    
{% endblock %}


