/* Адаптивные правки для мобильных (<= 768px) */

@media (max-width: 768px) {
    html, body {
        overflow-x: hidden;
    }

    body { padding-top: 60px; }

    .container,
    .page-content,
    .main-content {
        width: 100% !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    /* Сетки и колонки */
    .row { margin-left: 0 !important; margin-right: 0 !important; }
    [class*="col-"] { width: 100% !important; float: none !important; padding-left: 0 !important; padding-right: 0 !important; }

    /* Заголовки и отступы */
    h1 { font-size: 22px !important; line-height: 1.3 !important; }
    h2 { font-size: 18px !important; line-height: 1.3 !important; }
    .pt50 { padding-top: 20px !important; }
    .pb50 { padding-bottom: 20px !important; }

    /* Меню/табы сервера */
    .server-tabs-bar { display: block !important; overflow-x: auto; white-space: nowrap; }
    .server-tab2 { display: inline-block; padding: 8px 10px !important; font-size: 14px !important; }

    /* Навигация: скрыть десктопное меню, показать мобильное */
    .main-nav-container .main-nav { display: none !important; }
    .mobile-nav { display: block !important; }
    .mobile-nav .mobile-nav-links { display: block !important; }
    .mmenu { display: inline-block !important; }

    /* Горизонтальная прокрутка для длинных наборов ссылок */
    .menu-top-links, .menu-middle-links, .scrollmenu {
        display: block !important;
        overflow-x: auto !important;
        white-space: nowrap !important;
        -webkit-overflow-scrolling: touch;
    }
    .menu-top-links a, .menu-middle-links a, .scrollmenu a {
        display: inline-block !important;
        width: auto !important;
        min-width: 56px;
        text-align: center;
        margin-right: 6px;
    }

    /* Кнопки-тайлы в шапке: убрать позиционирование/ширины, чтобы не наслаивались */
    /* Плитки категорий на главной: по 2 в ряд */
    .menu-middle-links { text-align: center; white-space: normal !important; }
    .menu-middle-links, .menu-middle-links .row {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: space-between !important;
    }
    .menu-middle-links .button {
        width: calc(50% - 8px) !important;
        padding: 10px !important;
        min-width: auto !important;
        position: static !important;
        margin: 4px 4px !important;
        height: auto !important;
        display: block !important;
        vertical-align: top;
        box-sizing: border-box;
        float: none !important;
        flex: 0 0 calc(50% - 8px);
    }
    .menu-middle-links .button { top: auto !important; right: auto !important; }
    .menu-middle-links .button span { line-height: 1.2 !important; white-space: normal !important; }
    .menu-middle-links img { max-width: 60px !important; max-height: 40px !important; height: auto !important; }
    .menu-middle-links .button i, .menu-middle-links .button span, .menu-middle-links .button img {
        display: inline-block !important; vertical-align: middle; float: none !important;
    }
    .menu-middle-links .row { margin: 0 !important; }

    /* Красные кнопки под баннером */
    .wrapperr { position: static !important; left: 0 !important; top: 0 !important; margin: 8px 0 !important; }
    .button1 { display: block !important; width: 100% !important; text-align: center; margin: 6px 0 !important; }
    /* По запросу скрываем эти кнопки на мобильных, чтобы ничего не перекрывали */
    .wrapperr { display: none !important; }

    /* Кнопки и интерактивные элементы */
    a, button { min-height: 44px; }
    .button1 { display: inline-block; padding: 10px 14px !important; font-size: 14px !important; }

    /* Раскладка блока фильтра/кнопок/поиска на категориях */
    div[style*="display: flex"][style*="justify-content: space-between"] {
        flex-wrap: wrap !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 8px !important;
    }
    div[style*="display: flex"][style*="justify-content: space-between"] > #dropdown,
    div[style*="display: flex"][style*="justify-content: space-between"] > .wrapperr,
    div[style*="display: flex"][style*="justify-content: space-between"] > form {
        width: 100% !important;
        max-width: 100% !important;
    }
    div[style*="display: flex"][style*="justify-content: space-between"] > form input[type="text"] {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* Кнопка голосования в списках серверов */
    .list-item .sub-info { display: block !important; }
    .list-item .sub-info .right { float: none !important; text-align: left !important; }
    .list-item .sub-info .right a[href*="reviews"],
    .list-item .sub-info .right a.vote-btn {
        display: inline-block !important;
        margin-top: 10px !important;
        padding: 8px 14px !important;
        background: #e74c3c !important;
        color: #fff !important;
        border-radius: 6px !important;
        font-weight: 600 !important;
        text-decoration: none !important;
    }

    /* Гарантируем, что .wrapperr не перекрывает соседей */
    .wrapperr { z-index: 0 !important; }
    .button1 { box-sizing: border-box; }

    /* Изображения — флюидные */
    img { max-width: 100% !important; height: auto !important; }
    .server-right img { max-width: 100% !important; height: auto !important; }

    /* Списки карточек */
    .list-item { display: block !important; }
    .list-item .thumb, .list-item .info { width: 100% !important; display: block !important; float: none !important; }
    .list-item .thumb { text-align: left !important; margin-bottom: 8px !important; }
    .list-item .thumb img { width: 64px !important; height: 64px !important; }

    /* Хлебные крошки и сервисные блоки */
    .widget, .alert { padding: 10px !important; }

    /* Текст описания на карточке сервера: не ломать каждую букву */
    .item-text .info {
        word-break: normal !important;
        overflow-wrap: break-word !important;
        white-space: normal !important;
        hyphens: auto;
    }

    /* Перенос кнопки Голосовать под карточку ТОЛЬКО на мобильных */
    .list-item .sub-info .right {
        width: 100% !important;
        text-align: left !important;
        margin-top: 10px !important;
        float: none !important;
        clear: both !important;
    }
    .list-item .sub-info .right .button15:first-child {
        display: inline-block !important;
        width: auto !important;
        max-width: 100% !important;
        margin: 8px 0 0 0 !important;
        position: static !important;
        vertical-align: middle !important;
    }

    /* Отключаем кликабельный оверлей карточки на мобилках, чтобы кнопка работала */
    .list-item .store-clickable-area { pointer-events: none !important; position: static !important; }
    .list-item a, .list-item button { pointer-events: auto !important; }
}

/* Мелкие экраны <= 375px */
@media (max-width: 375px) {
    h1 { font-size: 20px !important; }
    h2 { font-size: 16px !important; }
    .server-tab2 { font-size: 13px !important; padding: 8px 8px !important; }
}