/*
 * Infinity Ads Manager — адаптивные стили для баннерных слотов.
 *
 * Маппинг по ширине контейнера:
 *   ≥ 970px → Все 8 форматов
 *   ≥ 728px → 6 (без billboard, super_leaderboard)
 *   ≥ 336px → 5 (+ large_rectangle)
 *   ≥ 300px → 4 (medium_rectangle, half_page, square, skyscraper)
 *   < 300px → 2 (square 250px, skyscraper 160px)
 *
 * Breakpoints:
 *   Desktop:      ≥ 1024 px   → .iam-bp--desktop
 *   Tablet:       768–1023    → .iam-bp--tablet
 *   Mobile:       376–767     → .iam-bp--mobile
 *   Small mobile: 321–375     → .iam-bp--small-mobile
 *   Tiny mobile:  ≤ 320 px    → .iam-bp--tiny-mobile
 */

/* ====================================================================
 * 1. Responsive slot visibility
 *
 *    Соседние одинаковые форматы мержатся в один div с несколькими
 *    CSS-классами, напр. <div class="iam-bp--desktop iam-bp--tablet">.
 *    Логика: скрываем все → показываем активный брейкпоинт.
 *    «show» правило всегда после «hide» → побеждает по source order.
 * ==================================================================== */
.iam-responsive-slot > div {
    display: none !important;
}
.iam-responsive-slot .iam-bp--desktop {
    display: block !important;
}

/* Tablet: 768 – 1023 */
@media screen and (max-width: 1023px) {
    .iam-responsive-slot .iam-bp--desktop {
        display: none !important;
    }
    .iam-responsive-slot .iam-bp--tablet {
        display: block !important;
    }
}

/* Mobile: 376 – 767 */
@media screen and (max-width: 767px) {
    .iam-responsive-slot .iam-bp--tablet {
        display: none !important;
    }
    .iam-responsive-slot .iam-bp--mobile {
        display: block !important;
    }
}

/* Small mobile: 321 – 375 */
@media screen and (max-width: 375px) {
    .iam-responsive-slot .iam-bp--mobile {
        display: none !important;
    }
    .iam-responsive-slot .iam-bp--small-mobile {
        display: block !important;
    }
}

/* Tiny mobile: ≤ 320 — контейнер < 300px, только Square 250 + Skyscraper 160 */
@media screen and (max-width: 320px) {
    .iam-responsive-slot .iam-bp--small-mobile {
        display: none !important;
    }
    .iam-responsive-slot .iam-bp--tiny-mobile {
        display: block !important;
    }
}

/* ====================================================================
 * 2. Отступ перед баннером в шапке (hero) — чтобы не прижимался
 *    к строке «продать контент / реклама»
 * ==================================================================== */
.header-hero .iam-responsive-slot {
    margin-top: 2rem;
}

/* ====================================================================
 * 3. Хидер не расширяет страницу на узких экранах
 * ==================================================================== */
@media screen and (max-width: 1023px) {
    .site-header {
        overflow-x: hidden;
        max-width: 100vw;
    }

    .header-hero .execphpwidget {
        max-width: 100%;
        overflow: hidden;
    }
}

/* ====================================================================
 * 4. Sticky sidebar: отключаем fixed/absolute на планшетах и мобильных.
 *    JS-плагин sticky-sidebar ставит inline position:fixed — перебиваем
 *    через !important, чтобы сайдбар не налезал на контент.
 * ==================================================================== */
@media screen and (max-width: 1023px) {
    .inner-wrapper-sticky {
        position: static !important;
        transform: none !important;
        top: auto !important;
        left: auto !important;
        bottom: auto !important;
        width: 100% !important;
    }
}