.active-filter__button:only-child {
    display: none
}

.active-filter__button.disabled, .mobile-filter__clear.disabled {
    pointer-events: none
}

@media all and (min-width: 750px) {
    .active-filters-mobile {
        display: none
    }
}

.count-bubble {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .9rem;
    width: 1.5rem;
    height: 1.5rem;
    border-radius: 50%;
    background-color: var(--bs-color-gray-200);
    color: var(--bs-color-dark);
    margin-left: .7rem;
    font-weight: 400
}

.count-bubble:empty {
    visibility: hidden
}

.count-bubble--dot:empty {
    visibility: visible
}

.count-bubble--dot:before {
    content: "";
    width: .2rem;
    height: .2rem;
    display: block;
    background-color: var(--color-background);
    border-radius: 50%
}

.collection-grid-section .sortby-dropdown .default img {
    display: none
}

.shade-swatch {
    position: relative
}

.shade-swatch input {
    display: none
}

.shade-swatch label {
    width: 34px;
    height: 34px;
    border-radius: 5px;
    padding: 1px;
    border: 1px solid transparent;
    display: block;
    cursor: pointer;
    transition: all ease-in-out .3s
}

.gift-card.shade-swatch label {
    width: auto !important
}

.shade-swatch label span {
    width: 100%;
    height: 100%;
    display: block;
    background-size: cover;
    border-radius: 3px
}

.shade-swatch input:checked ~ label {
    border-color: #000
}

.shade-swatch input:not(:checked) ~ label:hover {
    border-color: var(--bs-color-primary-500)
}

@media (min-width: 992px) {
    .collection-grid-section .sortby-dropdown {
        position: relative;
        display: block
    }

    .collection-grid-section .sortby-dropdown .default {
        cursor: pointer;
        z-index: 2;
        border-radius: 3px;
        min-width: 210px;
        padding: 13px 17px 8px
    }

    .collection-grid-section .sortby-dropdown .default i {
        font-size: 11px;
        margin-left: 5px;
        margin-bottom: 3px
    }

    .collection-grid-section .sortby-dropdown .custom--select {
        position: absolute;
        top: calc(100% - 3px);
        left: 0;
        width: 100%;
        z-index: 2;
        background: #F8F4F3;
        padding: 0 20px
    }

    .collection-grid-section .sortby-dropdown .custom--select.open {
        border: 1px solid var(--bs-color-primary-300);
        border-top: 0;
        border-bottom-left-radius: 3px;
        border-bottom-right-radius: 3px;
        padding-bottom: 16px
    }
}

.collection-grid-section .custom--select input:not(:checked) ~ label img {
    opacity: 0
}

.filter-active.sortby-drawer .filter__wrapper, .filter-active.sortby-drawer .sortby-dropdown .default, .filter-active .sorting {
    display: none !important
}

.filter-active.sortby-drawer .sorting {
    display: block !important
}

.color-filter {
    margin-bottom: -4px !important
}

.color-filter li {
    margin-right: 6px;
    margin-bottom: 6px
}

@media (max-width: 991px) {
    .filter-active.sortby-drawer .sortby-dropdown .custom--select .toggle-content {
        display: block;
        height: auto !important
    }
}

.active-filter__button {
    border-radius: 2rem;
    display: inline-block
}

.filter__item .form-check .form-check-label {
    display: flex;
    justify-content: space-between;
    cursor: pointer
}

.filter__item .form-check .collection-entry.active {
    font-weight: 700
}

.filter__container {
    padding: 24px 25px 22px;
    border-radius: 3px
}

.filter__container.open .filter__toggle .icon-plus:before {
    content: "\e90d"
}

.filter__list li:not(:first-child) {
    margin-top: .85rem
}

@media (min-width: 992px) {
    .filter__list {
        max-height: 250px;
        overflow: auto
    }

    .filter__list li:not(:first-child) {
        margin-top: .5rem
    }
}

