/*NOTE: This file is intended for programmers. Aspro technical support is not advised to work with him.*/

/* Examples (uncomment to use):*/

/* Expand site width */
/* body .wrapper { max-width: 1400px;  } */

/* Set site background image */
/* body {  background: url(image_source) top no-repeat; }

/* Hide compare button */
/* a.compare_item { display: none;  }*/

@media (max-width: 770px) {
    .grid-list--items-2 {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        flex-grow: 1 !important;
    }

    .sections-list__wrapper {
        width: 90% !important;
        max-width: 600px !important;
    }

    .sections-list__item {
        width: 100% !important;
        box-sizing: border-box !important;
        margin-bottom: 20px !important;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .sections-list__item-preview {
        display: none !important;
    }
}

@media (max-width: 600px) {

    .sections-list__wrapper {
        width: 80% !important;
        max-width: 600px !important;
    }

    .sale-list__wrapper {
        width: 90% !important;
        padding: 10px !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    .grid-list,
    .mobile-offset,
    .mobile-scrolled {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Ограничиваем максимальный размер изображения */
    .sale-list__item-image-wrapper img {
        width: 100% !important;
        height: auto !important;
        max-height: 200px !important;
        object-fit: cover !important;  /* Заполняем пространство без искажений */
    }

    .sale-list__item-text-wrapper {
        text-align: center !important;
        font-size: 16px !important;
    }

    .sale-list__item-text-wrapper h3 {
        font-size: 18px !important; /* Немного увеличиваем размер шрифта для заголовков */
        margin-bottom: 10px !important;
    }
}

@media (max-width: 600px) {
    /* Контейнер с видео */
    .social-video .grid-list {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        gap: 20px !important;
        margin: 0 auto !important;
        padding: 0 10px !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
    }

    /* Убираем отрицательные отступы, из-за которых появлялся горизонтальный скролл */
    .social-video .mobile-offset,
    .social-video .mobile-scrolled {
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* Каждая карточка видео */
    .social-video__item {
        width: 100% !important;
        max-width: 480px !important;
        box-sizing: border-box !important;
    }

    /* Сами iframe’ы (видео) */
    .social-video__item iframe,
    .social-video__item video {
        width: 100% !important;
        height: auto !important;
        border-radius: 10px !important;
        display: block !important;
    }

    .js_append {
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .catalog-list .catalog-list__wrapper.grid-list__item.grid-list-border-outer {
        width: 95% !important;
        max-width: 95% !important;
        flex: 0 0 95% !important;
        margin: 0 auto 20px;
    }

    @media (max-width: 600px) {
        #main .catalog-list.mobile-scrolled,
        #main .catalog-list.mobile-offset,
        #main .catalog-list__wrapper,
        #main .catalog-list .grid-list-border-outer {
            padding-right: 0 !important;
            padding-left: 0 !important;
            margin-right: 0 !important;
            margin-left: 0 !important;
        }

        .font_36 {
            font-size: 15px;
        }
    }
}