/**
 * Мобильный вид списка каталога: 1 / 2 колонки (TSK25 / ОФЗ).
 * Карточки — МКТ25 (slider_c25) в #catalogSection.sk-catalog-grid-c25.
 * Не трогает витринные слайдеры (.sk-news-products / .sk-catalog-slider-c25).
 */
.sk-catalog-mcols {
    --sk-mcols-brand: var(--c25-brand, var(--sk-brand, #497952));
    --sk-mcols-brand-dark: var(--c25-brand-dark, var(--sk-brand-dark, #127023));
    --sk-mcols-brand-soft: var(--c25-brand-soft, var(--sk-brand-soft, #e8efe6));

    display: none;
    flex: 0 0 auto;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 0;
}

.sk-catalog-mcols__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--sk-mcols-brand);
    border-radius: 8px;
    background: #fff;
    color: var(--sk-mcols-brand);
    cursor: pointer;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

.sk-catalog-mcols__btn svg {
    display: block;
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.75;
    stroke-linejoin: round;
}

.sk-catalog-mcols__btn:hover,
.sk-catalog-mcols__btn:focus-visible {
    background: var(--sk-mcols-brand-soft);
    color: var(--sk-mcols-brand-dark);
    outline: none;
}

.sk-catalog-mcols__btn.is-active {
    background: var(--sk-mcols-brand);
    border-color: var(--sk-mcols-brand);
    color: #fff;
}

.sk-catalog-mcols__btn.is-active:hover,
.sk-catalog-mcols__btn.is-active:focus-visible {
    background: var(--sk-mcols-brand-dark);
    border-color: var(--sk-mcols-brand-dark);
    color: #fff;
}

@media (max-width: 768px) {
    html.sk-has-catalog-grid .sk-catalog-mcols {
        display: inline-flex;
    }

    #catalogSection.sk-catalog-grid-c25 #catalog-grid.sk-catalog-grid-c25__list {
        gap: 8px;
        justify-content: flex-start;
    }

    /* Дефолт / 2 колонки — МКТ25 в слотах */
    html[data-sk-catalog-mcols="2"] #catalogSection.sk-catalog-grid-c25 .sk-catalog-grid-c25__slot,
    html[data-sk-catalog-mcols="2"] #catalogSection.sk-catalog-grid-c25 .sk-catalog-grid-c25__slot:nth-child(4n) {
        width: calc((100% - 8px) / 2) !important;
        max-width: calc((100% - 8px) / 2) !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        margin-bottom: 8px !important;
        box-sizing: border-box;
    }

    /* 1 колонка — та же МКТ25 на всю ширину */
    html[data-sk-catalog-mcols="1"] #catalogSection.sk-catalog-grid-c25 .sk-catalog-grid-c25__slot,
    html[data-sk-catalog-mcols="1"] #catalogSection.sk-catalog-grid-c25 .sk-catalog-grid-c25__slot:nth-child(4n) {
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
        margin-bottom: 12px !important;
        box-sizing: border-box;
    }

    #catalogSection.sk-catalog-grid-c25 .sk-catalog-grid-c25__slot > .sk-card-slc25 {
        width: 100% !important;
        max-width: none !important;
    }

    /* Legacy .catalog__item (LINE / старые шаблоны) */
    html[data-sk-catalog-mcols="2"] #catalogSection:not(.sk-catalog-grid-c25) #catalog-grid.catalog__list > .catalog__item {
        width: calc((100% - 8px) / 2) !important;
        max-width: calc((100% - 8px) / 2) !important;
        margin-right: 0 !important;
    }

    html[data-sk-catalog-mcols="1"] #catalogSection:not(.sk-catalog-grid-c25) #catalog-grid.catalog__list > .catalog__item {
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
    }
}

@media (min-width: 769px) {
    .sk-catalog-mcols {
        display: none !important;
    }
}