/* ==========================================================
   БЕЗ МИГАНИЯ: ПРЯЧЕМ СТАРОЕ ПОЛОЖЕНИЕ ДО МОНТАЖА
   ========================================================== */

html.msk-filters-v16-booting
.wc-block-product-filters{
    display:none !important;
    visibility:hidden !important;
    opacity:0 !important;
}


/*
 * Сортировка и счётчик тоже не должны сначала появляться
 * отдельно, а затем прыгать внутрь панели.
 */
html.msk-filters-v16-booting
.woocommerce-ordering,

html.msk-filters-v16-booting
.woocommerce-result-count{
    visibility:hidden !important;
    opacity:0 !important;
}


/*
 * Как только root оказался внутри нашей панели, ID панели
 * имеет большую специфичность и сразу показывает фильтр.
 */
#msk-filters-v16
.wc-block-product-filters{
    display:block !important;
    visibility:visible !important;
    opacity:1 !important;
}


#msk-filter-meta-v16
.woocommerce-ordering,

#msk-filter-meta-v16
.woocommerce-result-count{
    visibility:visible !important;
    opacity:1 !important;
}




/* ==========================================================
   ЗАГОЛОВОК КАТЕГОРИИ
   ========================================================== */

.msk-category-heading-filter-ready{
    margin-bottom:0 !important;
}


/* ==========================================================
   ГЛАВНАЯ ПАНЕЛЬ
   ========================================================== */

#msk-filters-v16{
    position:relative !important;
    display:block !important;

    width:100% !important;
    max-width:none !important;

    /*
     * Одинаковое расстояние:
     * H1 -> фильтр
     * фильтр -> товары
     */
    margin:18px 0 18px !important;

    padding:13px 14px 10px !important;

    box-sizing:border-box !important;

    background:
        linear-gradient(
            90deg,
            #fbf8f3 0%,
            #fffdfa 58%,
            #ffffff 100%
        ) !important;

    border:
        1px solid rgba(181,149,91,.34) !important;

    border-radius:14px !important;

    box-shadow:
        0 4px 15px rgba(74,55,31,.055) !important;

    clear:both !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    z-index:2 !important;
}


#msk-filters-v16,
#msk-filters-v16 *{
    box-sizing:border-box !important;
}


/* ==========================================================
   РОДНОЙ WOOCOMMERCE FILTERS
   ========================================================== */

#msk-filters-v16
.wc-block-product-filters{
    position:static !important;

    display:block !important;

    width:100% !important;
    max-width:none !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    overflow:visible !important;

    transform:none !important;

    opacity:1 !important;
    visibility:visible !important;

    pointer-events:auto !important;
    touch-action:auto !important;
}


/* старая кнопка открытия фильтра */

#msk-filters-v16
.wc-block-product-filters__open-overlay{
    display:none !important;
}


/* ==========================================================
   DRAWER -> ОБЫЧНЫЙ INLINE-БЛОК
   ========================================================== */

#msk-filters-v16
.wc-block-product-filters__overlay,

#msk-filters-v16
.wc-block-product-filters__overlay-wrapper,

#msk-filters-v16
.wc-block-product-filters__overlay-dialog{
    position:static !important;

    display:block !important;

    inset:auto !important;

    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;

    width:100% !important;
    max-width:none !important;

    height:auto !important;
    min-height:0 !important;
    max-height:none !important;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;
    border-radius:0 !important;

    box-shadow:none !important;

    transform:none !important;
    translate:none !important;

    opacity:1 !important;
    visibility:visible !important;

    overflow:visible !important;

    pointer-events:auto !important;
    touch-action:auto !important;

    z-index:auto !important;
}


#msk-filters-v16
.wc-block-product-filters__overlay::before,

#msk-filters-v16
.wc-block-product-filters__overlay::after{
    display:none !important;
}


/* верх/низ старого drawer */

