.page-products {
    .sidebar {
        .bc_slid_mob {
            @media (min-width:0) and (max-width: 767px) {
                margin-top: 0;
                background-color: var(--bc_secondary);
                position: relative;
                &.bc_slid_mob_open {
                    &:before {
                        background: var(--bc_black);
                        opacity: 0.7;
                        position: fixed;
                        left: 0;
                        top: 0;
                        right: 0;
                        height: 100dvh;
                        z-index: 999;
                        content: '';
                    }
                    .bc_cross {
                        position: fixed;
                        top: 0;
                        right: 0;
                        z-index: 999999;
                        width: 35px;
                        height: 45px;
                        &:before {
                            width: 25px;
                            height: 4px;
                            content: '';
                            background: var(--bc_white);
                            transform: rotate(40deg);
                            display: block;
                            top: 25px;
                            position: relative;
                        }
                        &:after {
                            width: 25px;
                            height: 4px;
                            content: '';
                            background: var(--bc_white);
                            display: block;
                            transform: rotate(-40deg);
                        }
                        a {
                            pointer-events: none;
                            opacity: 0;
                        }
                    }
                    .filter-content {
                        position: fixed;
                        left: 0;
                        top: 0;
                        right: 0;
                        height: 100dvh;
                        z-index: 99999;
                        background: var(--bc_white);
                        width: 85%;
                        overflow-x: hidden;
                        overflow-y: auto;
                        padding-bottom: 30px;
                    }
                }
            }
        }
        .filter-content {
            .filter-current {
                background: var(--ba_grey);
                .bc_flt_head {
                    button {
                        outline: none;
                        strong {
                            font-weight: 600;
                            text-transform: uppercase;
                        }
                    }

                }
                .items {
                    .item {
                        .filter-label {
                            font-size: 14px;
                            font-weight: 600;
                        }
                        + .item {
                            border-top: 1px solid var(--bc_secondary);
                            padding-top: 5px;
                            margin-top: 5px;
                        }
                    }
                }
                .filter-actions {
                    a {
                        font-weight: 700;
                        color: var(--bc_primary);
                    }
                }
            }
            .filter-options-title {
                .title {
                    font-size: 14px;
                    color: var(--bc_secondary);
                    text-transform: uppercase;
                    @media (min-width:1200px) {
                        font-size: 16px;
                    }
                }
                svg {
                    @media (min-width:0) and (max-width: 1200px) {
                        width: 20px;
                        height: 20px;
                    }
                }
            }
            .filter-options-content {
                .items {
                    li {
                        a {
                            color: var(--bc_color_light);
                            * {
                                color: var(--bc_color_light);
                                @media (min-width:0) and (max-width: 1200px) {
                                    font-size: 14px;
                                }
                            }
                        }
                    }
                }
                .bc_more_less {
                    &:hover {
                        color: var(--bc_primary);
                    }
                }
            }
        }
    }
    .page-main {
        margin-top: 0;
        .columns {
            max-width: 1470px;
            padding-left: 1rem;
            padding-right: 1rem;
        }
        #product-list {
            .bc_toolbar {
                background-color: var(--ba_grey);
                .toolbar-products {
                    @media (min-width:0) and (max-width: 767px) {
                        flex-grow: 1;
                        justify-content: center;
                        margin-top: 2px;
                        margin-bottom: 2px;
                    }
                    .modes {
                        display: none;
                    }
                    .form-select {
                        background-color: transparent;
                        min-height: auto;
                        outline: none;
                        box-shadow: none;
                    }
                    select {
                        width: auto;
                        max-width: 120px;
                        padding: 0px 25px 0px 5px;
                        background-image: url(../../images/icon-down.svg);
                        background-repeat: no-repeat;
                        background-position: 99% center;
                        background-size: auto 12px;
                        -webkit-appearance: none;
                        -moz-appearance: none;
                        -ms-appearance: none;
                        appearance: none;
                        font-size: 100%;
                        border-radius: 0;
                        cursor: pointer;
                        font-size: 16px;
                    }
                    .sorter {
                        @media (min-width: 768px) {
                            margin-right: 20px;
                        }
                    }
                    .pages {
                        .pages-items {
                            li {
                                margin-top: 1px;
                                a {
                                    background: transparent;
                                    padding: 0 8px;
                                    border: 0;
                                    border-radius: 0;
                                    font-size: 16px;
                                    &.active {
                                        font-weight: bold;
                                    }
                                    svg {
                                        display: none;
                                    }
                                }
                            }
                        }
                    }
                    ~ .toolbar-products {
                        flex-grow: 1;
                    }
                }
            }
        }
        .bc_prd_main_area {
            gap: 30px;
            .product {
                .product-image-photo {
                    position: static;
                }
                .bc_color_info {
                    .swatch-option {
                        min-width: unset;
                        width: 30px;
                        height: 30px;
                        border-radius: 100%;
                        margin-left: 2px;
                        margin-right: 8px;
                        &:hover {
                            outline: 2px solid var(--bc_black);
                        }
                    }
                }
            }
        }
    }
    .faq-banner {
        display: flex;
        flex-wrap: wrap;
        padding-bottom: 20px;
        .bc_prg_des  {
            width: 100%;
            flex: 0 0 auto;
            padding: 0px 15px;
            border-bottom: 0px;
            @media (min-width: 992px) {
                width: 50%;
            }
        }
        .bc_prg_des {
            .bc_prg_inr.is-clamped {
                max-height: 12rem;
                overflow: hidden;
                -webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 3.5rem), transparent 100%);
                mask-image: linear-gradient(to bottom, #000 calc(100% - 3.5rem), transparent 100%);
            }
            .bc_prg_inr.is-expanded {
                max-height: none;
                overflow: visible;
                -webkit-mask-image: none;
                mask-image: none;
            }
            .bc_prg_inr {
                h2, h3, h4, h4, h5, h6 {
                    margin-bottom: 0.8rem;
                    font-weight: 500;
                }
                h2 {
                    font-size: 1.4rem;
                    @media (min-width: 1200px) {
                        font-size: 2.4rem;
                    }
                }
                h3 {
                    font-size: 1.2rem;
                    @media (min-width: 1200px) {
                        font-size: 1.3rem;
                    }
                }
                h4 {
                    font-size: 1.1rem;
                }
                h5 {
                    font-size: 0.9rem;
                }
                h6 {
                    font-size: 0.7rem;
                }
                p {
                    color: var(--bc_color_light);
                    margin-bottom: 0.8rem;
                }
                img {
                    max-width: 100%;
                    height: auto;
                }
            }
            .bc_prg_act {
                em {
                    color: var(--bc_color_light);
                }
            }
        }
        .faq-category {
            width: 100%;
            flex: 0 0 auto;
            padding: 0px 15px;
            border-bottom: 0px;
            border-top: 1px solid var(--ba_grey);
            margin-top: 15px;
            padding-top: 10px;
            @media (min-width: 992px) {
                width: 50%;
                border-top: none;
                margin-top: 0;
                padding-top: 0;
            }
            .bc_sec_title {
                text-transform: none;
                margin-bottom: 20px;
            }
        }
        .no-faq-data {
            width: 100% !important;
            flex: 0 0 auto;
        }
    }
    .product-item {
        .price-container {
            .price-label {
                    font-size: 1.1rem;
                    font-weight: 400;
            }
        }
    }
    .out-of-stock{
        color: var(--bc_primary);
        width: 33%;
        padding-left: 10px;
        text-align: right;
        font-size: 13px;
    }
}
