/* Адаптация модального окна авторизации и регистрации */
@media (max-width: 480px) {
    .modal {
        padding: 15px; /* Зазор, чтобы окно не сливалось с краями экрана */
        align-items: flex-start; /* Сдвигаем вверх, чтобы клавиатура не закрыла поля ввода */
        padding-top: 60px;
    }

    .modal-content {
        padding: 30px 20px;
        border-radius: 12px;
        max-width: 100%; /* Окно занимает всю доступную ширину */
    }

    .modal-content h2 {
        font-size: 22px;
        margin-bottom: 20px;
    }

    .input-group input {
        /* Размер 16px критичен для iOS, чтобы избежать авто-зума */
        font-size: 16px;
        padding: 14px; /* Увеличиваем высоту поля для удобного нажатия */
    }

    .login-submit {
        padding: 16px;
        font-size: 18px; /* Делаем кнопку более массивной */
    }

    .close-modal {
        top: 10px;
        right: 15px;
        font-size: 35px; /* Увеличиваем крестик для легкого закрытия пальцем */
    }

    .reg-link {
        font-size: 15px;
        margin-top: 20px;
    }
}

/* Адаптация профиля пользователя */
@media (max-width: 768px) {
    .user-profile-container {
        width: 100%; /* Растягиваем контейнер на мобилках */
        display: flex;
        justify-content: center;
    }

    .user-name-trigger {
        font-size: 14px;
        padding: 10px;
        background: rgba(46, 204, 113, 0.1); /* Легкий фон для удобства тапа */
        border-radius: 5px;
    }

    .profile-dropdown {
        position: fixed; /* Фиксируем по центру экрана на мобильных */
        top: auto;
        bottom: 20px; /* Прижимаем к низу для удобства большого пальца */
        right: 20px;
        left: 20px;
        min-width: 0;
        width: auto;
        box-shadow: 0 -5px 25px rgba(0,0,0,0.15);
        border: 1px solid #ddd;
        animation: slideUpMobile 0.3s ease-out;
    }

    .dropdown-item {
        padding: 15px 0; /* Увеличиваем область нажатия (tap target) */
        font-size: 16px;
        border-bottom: 1px solid #f9f9f9;
    }

    .dropdown-item:last-child {
        border-bottom: none;
    }
}

@keyframes slideUpMobile {
    from { transform: translateY(100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}