#msk-filters-v16
.wc-block-product-filters__overlay-header,

#msk-filters-v16
.wc-block-product-filters__overlay-footer{
    display:none !important;
}


/* ==========================================================
   CONTENT
   ========================================================== */

#msk-filters-v16
.wc-block-product-filters__overlay-content,

#msk-filters-v16
.wc-block-product-filters__content{
    position:static !important;

    display:block !important;

    width:100% !important;

    height:auto !important;
    max-height:none !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;

    background:transparent !important;

    opacity:1 !important;
    visibility:visible !important;

    pointer-events:auto !important;
}


#msk-filters-v16
.msk-filter-old-content{
    display:none !important;
}


/* ==========================================================
   ВСЕ ФИЛЬТРЫ
   ========================================================== */

#msk-filters-v16
.msk-filter-items{
    display:flex !important;

    flex-wrap:wrap !important;

    align-items:flex-start !important;

    width:100% !important;

    gap:10px 0 !important;

    margin:0 !important;
    padding:0 !important;
}


/* ==========================================================
   ОДИН ФИЛЬТР
   ========================================================== */

#msk-filters-v16
.msk-filter-item{
    position:relative !important;

    display:block !important;

    width:auto !important;
    min-width:0 !important;

    height:auto !important;

    margin:0 !important;

    background:transparent !important;

    border:0 !important;

    box-shadow:none !important;

    overflow:visible !important;

    opacity:1 !important;
    visibility:visible !important;

    transform:none !important;

    pointer-events:auto !important;
}


/* ==========================================================
   ЦЕНА
   ========================================================== */

#msk-filters-v16
.msk-filter-price{
    flex:1 1 300px !important;

    min-width:260px !important;

    padding:0 18px 0 0 !important;
}


/* ==========================================================
   АТРИБУТЫ
   ========================================================== */

#msk-filters-v16
.msk-filter-attribute,

#msk-filters-v16
.msk-filter-taxonomy{
    flex:0 1 195px !important;

    min-width:150px !important;

    padding:0 16px !important;

    border-left:
        1px solid rgba(181,149,91,.19) !important;
}


/* страна */

#msk-filters-v16
.msk-filter-country{
    flex-basis:180px !important;
}


/* ==========================================================
   НАЛИЧИЕ
   ========================================================== */

#msk-filters-v16
.msk-filter-status{
    flex:0 1 135px !important;

    min-width:125px !important;
    max-width:160px !important;

    padding:0 0 0 15px !important;

    border-left:
        1px solid rgba(181,149,91,.19) !important;
}


/* ==========================================================
   ЗАГОЛОВКИ ФИЛЬТРОВ
   ========================================================== */

#msk-filters-v16
.msk-filter-item h1,

#msk-filters-v16
.msk-filter-item h2,

#msk-filters-v16
.msk-filter-item h3,

#msk-filters-v16
.msk-filter-item h4,

#msk-filters-v16
.msk-filter-item h5,

#msk-filters-v16
.msk-filter-item h6,

#msk-filters-v16
.msk-filter-item
.wp-block-heading{
    display:block !important;

    margin:0 0 8px !important;
    padding:0 !important;

    background:none !important;
    border:0 !important;

    color:#74695e !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    font-size:10.5px !important;
    line-height:1.1 !important;

    font-weight:700 !important;

    letter-spacing:.04em !important;

    text-transform:uppercase !important;
}


/* ==========================================================
   FIELDSET
   ========================================================== */

#msk-filters-v16 fieldset{
    display:block !important;

    width:100% !important;
    min-width:0 !important;

    margin:0 !important;
    padding:0 !important;

    border:0 !important;
}


/* ==========================================================
   CHIPS
   ========================================================== */

#msk-filters-v16
.wc-block-product-filter-chips__items{
    display:flex !important;

    flex-wrap:wrap !important;

    align-items:center !important;

    gap:5px !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;
}