@media (max-width: 991px) {
    #filtersCollapse.filter-active {
        display: block !important;
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        padding: 0;
        margin: 0;
        background: #fff;
        z-index: 1170
    }

    #filtersCollapse:not(.sortby-drawer) .sort-heading {
        display: none
    }

    #filtersCollapse.sortby-drawer .filter-heading {
        display: none
    }

    .collection-filter-header, .search-filter-header {
        background: #fff;
        padding: 24px 15px 17px
    }

    .collection-filters, .search-filters {
        right: 0;
        left: 0;
        bottom: 0;
        position: fixed;
        top: 0px;
        width: 100%;
        display: flex;
        flex-direction: column;
        z-index: 100000;
    }

    .collection-filters-close, .search-filters-close {
        position: absolute;
        right: 8px;
        top: 0;
        height: 100%;
        width: 36px;
        text-align: center;
        font-size: 17px;
        line-height: 1;
        display: flex;
        align-items: center;
        justify-content: center
    }

    .collection-filters .filters, .search-filters .filters {
        overflow: auto;
        flex: 1 1 auto;
        display: block;
        background-color: #f8f4f3
    }

    .collection-filters .filters .filter__wrapper {
        padding: 20px 15px
    }

    .collection-filters .sorting {
        padding: 14px 35px
    }

    .collection-filters .sorting .custom--select li.py-1 {
        padding-top: 1rem !important
    }

    .collection-filters .sorting .custom--select li.py-1 img {
        width: 10px;
        margin-right: 12px !important
    }

    .apply-btn {
        padding: 13px 15px;
        background-color: var(--bs-color-alabaster)
    }

    .apply-btn-row {
        margin-left: -5px;
        margin-right: -5px;
        display: flex
    }

    .apply-btn-item {
        flex: 1 1 100%;
        padding-left: 5px;
        padding-right: 5px
    }

    .clear-btn {
        border-color: #eee3e0;
        background-color: #eee3e0;
        color: var(--bs-body-color)
    }

    .filter__form {
        display: flex;
        flex-direction: column;
        height: 100%
    }

    .filter__wrapper {
        overflow: auto
    }

    .filter__container {
        border-radius: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        border-bottom: 0 !important;
        padding: 20px 14px 19px
    }

    .filter__item .form-check .form-check-input {
        width: 15px;
        height: 15px
    }

    .filter__item .form-check .form-check-input {
        margin-left: -15px;
        margin-right: 11px;
        margin-top: 3px !important
    }
}

@media (min-width: 1025px) {
    .collection-filters {
        top: 25px;
    }
}

.collection-entry:hover {
    text-decoration: underline
}

.collction-mobile-filter {
    border: 1px solid var(--bs-color-primary-300);
    border-radius: 3px
}

.collction-mobile-filter a {
    padding: 14px 10px 10px
}

.collction-mobile-filter a:not(:last-child) {
    border-right: 1px solid var(--bs-color-primary-300)
}

.color-options-list .color-options {
    padding: 0;
    margin: 0
}

.color-options-list .filter__item {
    display: inline-block;
    margin-right: .5rem
}

.color-options .form-check-input {
    display: none
}

.color-options .form-check-input + .form-check-label {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    position: relative
}

.color-options .form-check-input + .form-check-label:after {
    content: "";
    display: block;
    position: absolute;
    width: 6px;
    height: 6px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #FFF;
    border-radius: 50%;
    opacity: 0
}

.color-options .form-check-input:checked + .form-check-label:after {
    opacity: 1
}

@media (min-width: 992px) {
    .horizontal-filters .collection-filters {
        z-index: 3
    }

    .horizontal-filters .filter__wrapper .filter__container {
        border-bottom: 0 !important;
        padding: 9px 0rem !important;
        position: relative;
        margin-right: 30px;
        border: 0 !important
    }

    .horizontal-filters .filter__form {
        border-top: 0 !important
    }

    .horizontal-filters .filter__wrapper {
        display: flex
    }

    .horizontal-filters .count-bubble {
        display: none
    }

    .horizontal-filters .filter__block {
        position: absolute;
        left: 0;
        top: calc(100% + 5px);
        background: #fff;
        padding: 0px 1rem;
        border-radius: 3px;
        white-space: nowrap;
        border: 1px solid #cfcfcf
    }

    .horizontal-filters .filter__block .filter__list {
        padding: .5rem 0 !important
    }

    .horizontal-filters .filter__block.color-options-list {
        width: 375px;
        white-space: normal
    }

    .horizontal-filters #filter_toggle_price.filter__block {
        width: 340px
    }

    .horizontal-filters #filter_toggle_price.filter__block .filter__price {
        padding: 1rem 0rem !important
    }

    .horizontal-filters .filter__wrapper .filter__toggle {
        text-transform: capitalize !important
    }

    .horizontal-filters .filter__wrapper .filter__toggle .ms-auto {
        margin-left: 10px !important;
        font-size: 12px
    }

    .horizontal-filters .filter__item .form-check .form-check-label span {
        margin-left: 20px
    }
}

.ui-widget.ui-widget-content {
    border: 1px solid var(--bs-bg-hover-color-btn-primary);
    background: var(--bs-color-primary-200)
}

.ui-slider-range.ui-corner-all.ui-widget-header {
    background: var(--bs-bg-color-btn-primary);
}

.ui-state-active,.ui-widget-content .ui-state-active,.ui-widget-header .ui-state-active,a.ui-button:active,.ui-button:active,.ui-button.ui-state-active:hover {
    border: 1px solid var(--bs-bg-hover-color-btn-primary)!important;
    background-color: var(--bs-bg-hover-color-btn-primary)!important;
}

.ui-icon-background,.ui-state-active .ui-icon-background {
    border: 1px solid var(--bs-bg-hover-color-btn-primary)!important;
}

#amount-slider-range-price {
    background: var(--bs-color-primary-200);
    border-radius: 8px;
    padding: 4px 8px;
}

span.ui-slider-handle.ui-corner-all.ui-state-default.active {
    background: red;
}

.label-with-dollar {
    position: relative;
    margin-right: 16px;
}

.custom--select.open{
    z-index: 15!important;
}