/**
 * Мобильная адаптивность для iPhone 15 Pro Max и других устройств
 * @author ast@atyx.ru
 */

/* Базовые стили для мобильных устройств */
@media screen and (max-width: 768px) {
    .main {
        margin: 0;
        padding: 0;
        width: 100%;
        min-height: 100vh;
    }

    /* Улучшенная прокрутка */
    * {
        -webkit-overflow-scrolling: touch;
    }
}

/* Минимальная ширина - сайт не ужимается меньше 390px */
@media screen and (max-width: 389px) {
    body {
        min-width: 390px;
        overflow-x: auto;
    }

    .main {
        min-width: 390px;
    }

    /* Принудительная горизонтальная прокрутка вместо сжатия */
    .qr-scanner-container {
        min-width: 390px;
    }

    .scanner-header {
        min-width: 390px;
    }

    .camera-selector {
        min-width: 390px;
    }

    .qr-message {
        min-width: 390px;
    }
}

/* iPhone 15 Pro Max и другие большие мобильные экраны */
@media screen and (max-width: 430px) {
    body {
        font-size: 16px; /* Предотвращает автоматическое масштабирование в iOS */
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    }

    .main {
        padding: 0;
        margin: 0;
    }

    /* Адаптивные формы */
    input, select, textarea {
        font-size: 16px; /* Предотвращает зум в iOS */
        padding: 12px;
        border-radius: 8px;
        border: 2px solid #e0e0e0;
        width: 100%;
        box-sizing: border-box;
    }

    input:focus, select:focus, textarea:focus {
        border-color: var(--ui-accent-color);
        outline: none;
        box-shadow: 0 0 0 3px rgba(145, 204, 72, 0.1);
    }

    /* Кнопки */
    button, .button {
        font-size: 16px;
        padding: 12px 24px;
        border-radius: 8px;
        border: none;
        color: white;
        cursor: pointer;
        transition: all 0.3s ease;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    button:hover, .button:hover {
        transform: translateY(-1px);
        box-shadow: 0 4px 12px rgba(145, 204, 72, 0.3);
    }

    button:active, .button:active {
        transform: translateY(0);
    }
}

/* Поддержка уменьшенной анимации */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}