/* ==========================================================
   ОДИН CHIP
   ========================================================== */

#msk-filters-v16
.wc-block-product-filter-chips__item{
    -webkit-appearance:none !important;
    appearance:none !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    width:auto !important;

    min-height:31px !important;

    margin:0 !important;

    padding:5px 9px !important;

    background:#fffdfa !important;

    border:
        1px solid rgba(181,149,91,.31) !important;

    border-radius:8px !important;

    color:#62584e !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    font-size:11px !important;
    line-height:1 !important;

    font-weight:550 !important;

    white-space:nowrap !important;

    text-decoration:none !important;

    box-shadow:none !important;

    cursor:pointer !important;

    transition:
        color .16s ease,
        background .16s ease,
        border-color .16s ease,
        transform .16s ease,
        box-shadow .16s ease !important;
}


#msk-filters-v16
.wc-block-product-filter-chips__item:hover{
    color:#896438 !important;

    background:#f9f2e8 !important;

    border-color:
        rgba(166,121,62,.58) !important;

    transform:
        translateY(-1px) !important;

    box-shadow:
        0 2px 6px rgba(90,64,33,.07) !important;
}


/* активный */

#msk-filters-v16
.wc-block-product-filter-chips__item[aria-checked="true"]{
    color:#765126 !important;

    background:
        linear-gradient(
            180deg,
            #f8efe1,
            #f2e2ca
        ) !important;

    border-color:
        rgba(165,119,60,.69) !important;
}


/* ==========================================================
   ЦЕНА
   ========================================================== */

#msk-filters-v16
.wc-block-product-filter-price-slider{
    display:block !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;

    overflow:visible !important;
}


#msk-filters-v16
.wc-block-product-filter-price-slider__content{
    display:block !important;

    width:100% !important;

    margin:0 !important;
    padding:0 !important;
}


/* родные подписи скрываем */

#msk-filters-v16
.wc-block-product-filter-price-slider__left,

#msk-filters-v16
.wc-block-product-filter-price-slider__right{
    display:none !important;
}


/* ==========================================================
   ПОЛЯ ЦЕНЫ
   ========================================================== */

#msk-filters-v16
.msk-price-editor{
    display:flex !important;

    align-items:flex-start !important;

    gap:6px !important;

    width:100% !important;

    margin:0 0 7px !important;
}


#msk-filters-v16
.msk-price-field{
    position:relative !important;

    display:flex !important;

    align-items:center !important;

    flex:1 1 0 !important;

    min-width:80px !important;
}


#msk-filters-v16
.msk-price-field input{
    -webkit-appearance:none !important;
    appearance:none !important;

    display:block !important;

    width:100% !important;

    height:32px !important;

    margin:0 !important;

    padding:0 23px 0 8px !important;

    background:#fffdfa !important;

    border:
        1px solid rgba(181,149,91,.32) !important;

    border-radius:8px !important;

    color:#554b41 !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    font-size:11px !important;

    box-shadow:none !important;

    outline:none !important;
}


#msk-filters-v16
.msk-price-field::after{
    content:"₽";

    position:absolute !important;

    right:8px !important;

    top:50% !important;

    transform:
        translateY(-50%) !important;

    color:#9a8a77 !important;

    font-size:10px !important;

    pointer-events:none !important;
}


#msk-filters-v16
.msk-price-separator{
    color:#b09a7c !important;

    font-size:11px !important;
}


/* ==========================================================
   OK
   ========================================================== */

#msk-filters-v16
.msk-price-submit{
    -webkit-appearance:none !important;
    appearance:none !important;

    position:relative !important;
    top:0 !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;
    align-self:flex-start !important;

    flex:0 0 auto !important;

    min-width:38px !important;

    height:32px !important;
    line-height:1 !important;

    margin:0 !important;

    padding:0 8px !important;

    background:
        linear-gradient(
            180deg,
            #b58c52,
            #a77a3d
        ) !important;

    border:
        1px solid rgba(156,112,55,.62) !important;

    border-radius:8px !important;

    color:#fff !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    font-size:10px !important;

    font-weight:700 !important;

    cursor:pointer !important;
}


