/* mobile.css v3 — точечные правки под телефон/планшет
   - убираем сундук/кошку из hero-баннера
   - сайдбарные банеры и колесо фортуны прячем
   - слайдеры переключаются на нативный touch-scroll (свайп работает 100%)
   - стрелки навигации на мобиле прячем
   - топбар с кнопками регистрации/входа всегда виден */

/* ============================================================
   ≤ 1024px : планшеты и телефоны
   ============================================================ */
@media (max-width: 1024px) {

    /* --- 1. Hero-баннер: убираем сейф и камни. Layout через grid. --- */
    /* Сейф и декоративные камни (вне текстового блока) — скрыть.
       Символы валют ВНУТРИ суммы (₽) — оставить. */
    .main-slider-banner__img { display: none !important; }
    .main-slider-banner__wr > .main-slider-banner__symbol,
    .main-slider-banner > .main-slider-banner__symbol { display: none !important; }

    .main-slider-banner {
        height: auto !important;
        min-height: 180px !important;
        max-height: 200px !important;
        overflow: hidden !important;
        padding: 0 !important;
    }
    .main-slider-banner__wr {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 10px !important;
        padding: 12px !important;
        width: 100% !important;
        height: auto !important;
        min-height: 180px !important;
        position: relative !important;
        transform: none !important;
        top: 0 !important; left: 0 !important;
    }
    .main-slider-banner__video-wr {
        flex: 0 0 130px !important;
        position: relative !important;
        margin: 0 !important; padding: 0 !important;
        width: 130px !important;
        min-width: 130px !important;
        max-width: 130px !important;
        height: 150px !important;
        overflow: hidden !important;
        transform: none !important;
        top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important;
        align-self: center !important;
    }
    .main-slider-banner__video {
        position: absolute !important;
        inset: 0 !important;
        top: 0 !important; left: 0 !important;
        width: 100% !important; height: 100% !important;
        max-width: 100% !important;
        object-fit: contain !important;
        object-position: center !important;
        transform: none !important;
    }
    .main-slider-banner__text-wr {
        flex: 1 1 auto !important;
        align-self: stretch !important;
        position: relative !important;
        top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important;
        transform: none !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: center !important;
        gap: 3px !important;
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left !important;
    }
    .main-slider-banner__text-wr > p {
        margin: 0 !important;
        padding: 0 !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        display: block !important;
        overflow: visible !important;
        visibility: visible !important;      /* оригинал ставил hidden на P с суммой */
        font-size: 11px !important;
        line-height: 1.2 !important;
        white-space: normal !important;
        color: #fff !important;
        text-align: left !important;
    }
    .main-slider-banner__text-wr > p:empty { display: none !important; }
    .main-slider-banner__text-wr * { visibility: visible !important; }
    /* Активная валюта = только RUB */
    .main-slider-banner__text-wr .currency-content { display: none !important; }
    .main-slider-banner__text-wr .currency-content.rub {
        display: inline-block !important;
        font-size: 16px !important;
        font-weight: 700 !important;
        line-height: 1.1 !important;
        color: rgb(172, 255, 0) !important;
        height: auto !important;
        width: auto !important;
        margin: 0 !important;
    }
    /* Фиолетовые числа (бонусные FS) */
    .main-slider-banner__text-wr .main-slider-banner__number.violet,
    .main-slider-banner__text-wr .main-slider-banner__symbol.violet {
        display: inline-block !important;
        font-size: 14px !important;
        line-height: 1.15 !important;
        color: rgb(229, 92, 255) !important;
        height: auto !important;
        width: auto !important;
    }
    /* Десктоп-only spans с "+400 FS" — скрываем,
       мобильный P "и 400 FS" — тоже скрываем (бонусную инфу выводит только сумма) */
    .main-slider-banner__text-wr p .main-slider-banner__desktop,
    .main-slider-banner__text-wr span.main-slider-banner__desktop,
    .main-slider-banner__text-wr .main-slider-banner__desktop,
    .main-slider-banner__text-wr p.main-slider-banner__mobile {
        display: none !important;
        visibility: hidden !important;
    }

    .main-slider-banner__text-btn-wr {
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        height: auto !important;
        min-height: 36px !important;
        margin: 8px 0 0 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        position: relative !important;
        top: 0 !important; left: 0 !important; right: auto !important; bottom: auto !important;
        transform: none !important;
        flex: 0 0 auto !important;
        order: 99 !important;                /* всегда последним в text-wr */
    }
    .main-slider-banner__text-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 32px !important;
        min-height: 32px !important;
        padding: 0 16px !important;
        font-size: 12px !important;
        white-space: nowrap !important;
        line-height: 1 !important;
    }

    /* --- 2. Сайдбар + всё что в нём (колесо, банеры, jackpot-сайдбар) --- */
    .main__inner-sidebar-wr,
    .main__inner-sidebar,
    .second-level-banners-slider,
    .second-level-banners-slider__card,
    .spin-banner,
    .jackpot--sidebar { display: none !important; }

    /* На случай если sidebar возвращается каким-то JS — продублируем по модификаторам */
    .second-level-banners-slider__card--bonus,
    .second-level-banners-slider__card--cashback,
    .second-level-banners-slider__card--mobileapp,
    .second-level-banners-slider__card--random_game,
    .second-level-banners-slider__card--referrals,
    .second-level-banners-slider__card--withdrawal,
    .second-level-banners-slider__spin-banner { display: none !important; }

    /* --- 3. Download-баннер ("сейф" сверху с текстом "Скачайте приложение") --- */
    .download-banner,
    .download-app,
    .popup-download_app { display: none !important; }

    /* --- 4. Контент на всю ширину --- */
    .main__inner-content { width: 100% !important; max-width: 100% !important; }

    /* --- 5. СЛАЙДЕРЫ → нативный touch-scroll --- */
    /* Контейнер карусели разрешает горизонтальный скролл пальцем */
    [class*="games-slider-wrap"] .swiper-container,
    [class*="games-slider-wrap"] .swiper-wrapper {
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x proximity !important;
        scrollbar-width: none !important;
    }
    [class*="games-slider-wrap"] .swiper-container::-webkit-scrollbar,
    [class*="games-slider-wrap"] .swiper-wrapper::-webkit-scrollbar {
        display: none !important;
    }
    /* Возвращаем wrapper обратно в нормальное состояние (наш JS его transformом двигал) */
    [class*="games-slider-wrap"] .swiper-wrapper {
        transform: none !important;
        transition: none !important;
        display: flex !important;
        flex-wrap: nowrap !important;
        width: max-content !important;
    }
    /* Снап на начало каждого слайда + фиксированная ширина */
    [class*="games-slider-wrap"] .swiper-slide {
        scroll-snap-align: start !important;
        flex-shrink: 0 !important;
        width: 130px !important;
        min-width: 130px !important;
        max-width: 130px !important;
        margin-right: 8px !important;
    }
    [class*="games-slider-wrap"] .swiper-slide .games-list-card,
    [class*="games-slider-wrap"] .swiper-slide .games-list-card-inner,
    [class*="games-slider-wrap"] .swiper-slide img {
        width: 130px !important;
        height: 130px !important;
        max-width: 130px !important;
    }
    /* Карточки провайдеров — другой размер */
    [class*="providerList"] .swiper-slide {
        width: 100px !important;
        min-width: 100px !important;
        max-width: 100px !important;
    }

    /* --- 6. Стрелки навигации слайдеров — прячем (свайп работает) --- */
    .swiper-navigate,
    .swiper-button-prev, .swiper-button-next,
    .promotions-slider__prev, .promotions-slider__next,
    .promo__nav-prev--js, .promo__nav-next--js { display: none !important; }

    /* --- 7. MULTIROW / GRID / TABBED контейнеры
       На мобиле выпрямляем в одну строку с горизонтальным скроллом. */
    .swiper-container-multirow,
    .swiper-grid,
    .swiper-grid.swiper-grid-column,
    .games-slider--tabs,
    .games-slider.swiper-container-multirow,
    [class*="games-slider-wrap"][class*="multirow"],
    [class*="games-slider-wrap"][class*="grid"] {
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        display: flex !important;
        flex-direction: row !important;
        -webkit-overflow-scrolling: touch !important;
        scroll-snap-type: x proximity !important;
        scrollbar-width: none !important;
    }
    .games-list-with-tabs {
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
    }
    .swiper-container-multirow .swiper-wrapper,
    .swiper-grid .swiper-wrapper,
    .games-slider--tabs .swiper-wrapper {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        height: auto !important;
        width: max-content !important;
        transform: none !important;
        transition: none !important;
    }
    .swiper-container-multirow .swiper-slide,
    .swiper-grid .swiper-slide,
    .games-slider--tabs .swiper-slide {
        height: 130px !important;
        width: 130px !important;
        min-width: 130px !important;
        max-width: 130px !important;
        margin-bottom: 0 !important;
        margin-right: 8px !important;
        scroll-snap-align: start !important;
        flex-shrink: 0 !important;
    }
}

