/* =========================
   MOBILE ONLY STYLES
========================= */
@media (max-width: 768px) {

    body {
        margin: 0;
        overflow-x: hidden;
    }
    /* Убираем центрирование как на десктопе */
    .mobile-body {
        min-height: 100vh;
        display: flex;
        align-items: center !important;
        justify-content: center !important;
        padding: 16px;
    }

    /* Карточка становится как full-screen блок */
    .mobile-card {
        box-shadow: none !important;
        border-radius: 20px !important;
        padding: 20px !important;
    }

    /* Заголовок крупнее и плотнее */
    .mobile-title {
        font-size: 22px !important;
        margin-bottom: 20px !important;
    }

    /* Форма — больше воздуха */
    .mobile-form {
        gap: 14px;
    }

    /* Инпуты — жирнее, удобнее для пальца */
    .mobile-input {
        padding: 14px !important;
        font-size: 16px !important;
        border-radius: 14px !important;
    }

    /* Убираем zoom на iOS */
    input {
        font-size: 16px !important;
    }

    /* Кнопки — большие, как в приложениях */
    .mobile-btn {
        padding: 16px !important;
        font-size: 16px !important;
        border-radius: 14px !important;
    }

    /* Активный эффект (как native app) */
    .mobile-btn:active {
        transform: scale(0.97);
    }

    /* Ошибки — компактнее */
    .text-red-500 {
        font-size: 13px !important;
    }

    /* Телефон блок */
    .flex > span {
        padding-left: 14px;
        padding-right: 14px;
        font-size: 14px;
    }

}