/* Мобильная адаптация для админ-панели */

/* Базовые настройки для мобильных */
@media (max-width: 768px) {
    /* Скрываем текст на маленьких экранах, оставляем только иконки */
    .mobile-hide-text {
        font-size: 0;
    }
    
    .mobile-hide-text::before {
        font-size: 1rem;
    }
    
    /* Адаптация header */
    header .flex {
        flex-wrap: wrap;
    }
    
    header .text-xl {
        font-size: 1rem;
    }
    
    header .space-x-4 > * {
        margin-left: 0.5rem;
    }
    
    /* Кнопка выхода */
    header button {
        padding: 0.5rem 0.75rem;
        font-size: 0.875rem;
    }
    
    /* Email админа */
    #adminEmail {
        display: none;
    }
    
    /* Заголовки страниц */
    h1 {
        font-size: 1.5rem !important;
    }
    
    h2 {
        font-size: 1.25rem !important;
    }
    
    /* Карточки статистики */
    .grid {
        gap: 1rem !important;
    }
    
    /* Меню навигации */
    .grid > a {
        padding: 1rem !important;
    }
    
    .grid > a .text-xl {
        font-size: 1.5rem;
    }
    
    .grid > a .text-lg {
        font-size: 1rem;
    }
    
    /* Таблицы */
    table {
        font-size: 0.75rem;
    }
    
    table th,
    table td {
        padding: 0.5rem !important;
    }
    
    /* Скрываем некоторые колонки на мобильных */
    .mobile-hide {
        display: none !important;
    }
    
    /* Формы */
    .form-group label {
        font-size: 0.875rem;
    }
    
    input,
    select,
    textarea {
        font-size: 1rem;
        padding: 0.75rem !important;
    }
    
    /* Кнопки */
    button,
    .btn {
        padding: 0.75rem 1rem !important;
        font-size: 0.875rem !important;
    }
    
    /* Модальные окна */
    .modal-content {
        width: 95% !important;
        max-width: 95% !important;
        margin: 1rem !important;
        max-height: 90vh;
        overflow-y: auto;
    }
    
    /* Padding для контейнеров */
    .max-w-7xl {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }
    
    /* Адаптация карточек */
    .bg-white.rounded-xl {
        padding: 1rem !important;
    }
    
    /* Flex элементы */
    .flex.justify-between {
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .flex.items-center.space-x-4 {
        flex-wrap: wrap;
        gap: 0.5rem;
    }
    
    /* Графики и чарты */
    canvas {
        max-height: 200px !important;
    }
    
    /* Списки */
    ul, ol {
        padding-left: 1.5rem;
    }
    
    /* Изображения */
    img {
        max-width: 100%;
        height: auto;
    }
    
    /* Переполнение текста */
    .overflow-x-auto {
        -webkit-overflow-scrolling: touch;
    }
    
    /* Адаптация для очень маленьких экранов */
    @media (max-width: 480px) {
        h1 {
            font-size: 1.25rem !important;
        }
        
        .text-3xl {
            font-size: 1.5rem !important;
        }
        
        .text-2xl {
            font-size: 1.25rem !important;
        }
        
        .grid-cols-2 {
            grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
        }
        
        .grid-cols-3 {
            grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
        }
    }
}

/* Горизонтальная ориентация на планшетах */
@media (min-width: 768px) and (max-width: 1024px) {
    .grid-cols-4 {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
    
    table {
        font-size: 0.875rem;
    }
}

/* Утилиты для мобильной адаптации */
.mobile-scroll {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.mobile-full-width {
    width: 100% !important;
}

/* Гамбургер меню (если нужно) */
.hamburger {
    display: none;
    flex-direction: column;
    cursor: pointer;
    padding: 0.5rem;
}

.hamburger span {
    width: 25px;
    height: 3px;
    background-color: #333;
    margin: 3px 0;
    transition: 0.3s;
}

@media (max-width: 768px) {
    .hamburger {
        display: flex;
    }
}

/* Адаптация для touch устройств */
@media (hover: none) and (pointer: coarse) {
    button,
    a,
    .clickable {
        min-height: 44px;
        min-width: 44px;
    }
}

/* Скрытие элементов на мобильных */
@media (max-width: 768px) {
    .desktop-only {
        display: none !important;
    }
}

/* Показ элементов только на мобильных */
.mobile-only {
    display: none !important;
}

@media (max-width: 768px) {
    .mobile-only {
        display: block !important;
    }
}