.on-search {
    .topbar-wrapper {
        z-index: 1;
    }

    .wolfo-ajax-search {
        .bas-wrapper {
            @extend %text-opacity-show;
            padding: rem(100px 0 0);
            background: $light_scheme;
            box-shadow: 0 60px 40px 0 rgba(#000, .1);
            @include transition(all .4s ease-in);

            .quick-search {
                display: flex;
            }

            .bas-ajax-content {
                display: flex;
                margin: 30px 0;
            }
        }

        .bg-open-canvas-menu {
            @extend %text-opacity-show;
        }
    }
}

.wolfo-ajax-search {
    display: inline-flex;

    .wolfo-search-icon {
        display: inline-flex;
        font-size: rem(22px);
        color: #000000;
        cursor: pointer;
        @include transition(all .4s ease-in-out);

        &:hover {
            color: $hover_color;
        }
    }

    &.has-search {
        .quick-search {
            display: none !important;
        }
    }

    .bas-wrapper {
        @extend %text-opacity-hiden;
        padding: 0;
        background: $light_scheme;
        @include position(fixed, 0, 0, 0, 0, 9998);
        @include transition(all .4s ease-out);

        .search-content-inp {
            @extend %pd-plus-15;
            position: relative;
            max-width: rem(920px);
            margin: 0 auto;
        }

        .search-title {
            margin-bottom: rem(33px);
            font-size: rem(42px);
        }

        .search-close {
            @extend %flex-item-center;
            justify-content: center;
            margin: rem(40px auto 0);
            width: 50px;
            height: 50px;
            box-shadow: 0px 3px 7px 0 rgba(54, 54, 54, 0.1);
            @include border-radius(50%);
            font-size: rem(24px);
            cursor: pointer;
            @include transition(all .4s);

            &:hover {
                color: $light_color;
            }
        }

        form {

        }

        .quick-search {
            display: none;
            align-items: center;
            margin-top: rem(19px);

            label {
                margin-bottom: 0;
            }

            ul {
                margin: 0;
                padding: 0;
                margin-left: 10px;

                li {
                    list-style: none;
                    display: inline-block;
                    margin-right: 5px;
                }
            }
        }

        .bas-input {
            padding: rem(8px 60px 9px 15px);
            @include border-radius(3px);
        }

        .bas-inner {
            position: relative;
            overflow: hidden;
            @include border-radius(3px);

            .ajax-btn {
                @extend %flex-item-center;
                justify-content: center;
                min-width: rem(45px);
                padding: rem(5px);
                background: transparent;
                text-transform: uppercase;
                color: $primary_color;
                @include position(absolute, 0, 0, 0);

                &:focus {
                    outline: thin dotted;
                    color: #ca142c;
                }

                span {
                    font-family: $heading_font;
                    font-size: 0;
                    line-height: 1;
                }

                i {
                    font-size: rem(20px);
                }
            }
        }

        .bas-ajax-content {
            display: flex;
            display: none;
            align-items: center;
            justify-content: center;

            .bas-search-item {
                margin: 0 10px;

                .item-content {
                    .item-title {
                        margin-bottom: rem(5px);
                    }
                }
            }
        }
    }
}

//== [ Search Notice ]
.notice-search {
    margin-bottom: rem(50px);

    .entry-notice {
        margin-bottom: 0;
    }
}

//== [ Custom seach page]
@media (min-width: 62em) {
    .no-results {
        max-width: 75%;
    }
}

@media (max-width: 1024px) {

}