/* ==========================================================
   СБРОС ФИЛЬТРОВ
   ========================================================== */

#msk-filters-v16
.msk-filter-reset{
    flex:0 0 auto !important;

    min-width:92px !important;

    padding:18px 0 0 15px !important;

    border-left:
        1px solid rgba(181,149,91,.19) !important;
}


#msk-filters-v16
.msk-filter-reset-button{
    -webkit-appearance:none !important;
    appearance:none !important;

    display:inline-flex !important;

    align-items:center !important;
    justify-content:center !important;

    min-width:88px !important;
    height:32px !important;

    margin:0 !important;
    padding:0 11px !important;

    background:#fffdfa !important;

    border:
        1px solid rgba(181,149,91,.48) !important;

    border-radius:8px !important;

    color:#8a693d !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    font-size:10.5px !important;
    line-height:1 !important;

    font-weight:700 !important;

    white-space:nowrap !important;

    box-shadow:none !important;

    cursor:pointer !important;

    transition:
        background .16s ease,
        border-color .16s ease,
        color .16s ease,
        transform .16s ease !important;
}


#msk-filters-v16
.msk-filter-reset-button:hover{
    background:#f8f1e7 !important;

    border-color:
        rgba(166,121,62,.68) !important;

    color:#765126 !important;

    transform:translateY(-1px) !important;
}


#msk-filters-v16
.msk-filter-reset-button:focus{
    outline:none !important;

    box-shadow:
        0 0 0 2px rgba(181,149,91,.15) !important;
}


/* ==========================================================
   ПОЛЗУНОК
   ========================================================== */

#msk-filters-v16
.wc-block-product-filter-price-slider__range{
    position:relative !important;

    display:block !important;

    width:calc(100% - 4px) !important;

    height:22px !important;

    min-width:100px !important;

    margin:1px 2px 0 !important;

    overflow:visible !important;
}


#msk-filters-v16
.wc-block-product-filter-price-slider__range::before{
    content:"";

    position:absolute !important;

    left:0 !important;
    right:0 !important;

    top:9px !important;

    height:4px !important;

    background:#e7ddd0 !important;

    border-radius:100px !important;
}


#msk-filters-v16
.wc-block-product-filter-price-slider__range
.range-bar{
    position:absolute !important;

    top:9px !important;

    height:4px !important;

    background:
        linear-gradient(
            90deg,
            #bd9965,
            #a77a3d
        ) !important;

    border-radius:100px !important;

    z-index:1 !important;
}


#msk-filters-v16
.wc-block-product-filter-price-slider__range
input[type="range"]{
    -webkit-appearance:none !important;
    appearance:none !important;

    position:absolute !important;

    left:0 !important;
    top:0 !important;

    width:100% !important;
    height:22px !important;

    margin:0 !important;
    padding:0 !important;

    background:transparent !important;

    border:0 !important;

    outline:0 !important;

    pointer-events:none !important;

    z-index:2 !important;
}


#msk-filters-v16
.wc-block-product-filter-price-slider__range
input[type="range"]
::-webkit-slider-runnable-track{
    height:4px !important;

    background:transparent !important;
}


#msk-filters-v16
.wc-block-product-filter-price-slider__range
input[type="range"]
::-webkit-slider-thumb{
    -webkit-appearance:none !important;
    appearance:none !important;

    width:15px !important;
    height:15px !important;

    margin-top:-5.5px !important;

    background:#fffdfa !important;

    border:
        2px solid #a77a3d !important;

    border-radius:50% !important;

    box-shadow:
        0 2px 6px rgba(91,65,32,.16) !important;

    pointer-events:auto !important;

    cursor:pointer !important;
}


