Вход в кабинет 

<!--  Tailwind CSS CDN link -->
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>

<!-- Fontawesome icons CDN link -->
<script src="https://kit.fontawesome.com/2bd40b5115.js" crossorigin="anonymous"></script>

<!-- Material icons CDN link -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

<!-- Google fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
      rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Tektur:wght@400..900&display=swap"
      rel="stylesheet">

<!-- Custom CSS -->
<link rel="stylesheet" href="/static/css/index.css">

<div class="absolute top-0 left-0 w-full h-full flex items-center justify-center"
     style="background: url('/static/images/auth/login/main.jpg'); background-repeat: repeat; background-position: center;">
    <form action="" method="post" class="flex flex-col gap-4 w-1/4">
        <!-- Header with back button and title -->
        <div class="flex flex-row items-center grid grid-cols-5">
            <a href="/" class="col-span-1 max-w-max border border-gray-700 pt-0.5 pb-1 text-gray-700 active:scale-95 hover:scale-105 transition hover:cursor-pointer px-1.5 rounded-full">
                <span class="material-icons mt-1">keyboard_arrow_left</span>
            </a>
            <h2 class="col-span-3 text-3xl text-center font-semibold text-gray-600">Вход в кабинет</h2>
            <div class="col-span-1"></div>
        </div>

        <input type="hidden" name="csrfmiddlewaretoken" value="mjeCkCNaDzwm0KCQv0heOw3NLhDoRBEcz8AC7iEaOj5oq8Pd9Fa2rKVlmEoB0iNu">

        <!-- Username -->
        <label for="username" class="sr-only">Имя пользователя</label>
        <input
            id="username"
            name="username"
            type="text"
            required
            autocomplete="username"
            autofocus
            class="outline-none p-2 border border-gray-500 font-semibold rounded-lg"
            placeholder="Имя пользователя"
        >

        <!-- Password -->
        <label for="password" class="sr-only">Пароль</label>
        <input
            id="password"
            name="password"
            type="password"
            required
            autocomplete="current-password"
            class="outline-none p-2 border border-gray-500 font-semibold rounded-lg"
            placeholder="Пароль"
        >

        <!-- Messages -->
        

        <!-- Submit -->
        <button class="focus:outline-blue-700 font-semibold bg-blue-500 text-white py-2 rounded hover:cursor-pointer hover:bg-blue-600 active:scale-95 transition">
            Войти
        </button>
    </form>
</div>