/* ============================================================
   ≤ 768px : телефоны
   ============================================================ */
@media (max-width: 768px) {

    /* --- Топбар --- */
    .top-bar,
    .top-bar__inner {
        flex-wrap: wrap !important;
        align-items: center !important;
        gap: 6px !important;
        padding: 6px 8px !important;
    }
    .top-bar__right { gap: 6px !important; flex-wrap: nowrap !important; }

    .user-top__login,
    .user-top__login-btn,
    .user-top__registration-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        height: 34px !important;
        padding: 0 12px !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1 !important;
        white-space: nowrap !important;
        border-radius: 100px !important;
    }
    .user-top__registration-btn {
        background: linear-gradient(135deg,#b735f4,#7b2ff7) !important;
        color: #fff !important;
        box-shadow: 0 4px 12px rgba(183,53,244,.4) !important;
        border: none !important;
    }
    .user-top__login-btn {
        background: rgba(255,255,255,0.08) !important;
        color: #fff !important;
        border: 1px solid rgba(255,255,255,0.18) !important;
    }
    .top-bar__search-btn-text,
    .vpn-btn { display: none !important; }

    .top-bar__center {
        order: 99 !important;
        flex: 1 1 100% !important;
        justify-content: center !important;
        gap: 14px !important;
        margin-top: 2px !important;
    }
    .top-bar__center-link { font-size: 11px !important; }

    /* Виджеты поддержки/нотификаций — мешают */
    .support-widget,
    .support-micro-app-loader,
    .vue-notification-group { display: none !important; }

    /* Footer одной колонкой */
    .footer__columns { flex-direction: column !important; gap: 12px !important; }
    .footer__col     { width: 100% !important; }

    /* Hero-баннер ещё компактнее */
    .main-slider-banner { padding: 20px 14px !important; }
    .main-slider-banner__number { font-size: 28px !important; }
}
