#FilterArsi .collapsed .fa-right {
    display: block;
}

#FilterArsi .collapsed .fa-down {
    display: none;
}

#FilterArsi .fa-right {
    display: none;
}

#FilterArsi .card-header.collapsed:after {
    /* symbol for "collapsed" panels */
    content: '\f067';
}

.bg_header_filter_name {
    background-color: #f6f6f6;
    border-radius: 10px 10px 0px 0px;
}

/* --- Основной контейнер --- */
.range-slider-wrapper {
    position: relative;
    width: 100%;
    height: 30px;
    /* Чуть увеличили высоту для удобства */
    margin-top: 15px;
    /* Выравниваем содержимое по центру вертикально */
    display: flex;
    align-items: center;
}

/* --- Дорожка (фон) --- */
/* Серая полоска, которая лежит под низом */
.slider-track {
    width: 100%;
    height: 6px;
    background-color: #dee2e6;
    /* Серый цвет Bootstrap */
    position: absolute;
    border-radius: 3px;
    z-index: 1;
}

/* --- Сами инпуты (невидимые полоски) --- */
/* Мы делаем их невидимыми, но они нужны для функционала */
.range-slider-wrapper input[type='range'] {
    position: absolute;
    width: 100%;
    /* ВАЖНО: pointer-events: none позволяет кликам проходить СКВОЗЬ полоску,
       чтобы мы могли двигать оба ползунка */
    pointer-events: none;

    -webkit-appearance: none;
    /* Убираем стандартный вид браузера */
    appearance: none;

    z-index: 2;
    height: 10px;

    /* ИСПРАВЛЕНИЕ ЗДЕСЬ: */
    /* Было: opacity: 0; (это скрывало всё) */
    /* Стало: */
    background: transparent;
    /* Фон прозрачный, но элемент существует */
    opacity: 1;
    /* Элемент видим */

    margin: 0;
}

/* --- СТИЛИЗАЦИЯ КНОПОК (THUMBS) --- */

/* 1. Для Chrome, Safari, Edge (Webkit) */
.range-slider-wrapper input[type='range']::-webkit-slider-thumb {
    pointer-events: all;
    -webkit-appearance: none;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background-color: #0a58ca;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 10;
    position: relative;
}

.range-slider-wrapper input[type='range']::-moz-range-thumb {
    pointer-events: all;
    border: none;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background-color: #0a58ca;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 10;
    position: relative;
}

/* (Дополнительно) Эффект при наведении на кнопку */
.range-slider-wrapper input[type='range']::-webkit-slider-thumb:hover {
    background-color: #00409f;
    /* Чуть темнее синий при наведении */
    transform: scale(1.1);
    /* Чуть увеличиваем */
    transition: 0.2s;
}

.range-slider-wrapper input[type='range']::-moz-range-thumb:hover {
    background-color: #00409f;
    transform: scale(1.1);
    transition: 0.2s;
}

.range-slider-wrapper input[type='range'].high-z-index {
    z-index: 5 !important;
}

/* Прилипший фильтр: внутренний скролл, чтобы раскрытые блоки не уходили за нижний край экрана.
   Только на десктопе (≥992px), где активен sticky-top / d-lg-block. */
@media (min-width: 992px) {
    #FilterArsi {
        max-height: 100vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

    #FilterArsi::-webkit-scrollbar {
        width: 6px;
    }

    #FilterArsi::-webkit-scrollbar-thumb {
        background: rgba(0, 0, 0, 0.25);
        border-radius: 3px;
    }
}