/* Стили для форм входа и регистрации */
.login-form, .register-form {
    display: flex;
    flex-direction: column;      /* Элементы в колонку */
    align-items: center;         /* Центрирование элементов по горизонтали */
    justify-content: center;     /* Центрирование по вертикали */
    width: 700px;                /* Фиксированная ширина формы */
    background: linear-gradient(135deg, #877f9ebd 0%, #b097adb1 100%); /* Градиентный фон формы */
    padding: 32px 28px;          /* Внутренние отступы */
    border-radius: 18px;         /* Более сильное скругление углов */
    box-shadow: 0 8px 32px rgba(60,60,120,0.15); /* Глубокая тень для формы */
    border: 1.5px solid #c7d2fe; /* Легкая рамка */
    transition: box-shadow 0.3s;
    margin: 0 auto;   
    text-decoration: none           /* Центрирование по горизонтали, если вдруг не flex */
}

/* Эффект наведения на форму */
.login-form:hover, .register-form:hover {
    box-shadow: 0 12px 40px rgb(146, 0, 182);
}

/* Стили для полей ввода */
.login-form input, .register-form input,
.login-form button, .register-form button {
    width: 340px; /* Одинаковая ширина для всех элементов */
    min-height: 48px; /* Одинаковая высота для всех элементов */
    box-sizing: border-box;
    margin: 12px 0;
    border-radius: 8px;
    display: block;
    font-size: 1.05rem;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

/* Стили для полей ввода */
.login-form input, .register-form input {
    padding: 12px 14px;
    border: 1.5px solid #a5b4fc;
    background: #f8fafc;
    transition: border-color 0.2s, background 0.2s;
}

.login-form input:focus, .register-form input:focus {
    border-color: #63e8f1;
    outline: none;
    background: #eef2ff;
}
/* Стили для кнопок */
.login-form button, .register-form button {
    padding: 0;
    background: linear-gradient(90deg, #31e4c3 0%, #a00ee9 100%);
    color: #fff;
    font-weight: bold;
    border: none;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(99,102,241,0.10);
    transition: background 0.2s, box-shadow 0.2s, transform 0.1s;
    text-decoration: none; /* Убирает подчёркивание */
}

/* Убирает подчёркивание у ссылок регистрации */
.register-form a {
    text-decoration: none;
    color: inherit;
}

.login-form button:hover, .register-form button:hover {
    background: linear-gradient(90deg, #0ee9af 0%, #8646e5 100%);
    box-shadow: 0 4px 16px rgba(99,102,241,0.18);
    text-decoration: none; /* Убирает подчёркивание при наведении */
    transform: translateY(-2px) scale(1.03);
}

.login-form button:active, .register-form button:active {
    background: linear-gradient(90deg, #00ffaa 0%, #b116ff 100%);
    box-shadow: 0 1px 4px rgba(99,102,241,0.10);
    transform: translateY(1px) scale(0.98);
}
/* Размеры окна формы */
/* Ограничения размеров окна формы */
.warning {
    min-width: 340px;   /* Минимальная ширина формы */
    max-width: 700px;   /* Максимальная ширина формы */
    min-height: 30px;  /* Минимальная высота формы */
    max-height: 30px;  /* Максимальная высота формы */
}

/* Стили для предупреждающих сообщений */
.warning { /* Стили для предупреждающих сообщений */
    color: #d70040; /* Ярко-красный текст */
    font-size: 1.13rem;
    margin-bottom: 1px; /* уменьшен отступ снизу */
    margin-top: 1px;
    text-align: center;
    font-weight: 700;
    background: linear-gradient(90deg, #d7d7d7 0%, #cfcdcd 100%);
    padding: 8px 14px; /* уменьшены внутренние отступы */
    box-shadow: 0 2px 10px rgba(215,0,64,0.07);
    letter-spacing: 0.02em;
    border-radius: 8px; /* Скругление углов */
    border: 1px solid #d70040; /* Красная рамка */
    display: flex; /* Flexbox для выравнивания иконки */}
.warning {
    display: flex;
    align-items: center;
}
/* Добавляет иконку предупреждения перед текстом предупреждения */
.warning:before {
    content: "⚠"; /* Символ предупреждения */
    color: #000; /* Цвет иконки */
    font-size: 2.2em; /* Размер иконки */
    background: linear-gradient(180deg, #ffe066 0%, #fff3cd 100%);
    box-shadow: 0 2px 8px rgba(255, 224, 102, 0.25); /* Лёгкая тень для выделения */
    padding-left: 8px;
    padding-right: 8px;
    border-radius: 40x 0 0 40px; /* Скругление углов (ошибка: должно быть 40px) */
    padding: 0 1px; /* Внутренний отступ справа и слева */
    margin-right: 2px; /* Отступ справа от иконки */
    border-right: 2px solid #ff9d00; /* Ошибка: некорректное свойство, должно быть border-right: 2px solid #ff9d00; */
    height: 28px; /* Высота блока с иконкой */
    display: flex; /* Использование flex для выравнивания */
    align-items: center; /* Вертикальное выравнивание иконки */
}