.category_theme_active {
    position: relative;
    isolation: isolate;
    overflow: visible;
    box-sizing: border-box;
    padding: 16px;
    border: 1px solid var(--category-theme-secondary);
    border-radius: 10px;
    background: var(--category-theme-background);
}

.category_theme_active::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: 0;
    border-radius: inherit;
    background-image: var(--category-theme-image);
    background-position: var(--category-theme-image-position);
    background-size: var(--category-theme-image-size);
    background-repeat: var(--category-theme-image-repeat);
    opacity: var(--category-theme-image-opacity);
    pointer-events: none;
}

.category_theme_active > * {
    position: relative;
    z-index: 1;
}

.category_theme_active .title_wrap {
    padding-left: 12px;
    border-left: 4px solid var(--category-theme-primary);
}

.category_theme_active .title_wrap .main_title {
    color: inherit;
}

.category_theme_active .catalog_inner {
    gap: 8px;
}

.category_theme_active .menu_item .check_item:hover {
    background: var(--category-theme-secondary);
    color: var(--category-theme-primary);
}

.category_theme_active .menu_item.fil_group_grid .check_item.active,
.category_theme_active .filter_tile_photo .check_item.active {
    border-color: var(--category-theme-accent);
    background: var(--category-theme-accent);
    color: var(--category-theme-accent-text);
}

.category_theme_active .brands_slider-inner .outer_fv.active {
    border-color: var(--category-theme-primary);
}

.category_theme_active .catalog_sort .selected a,
.category_theme_active .one_good:hover .product_name span,
.category_theme_active .cat_title:hover {
    color: var(--category-theme-primary);
}

.category_theme_active .open_menu-filter,
.category_theme_active .apply_filters a.submit_filters {
    background: var(--category-theme-accent);
    color: var(--category-theme-accent-text);
}

.category_theme_active .apply_filters a.submit_filters::after {
    border-color: transparent var(--category-theme-accent) transparent transparent;
}

.category_theme_active .one_good,
.category_theme_active .one_cat {
    border-color: var(--category-theme-secondary);
}

.category_theme_active .one_good:hover,
.category_theme_active .one_cat:hover {
    box-shadow: 0 0 0 1px var(--category-theme-secondary), 0 5px 16px rgba(0, 0, 0, .08);
}

.category_theme_active .ui-slider-range,
.category_theme_active .ui-slider-handle {
    background: var(--category-theme-accent) !important;
}

.category_theme_active.category_theme_no_image::before {
    display: none;
}

/* Desktop filter remains a part of the themed category layout. */
@media (min-width: 1024px) {
    .category_theme_active .catalog_filters {
        border-radius: 8px;
        background: rgba(255, 255, 255, .72);
        padding: 8px 0 8px 8px;
    }
}

@media (min-width: 769px) {
    .category_theme_active.category_theme_hide_bg_desktop::before {
        display: none;
    }
}

/*
 * Mobile layout must use the catalog's native geometry.
 * The category theme changes only visual styling and must not take the toolbar
 * or the product list out of the normal document flow.
 */
@media (max-width: 1023px) {
    .category_theme_active {
        isolation: auto;
        overflow: visible;
    }

    /* Restore the native mobile filters/sort toolbar exactly as in ordinary categories. */
    .category_theme_active .control_products {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: sticky !important;
        top: 70px !important;
        z-index: 5 !important;
        box-sizing: border-box;
        width: calc(100% + 16px) !important;
        margin: 0 0 16px -8px !important;
        padding: 8px !important;
        background: var(--category-theme-background) !important;
    }

    .category_theme_active .open_menu-filter {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Do not create a second positioned layer above the first product row. */
    .category_theme_active .catalog_inner,
    .category_theme_active .catalog_inner > .list_wrap {
        position: static !important;
        z-index: auto !important;
        transform: none !important;
    }

    .category_theme_active .catalog_inner {
        display: block !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .category_theme_active .catalog_inner > .list_wrap {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .category_theme_active #products_list {
        position: relative !important;
        z-index: 1 !important;
        margin-top: 0 !important;
        padding-top: 0 !important;
        transform: none !important;
    }

    /* Keep the native fixed drawer above the standard dark overlay. */
    .category_theme_active .catalog_filters {
        position: fixed !important;
        top: 0 !important;
        left: -330px !important;
        z-index: 13 !important;
        width: 300px !important;
        height: 100dvh !important;
        margin: 0 !important;
        padding: 24px 8px 8px 8px !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: var(--site-bg) !important;
        color: var(--text) !important;
        box-shadow: 0 8px 30px rgba(0, 0, 0, .3) !important;
        opacity: 1 !important;
        visibility: visible !important;
        filter: none !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    .category_theme_active .catalog_filters.active {
        left: 0 !important;
    }
}

@media (max-width: 768px) {
    .category_theme_active {
        padding: 12px;
        border-radius: 8px;
    }

    .category_theme_active.category_theme_hide_bg_mobile::before {
        display: none;
    }
}
