/* auth.css — вход и регистрация.
   Поля и кнопка берутся из base.css (.editor-form и компания), здесь только
   раскладка страницы и то, чего в общих примитивах нет. */

body {
    background-color: #e9e7e7;
    min-height: 100vh;
    font-family: "Inter", sans-serif;
    color: #1a1a1a;
}

.auth-page {
    /* 58px — высота фиксированной шапки, она не занимает места в потоке */
    min-height: calc(100vh - 58px);
    margin-top: 58px;
    padding: 40px 20px 80px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.auth-card {
    width: 100%;
    max-width: 460px;
}

.auth-title {
    font-family: "Archivo Black", sans-serif;
    font-size: clamp(28px, 6vw, 40px);
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    margin-bottom: 8px;
}

.auth-subtitle {
    text-align: center;
    font-size: 15px;
    color: #5f5f5f;
    line-height: 1.5;
    margin-bottom: 28px;
}

/* Кнопка отправки на всю ширину — в форме входа она единственная и
   выравнивание по левому краю (как в .editor-submit-btn) тут ни к чему. */
.auth-card .editor-submit-btn {
    align-self: stretch;
    text-align: center;
    padding: 16px 24px;
}

/* Сообщение над кнопкой (.form-message) и подсказка под полем (.field-hint)
   описаны в base.css: их используют и вход, и создание обсуждения. */

.auth-switch {
    margin-top: 22px;
    text-align: center;
    font-size: 15px;
    color: #5f5f5f;
}
.auth-switch a {
    color: #1a1a1a;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid #cacaca;
    transition: border-color 0.2s ease;
}
.auth-switch a:hover {
    border-color: #1a1a1a;
}

@media (max-width: 480px) {
    .auth-page {
        padding: 24px 16px 60px 16px;
        justify-content: flex-start;
    }
    .editor-form {
        padding: 24px 20px;
    }
}