.control-filter-popover .filter-search {
    min-height: 36px;
    position: relative;

    // &:after {
    //     .icon-OctoFont();
    //     position: absolute;
    //     width: 16px;
    //     height: 16px;
    //     content: @icon-search;
    //     right: 10px;
    //     top: 10px;
    //     font-size: 16px;
    // }

    input {
        height: auto;
        border: none;
        border-bottom: 1px solid @color-filter-border;
        .border-bottom-radius(0);
        box-shadow: none;
        background: transparent !important;
        padding-top: 6px;
        padding-bottom: 6px;
        padding-right: 35px;
    }

    .close {
        display: none;
    }

    .filter-items, .filter-active-items {
        color: @color-filter-text;
        font-size: @font-size-base - 1;

        ul, li {
            list-style-type: none;
            margin:0;
            padding:0;
        }

        li {
            transition: color 0.6s, background-color 0.3s;
        }

        a {
            text-decoration: none;
            color: @color-filter-text;
            display: block;
            padding: 7px 9px;

            &:before {
                .icon-OctoFont();
                margin-right: 4px;
                position: relative;
                top: 1px;
                display: inline-block;
                vertical-align: baseline;
                text-align: center;
                border-radius: 100px;
            }

            &:hover {
                background-color: @color-filter-items-bg-hover;
                color: white;
            }
        }
    }

    .filter-items {
        max-height: 200px;
        overflow: auto;
        a:before {
            content: @icon-plus;
        }

        li {
            &.loading {
                padding: 7px;

                > span {
                    display: block;
                    height: 20px;
                    width: 20px;
                    background-image: url('../../../../assets/images/loader-transparent.svg');
                    background-size: 20px 20px;
                    background-position: 50% 50%;
                    animation: spin 1s linear infinite;
                }
            }

            &.animate-enter { animation: fadeInUp .3s; }
        }
    }

    .filter-buttons {
        border-top: none;
    }

    .filter-active-items {
        border-top: 1px solid @color-filter-border;
        a {
            font-weight: 600;
            color: var(--bs-body-color);

            &:before {
                background-color: @secondary-bg;
                color: @text-color;
                content: @icon-cross;
                left: -1px;
            }

            &:hover:before {
                color: #c63e26;
                background-color: white;
            }
        }

        li.animate-enter {
            animation: fadeInDown .3s;
        }

        li:last-child {
            border-bottom: 1px solid @color-filter-border;
        }
    }
}