.form-results{
    .paginator-wrapper{
        display: flex;
        width: 100%;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        .sortby-wrapper{
            @extend .mb-3;
            label{
                white-space: nowrap;
            }
        }
        .paginator-results{
            @extend .mb-3;
        }
    }
}

.pagination{
    @extend .mb-3;
}

.products-wrapper{
    .category-description {
        @extend .mb-4;
    }
    .products{
        & > div{
            @extend .mb-5;
        }
    }
}

.dropdown-toggle.no-caret:after{
    display: none;
}

aside.sidebar{
    @extend .pe-xl-5;
}

@include media-breakpoint-down(md){
    .column-left{
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100vh !important;
        background: rgba(0,0,0,.5);
        z-index: 9999;
        overflow: hidden;
        transition: opacity .2s ease;
        .close-column{
            position: absolute;
            top: 0;
            right: 0;
            z-index: 1;
            height: 100%;
            width: 100%;
        }
        &:not(.show){
            transform: translateX(0%);
            opacity: 1;
            display: block;
            .column-left-inner{
                opacity: 1;
                transform: translateX(0);
            }
        }
        &.show{
            transform: translateX(-100%);
            opacity: 0;
            transition: opacity .2s ease, transform .2s ease .2s;
            .column-left-inner{
                opacity: 0;
                transform: translateX(-5rem);
            }
        }
        &.collapsing{
            .column-left-inner{
                opacity: 0;
                transform: translateX(-5rem);
            }
        }
        .column-left-inner{
            padding: 1rem;
            padding-bottom: 7rem;
            width: 100%;
            max-width: 20rem;
            background: $white;
            height: 100%;
            position: relative;
            z-index: 2;
            overflow-x: hidden;
            overflow-y: scroll;
            transition: .2s ease;
            -webkit-overflow-scrolling: touch;
            .column-left-mobile-header{
                margin-bottom: 1.5rem;
                cursor: pointer;
                h2{
                    display: flex;
                    align-items: center;
                    justify-content: space-between;
                }
            }
        }
    }
    .btn-filter{
        width: 100%;
        display: block;
        margin-top: 1rem;
        margin-bottom: 1rem;
        padding-top: .75rem;
        padding-bottom: .75rem;
        i{
            margin-right: .25rem;
        }
    }
    .form-results{
        .paginator-wrapper{
            .paginator-results{
                display: none;
            }
            .sortby-wrapper{
                margin-bottom: 2rem;
                width: 100%;
            }
        }
    }
}
@include media-breakpoint-up(md){
    .column-left-mobile-header{
        display: none;
    }
    .btn-filter{
        display: none;
    }
}



.facet_item{
    .form-check{
        position: relative;
        label{
            a{
                @extend .text-dark;
                &:not(:hover){
                    text-decoration: unset;
                }
            }
            small{
                @extend .text-muted;
            }
        }
        input{
            border-radius: $border-radius;
        }
    }
}

.category-item{
    @extend .mb-3;
    .category-header{
        font-size: 1.25rem;
        position: relative;
        cursor: pointer;
        border-bottom: 1px solid $gray-300;
        margin-bottom: 0;
        padding: .5rem 0;
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
        user-select: none;
        &:after{
            content: "\f032";
            font: normal normal normal 1rem 'Highbiza';
            font-size: 70%;
            vertical-align: center;
            transform-origin: center center;
            top: 50%;
            transition: .2s ease;
            margin-left: auto;
        }
        &.collapsed{
            &:after{
                transform: rotate(180deg);
            }
        }
    }
    .category-body{
        padding: .75rem 0;
        ul{
            margin-bottom: 0;
            li{
                a{
                    word-break: break-word;
                }
            }
        }
    }
}

@include media-breakpoint-up(md){
    .description-wrapper{
        min-height: 4.75rem;
        &.collapse{
            &:not(.show){
                max-height: 4.75rem;
                display: block;
                overflow: hidden;
            }
        }
    }
}
@include media-breakpoint-down(md){
    .description-wrapper{
        min-height: 1.5rem;
        &.collapse{
            &:not(.show){
                display: block;
                width: 100%;
                height: 4.5rem;
                overflow: hidden;
            }
        }
    }
}
button.btn-description{
    cursor: pointer;
    background: transparent;
    outline: 0;
    padding: 0;
    border: 0;
    box-shadow: unset;
    color: $primary;
    @extend .mb-3;
    &.collapsed{
        display: block;
        .bs-less{
            display: none;
        }
    }
    &:not(.collapsed){
        display: block;
        .bs-more{
            display: none;
        }
    }
}

.facet-wrapper{
    .toggle-btn{
        cursor: pointer;
        &:not(.collapsed){
            .more{
                display: none;
            }
            i{
                transform: rotate(180deg);
            }
        }
        &.collapsed{
            .less{
                display: none;
            }
        }
    }
}

ul.pagination {
    margin-left: auto;
}