/* Мобильные настройки */
@media (max-width: 768px) {
    body {
        background-color: rgb(231, 231, 231); /* Устанавливаем однотонный цвет фона */
        background-image: none; /* Убираем фон с изображением */
        height: 100vh; /* Устанавливаем высоту на 100% высоты экрана */
        display: flex; /* Используем flex для центрирования блока */
        align-items: center; /* Вертикальное центрирование */
        justify-content: center; /* Горизонтальное центрирование */
    }

    .login-form {
        width: 90%; /* Ширина формы 90% от ширины экрана */
        padding: 20px; /* Уменьшаем отступы для маленьких экранов */
    }

    .login-form h1 {
        font-size: 20px; /* Уменьшаем размер заголовка */
    }

    .input-box {
        margin: 15px 0; /* Уменьшаем отступ между полями ввода */
    }

    .input-box input {
        height: 50px; /* Высота инпута увеличена для удобства ввода */
        font-size: 16px; /* Крупнее шрифт для удобства ввода */
        padding-left: 20px; /* Уменьшаем отступ для инпутов */
    }

    .input-box i {
        right: 20px; /* Позиционируем иконку внутри инпута */
        bottom: 10px;
        font-size: 20px; /* Уменьшаем размер иконки для мобильных */
    }

    .login-form .btn {
        width: 100%; /* Кнопка занимает всю ширину */
        margin-left: 0; /* Убираем левый отступ */
        margin-top: 20px; /* Отступ сверху */
        font-size: 16px; /* Уменьшаем размер шрифта на кнопке */
    }
}