/* Исправление горизонтальной прокрутки на мобильных устройствах */

/* Основные исправления */
html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
}

/* Контейнеры */
.container {
    max-width: 100% !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
}

/* Flex элементы */
.flex {
    flex-wrap: wrap !important;
    max-width: 100% !important;
}

/* Grid элементы */
.grid {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

/* Изображения */
img {
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* Таблицы */
table {
    width: 100% !important;
    table-layout: fixed !important;
    overflow-x: auto !important;
    display: block !important;
}

/* Элементы с фиксированной шириной */
[style*="width"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Элементы с отрицательными отступами */
[style*="margin-left"], [style*="margin-right"] {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* Элементы с transform */
[style*="transform"] {
    max-width: 100% !important;
}

/* Элементы с position absolute/fixed */
[style*="position: absolute"], [style*="position: fixed"] {
    max-width: 100% !important;
}

/* Специфичные исправления для мобильных */
@media (max-width: 768px) {
    /* Убираем горизонтальные отступы */
    .px-4, .px-6, .px-8 {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    
    /* Убираем горизонтальные margin */
    .mx-4, .mx-6, .mx-8 {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* Исправляем flex элементы */
    .flex-nowrap {
        flex-wrap: wrap !important;
    }
    
    /* Исправляем grid элементы */
    .grid-cols-2, .grid-cols-3, .grid-cols-4, .grid-cols-5 {
        grid-template-columns: 1fr !important;
    }
    
    /* Исправляем элементы с фиксированной шириной */
    .w-64, .w-72, .w-80, .w-96 {
        width: 100% !important;
        max-width: 100% !important;
    }
    
    /* Исправляем элементы с min-width */
    .min-w-0 {
        min-width: 0 !important;
    }
    
    /* Исправляем элементы с max-width */
    .max-w-none {
        max-width: 100% !important;
    }
    
    /* Исправляем элементы с overflow */
    .overflow-x-auto {
        overflow-x: hidden !important;
    }
    
    /* Исправляем элементы с whitespace */
    .whitespace-nowrap {
        white-space: normal !important;
    }
    
    /* Исправляем элементы с text-overflow */
    .truncate {
        overflow: visible !important;
        text-overflow: unset !important;
        white-space: normal !important;
    }
}

/* Дополнительные исправления для очень маленьких экранов */
@media (max-width: 480px) {
    /* Уменьшаем отступы */
    .p-4, .p-6, .p-8 {
        padding: 0.5rem !important;
    }
    
    /* Уменьшаем размеры шрифтов */
    .text-lg, .text-xl, .text-2xl {
        font-size: 1rem !important;
    }
    
    /* Уменьшаем размеры кнопок */
    .px-4, .px-6, .px-8 {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }
}