/**
 * Mageplaza
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Mageplaza.com license that is
 * available through the world-wide-web at this URL:
 * https://www.mageplaza.com/LICENSE.txt
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade this extension to newer
 * version in the future.
 *
 * @category    Mageplaza
 * @package     Mageplaza_Search
 * @copyright   Copyright (c) Mageplaza (https://www.mageplaza.com/)
 * @license     https://www.mageplaza.com/LICENSE.txt
 */

/* SearchBox */
.ais-SearchBox-submit, .ais-SearchBox-reset {
    background: transparent;
    border: none;
    position: absolute;
    right: 0;
    top: 3px;
}

.ais-SearchBox-submitIcon {
    width: 12px;
    height: 12px;
}

.ais-SearchBox-submit:hover, .ais-SearchBox-submit:focus {
    background: transparent;
    border: none;
}

.ais-SearchBox-form {
    position: relative;
}

button.ais-SearchBox-reset:focus,
button.ais-SearchBox-reset:active,
button.ais-SearchBox-reset:hover {
    border: 0;
    background: transparent;
}

input.ais-SearchBox-input {
    padding-right: 2em;
}

.mpsearch-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.mpsearch-list-item {
    cursor: pointer;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
    margin: 0;
    position: relative;
}

.mpsearch-list-item:last-child {
    border-bottom: none;
}

.mpsearch-list-item:hover {
    background-color: #eef3d6;
}

.mpsearch-list-item .result-wrapper a {
    text-decoration: none;
}

.result-wrapper .result-thumbnail {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 15%;
    margin: 0.5rem;
}

.result-wrapper .before_special {
    color: #aaaaaa;
    text-decoration: line-through;
    font-size: 12px;
}

.result-wrapper .text-ellipsis {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 0.9em;
    color: #aaaaaa
}

.no-results {
    padding: 1em 0;
    text-align: center;
}


.autocomplete-suggestions {
    position: absolute;
    width: 100%;
    z-index: 999;
}

@media all and (min-width: 769px), print {
    .autocomplete-suggestions {
        position: absolute;
        width: 99.5%;
        z-index: 999;
    }
}

@media all and (max-width: 768px), print {
    .minisearch .search-category {
        top: 24% !important;
        right: 15px !important;
        display: none;
    }

    .ais-SearchBox-submit {
        right: 15px !important;
        top: 10px;
    }

    .ais-SearchBox-submit.has-items {
        top: 10px;
        right: 50px !important;
    }

    .ais-SearchBox-submitIcon {
        width: 15px;
        height: 15px;
    }

    #algoliaAutocomplete .search-category {
        right: 1px !important;
        display: none;
    }

    #algoliaAutocomplete .mpSearch-input {
        display: none;
    }

    #algoliaAutocomplete .autocomplete-suggestions {
        border: 1px solid #c2c2c2;
        padding: 0;
        box-shadow: none;
    }

    #algoliaAutocomplete .ais-SearchBox-submit {
        display: block !important;
    }

    #algoliaAutocomplete .ais-SearchBox-reset {
        display: none !important;
    }

    .autocomplete-suggestions .mpsearch-list-item {
        width: 100%;
    }
}

@media all and (min-width: 769px), print {
    .algolia-search-block {
        position: relative;
        float: right;
    }

    .algolia-search-block {
        width: 374px;
    }
}

.algolia-search-block {
    position: relative;
}

.autocomplete-suggestions .result-content {
    display: flex;
    align-items: center;
}

.autocomplete-suggestions .result-content .result-sub-content {
    align-items: center;
    justify-content: center;
    width: 65%;
}

.autocomplete-suggestions .result-content .result-sub-content .name {
    font-size: 1.2em;
}

.autocomplete-suggestions .result-content .result-sub-content .name mark {
    font-weight: bold;
    background: none;
}

.autocomplete-suggestions .result-content .result-sub-content .product-line.product-price {
    text-align: left;
    color: black;
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
    #algoliaAutocomplete.two-columns {
        width: 532px !important;
    }

    .autocomplete-suggestions.two-columns {
        display: flex;
        flex-wrap: wrap;
        width: 530px !important;
    }

    .autocomplete-suggestions.two-columns .mpsearch-list, .autocomplete-suggestions.two-columns .ais-Hits {
        width: 100%;
    }

    .autocomplete-suggestions.two-columns div:not([class]) {
        width: 100%;
    }

    .autocomplete-suggestions .mpsearch-list-item {
        width: 50%;
    }
}

@media only screen and (min-width: 1025px) {
    #algoliaAutocomplete.two-columns {
        width: 564px !important;
    }

    .autocomplete-suggestions.two-columns {
        display: flex;
        flex-wrap: wrap;
        width: 562px !important;
    }

    .autocomplete-suggestions.two-columns .mpsearch-list {
        width: 100%;
        display: flex;
        flex-wrap: wrap;
    }

    .autocomplete-suggestions.two-columns .ais-Hits {
        width: 100%;
    }

    .autocomplete-suggestions.two-columns div:not([class]) {
        width: 100%;
    }

    .autocomplete-suggestions.two-columns .mpsearch-list-item {
        width: 50%;
        position: relative;
    }

    .autocomplete-suggestions.three-columns .mpsearch-list-item {
        width: 33%;
    }
}