/**
 * AJAX-переходы между подразделами каталога.
 * Fade по opacity на #bh-catalog-section-ajax-swap; при откате без id — на .bh-catalog-section-dynamic.
 */

/* Крошки в контенте (.pmPageBreadcrumb) — дубль с bitrix:breadcrumb в шапке */
body:has(main.pageCatalogService[data-bh-catalog-ajax="1"]) .bx_breadcrumb {
    display: none !important;
}

/* Подменю и список товаров — одна линия по верху (flex вместо float); описание раздела ушло под сетку в шаблоне */
main.pageCatalogService[data-bh-catalog-ajax="1"] .pageCatalogService__section_2 {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    column-gap: 12px;
}

main.pageCatalogService[data-bh-catalog-ajax="1"] .pageCatalogService__section_2__block_1 {
    float: none;
    /* как раньше: колонка до 342px по ширине, не сжимать до «контента» (width:auto ломало .bhCatalogSubnav) */
    flex: 0 0 342px;
    width: 342px;
    max-width: 342px;
    box-sizing: border-box;
}

main.pageCatalogService[data-bh-catalog-ajax="1"] .pageCatalogService__section_2__block_2 {
    float: none;
    flex: 1 1 0;
    min-width: 0;
    max-width: none;
}

main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap > .content.bx-section-desc {
    margin-top: 20px;
}

@media screen and (max-width: 975px) {
    main.pageCatalogService[data-bh-catalog-ajax="1"] .pageCatalogService__section_2 {
        flex-wrap: wrap;
    }

    main.pageCatalogService[data-bh-catalog-ajax="1"] .pageCatalogService__section_2__block_1 {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }

    main.pageCatalogService[data-bh-catalog-ajax="1"] .pageCatalogService__section_2__block_2 {
        max-width: 100%;
    }
}

/* На время подмены DOM — подменю без transition (анти-рывок) */
main.pageCatalogService[data-bh-catalog-ajax="1"].bh-catalog-ajax-swap-hold
    .pageCatalogService__section_2__block_1--bhSubnav
    .menuService__item
    > ul.menuService {
    transition: none !important;
}

main.pageCatalogService[data-bh-catalog-ajax="1"].bh-catalog-ajax-swap-hold
    .pageCatalogService__section_2__block_1--bhSubnav
    .menuService__item--branch
    > a::after {
    transition: none !important;
}

main.pageCatalogService[data-bh-catalog-ajax="1"] .bh-catalog-section-dynamic,
main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap {
    contain: content;
}

/* Уход: лёгкое затухание перед подменой HTML */
main.pageCatalogService[data-bh-catalog-ajax="1"] .bh-catalog-section-dynamic.bh-ajax-leave,
main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap.bh-ajax-leave {
    animation: bhAjaxLeave 0.2s cubic-bezier(0.4, 0, 0.98, 0.58) forwards;
}

/* Вход: после подмены */
main.pageCatalogService[data-bh-catalog-ajax="1"] .bh-catalog-section-dynamic.bh-ajax-enter,
main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap.bh-ajax-enter {
    animation: bhAjaxEnter 0.3s cubic-bezier(0.33, 0.97, 0.38, 0.98) forwards;
}

@keyframes bhAjaxLeave {
    from {
        opacity: 1;
    }

    to {
        opacity: 0;
    }
}

@keyframes bhAjaxEnter {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@media (prefers-reduced-motion: reduce) {
    main.pageCatalogService[data-bh-catalog-ajax="1"] .bh-catalog-section-dynamic,
    main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap {
        contain: none;
    }

    main.pageCatalogService[data-bh-catalog-ajax="1"] .bh-catalog-section-dynamic.bh-ajax-leave,
    main.pageCatalogService[data-bh-catalog-ajax="1"] .bh-catalog-section-dynamic.bh-ajax-enter,
    main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap.bh-ajax-leave,
    main.pageCatalogService[data-bh-catalog-ajax="1"] #bh-catalog-section-ajax-swap.bh-ajax-enter {
        animation: none;
    }
}