/* ==========================================================
   НИЖНЯЯ СТРОКА
   ========================================================== */

#msk-filter-meta-v16{
    display:flex !important;

    align-items:center !important;

    gap:12px !important;

    width:100% !important;

    margin:10px 0 0 !important;

    padding:9px 0 0 !important;

    border-top:
        1px solid rgba(181,149,91,.17) !important;
}


#msk-filter-meta-v16
.woocommerce-result-count{
    float:none !important;

    width:auto !important;

    margin:0 !important;
    padding:0 !important;

    color:#898078 !important;

    font-size:10.5px !important;

    white-space:nowrap !important;
}


/* ==========================================================
   СОРТИРОВКА
   ========================================================== */

#msk-filter-meta-v16
.woocommerce-ordering{
    float:none !important;

    width:auto !important;

    margin:0 0 0 auto !important;
    padding:0 !important;
}


#msk-filter-meta-v16
.woocommerce-ordering select{
    -webkit-appearance:none !important;
    appearance:none !important;

    min-width:210px !important;

    height:35px !important;

    margin:0 !important;

    padding:0 35px 0 11px !important;

    background-color:#fffdfa !important;

    background-image:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7' viewBox='0 0 12 7'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23a77a3d' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;

    background-repeat:no-repeat !important;

    background-position:
        right 11px center !important;

    border:
        1px solid rgba(181,149,91,.32) !important;

    border-radius:8px !important;

    color:#5b5147 !important;

    font-family:
        Manrope,
        Arial,
        sans-serif !important;

    font-size:11px !important;

    cursor:pointer !important;
}


/* ==========================================================
   МОБИЛЬНАЯ
   ========================================================== */

@media (max-width:767px){

    #msk-filters-v16{
        margin:18px 0 18px !important;

        padding:10px !important;

        border-radius:12px !important;
    }


    #msk-filters-v16
    .msk-filter-items{
        display:grid !important;

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr) !important;

        gap:10px !important;
    }


    #msk-filters-v16
    .msk-filter-price{
        grid-column:1 / -1 !important;

        width:100% !important;

        min-width:0 !important;

        padding:0 0 10px !important;

        border-bottom:
            1px solid rgba(181,149,91,.16) !important;
    }


    #msk-filters-v16
    .msk-filter-attribute,

    #msk-filters-v16
    .msk-filter-taxonomy,

    #msk-filters-v16
    .msk-filter-status,

    #msk-filters-v16
    .msk-filter-reset{
        width:100% !important;

        min-width:0 !important;
        max-width:none !important;

        padding:0 !important;

        border-left:0 !important;
    }


    #msk-filters-v16
    .msk-filter-reset{
        align-self:end !important;
    }


    #msk-filters-v16
    .msk-filter-reset-button{
        width:100% !important;
        min-width:0 !important;
    }


    #msk-filters-v16
    .wc-block-product-filter-chips__item{
        min-height:30px !important;

        padding:5px 8px !important;

        font-size:10.5px !important;
    }


    #msk-filter-meta-v16{
        display:grid !important;

        grid-template-columns:1fr !important;

        gap:7px !important;
    }


    #msk-filter-meta-v16
    .woocommerce-ordering{
        width:100% !important;

        margin:0 !important;

        order:1 !important;
    }


    #msk-filter-meta-v16
    .woocommerce-ordering select{
        width:100% !important;

        min-width:0 !important;
    }


    #msk-filter-meta-v16
    .woocommerce-result-count{
        order:2 !important;
    }


    #msk-filters-v16,
    #msk-filters-v16 *{
        touch-action:auto !important;
    }

}


@media (max-width:390px){

    #msk-filters-v16
    .msk-filter-items{
        grid-template-columns:1fr !important;
    }


    #msk-filters-v16
    .msk-filter-price{
        grid-column:1 !important;
    }

}