/**
 * Chicken Community — Страница входа
 * Версия: 10.0.0
 */

.auth {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 40px 0 60px;
    min-height: calc(100vh - var(--header-height) - 200px);
}

.auth__card {
    width: 100%;
    max-width: 420px;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-lg);
    padding: 40px 32px;
    box-shadow: var(--shadow-card);
    text-align: center;
}

.auth__icon { font-size: 56px; line-height: 1; margin-bottom: 16px; }

.auth__title {
    font-size: 24px; font-weight: 800;
    color: var(--color-text); margin-bottom: 8px;
}

.auth__subtitle {
    font-size: 15px; color: var(--color-text-secondary);
    margin-bottom: 28px;
}

.auth__error {
    display: flex; align-items: center; gap: 10px;
    padding: 12px 16px;
    background: var(--color-danger-bg);
    color: var(--color-danger);
    border: 1px solid #EF9A9A;
    border-radius: var(--radius-sm);
    font-size: 14px; font-weight: 500;
    margin-bottom: 20px; text-align: left;
}

.auth__form { text-align: left; }

.auth__field { margin-bottom: 18px; }

.auth__label {
    display: block; font-size: 13px; font-weight: 600;
    color: var(--color-text-secondary); margin-bottom: 6px;
}

.auth__input {
    width: 100%; box-sizing: border-box;
    padding: 12px 14px;
    background: var(--color-bg);
    border: 2px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-size: 15px; font-family: inherit;
    color: var(--color-text);
    transition: border-color var(--transition), box-shadow var(--transition);
    outline: none;
}

.auth__input:focus {
    border-color: var(--color-primary);
    box-shadow: 0 0 0 4px rgba(255, 184, 0, 0.15);
}

.auth__password-wrap { position: relative; }

.auth__password-wrap .auth__input { padding-right: 48px; }

.auth__toggle-pass {
    position: absolute; right: 8px; top: 50%;
    transform: translateY(-50%);
    width: 36px; height: 36px;
    display: flex; align-items: center; justify-content: center;
    background: transparent; border: none; cursor: pointer;
    color: var(--color-text-muted);
    border-radius: 50%;
    transition: all var(--transition);
}

.auth__toggle-pass:hover {
    color: var(--color-text);
    background: var(--color-gray-100);
}

.auth__remember {
    display: flex; align-items: center; gap: 10px;
    font-size: 14px; color: var(--color-text-secondary);
    margin-bottom: 24px; cursor: pointer; user-select: none;
}

.auth__remember input { width: 16px; height: 16px; accent-color: var(--color-primary); }

.auth__submit {
    width: 100%; padding: 14px 24px;
    background: var(--color-primary);
    color: var(--color-black);
    border: none; border-radius: var(--radius-full);
    font-size: 15px; font-weight: 700; font-family: inherit;
    cursor: pointer; box-shadow: var(--shadow-primary);
    transition: all var(--transition);
}

.auth__submit:hover {
    background: var(--color-primary-dark);
    transform: scale(1.02);
    box-shadow: 0 6px 24px rgba(255, 184, 0, 0.4);
}

.auth__submit:active { transform: scale(0.98); }

.auth__footer { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--color-border); }

.auth__note {
    font-size: 13px; color: var(--color-text-muted);
    margin-bottom: 12px;
}

.auth__back {
    font-size: 14px; font-weight: 600;
    color: var(--color-text-secondary);
    transition: color var(--transition);
}

.auth__back:hover { color: var(--color-primary); }

@media (max-width: 480px) {
    .auth { padding: 20px 0 40px; }
    .auth__card { padding: 28px 20px; border-radius: var(--radius-md); }
    .auth__icon { font-size: 44px; }
    .auth__title { font-size: 20px; }
}