/* ==========================================================
   BLUEVAULT SCIENTIFIC
   FINAL MOBILE MENU + AJAX SEARCH
   ========================================================== */

@media (max-width: 1024px) {

    /* ======================================================
       COLOR SYSTEM
       ====================================================== */

    :root {
        --bvs-navy: #071B2B;
        --bvs-navy-2: #0A2538;
        --bvs-navy-3: #10354B;
        --bvs-navy-hover: #16445D;

        --bvs-cyan: #75D9EC;
        --bvs-white: #FFFFFF;
        --bvs-muted: #AEBCC7;

        --bvs-divider: rgba(255, 255, 255, 0.14);
    }


    /* ======================================================
       1. COMPLETE MOBILE DRAWER
       ====================================================== */

    body .mobile-nav,
    body .mobile-nav.wd-side-hidden,
    body .mobile-nav.wd-opened,
    body .mobile-nav .wd-scroll,
    body .mobile-nav .wd-scroll-content {
        background: var(--bvs-navy) !important;
        color: var(--bvs-white) !important;
    }


    /* ======================================================
       2. TOP SEARCH AREA
       ====================================================== */

    body .mobile-nav .searchform,
    body .mobile-nav .wd-search-form,
    body .mobile-nav .woodmart-search-form,
    body .mobile-nav .searchform-wrapper,
    body .mobile-nav .wd-search-form-wrapper {
        background: var(--bvs-navy) !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    body .mobile-nav input[type="search"],
    body .mobile-nav input[type="text"],
    body .mobile-nav .searchform input,
    body .mobile-nav .wd-search-form input {
        background: transparent !important;
        color: var(--bvs-white) !important;

        border: 0 !important;
        box-shadow: none !important;

        font-size: 17px !important;
        font-weight: 500 !important;
    }

    body .mobile-nav input::placeholder {
        color: var(--bvs-muted) !important;
        opacity: 1 !important;
    }


    /* Search / close icons */

    body .mobile-nav .searchsubmit,
    body .mobile-nav .wd-search-form button,
    body .mobile-nav .wd-close-side,
    body .mobile-nav .wd-close-side a,
    body .mobile-nav .wd-close-side:before,
    body .mobile-nav .wd-close-side:after {
        color: var(--bvs-white) !important;
        background: transparent !important;
    }


    /* ======================================================
       3. AJAX SEARCH RESULTS WRAPPER
       ====================================================== */

    body .autocomplete-suggestions,
    body .search-results-wrapper,
    body .wd-search-results,
    body .wd-search-results-wrapper,
    body .wd-dropdown-results,
    body .wd-dropdown-results .wd-scroll,
    body .wd-dropdown-results .wd-scroll-content {
        background: var(--bvs-navy-3) !important;

        border: 0 !important;
        box-shadow: none !important;
    }


    /* ======================================================
       4. INDIVIDUAL SEARCH RESULT
       ====================================================== */

    body .autocomplete-suggestion,
    body .autocomplete-suggestions .autocomplete-suggestion,
    body .wd-suggestion,
    body .wd-suggestion-content {
        background: var(--bvs-navy-3) !important;

        border-bottom: 1px solid var(--bvs-divider) !important;

        padding: 18px 20px !important;

        color: var(--bvs-white) !important;
    }


    /* Hover / tap */

    body .autocomplete-suggestion:hover,
    body .autocomplete-suggestion.autocomplete-selected,
    body .wd-suggestion:hover,
    body .wd-suggestion-content:hover {
        background: var(--bvs-navy-hover) !important;
    }


    /* ======================================================
       5. PRODUCT THUMBNAIL
       ====================================================== */

    body .autocomplete-suggestion .suggestion-thumb,
    body .wd-suggestion .suggestion-thumb {
        width: 72px !important;
        min-width: 72px !important;

        margin-right: 16px !important;
    }

    body .autocomplete-suggestion .suggestion-thumb img,
    body .wd-suggestion .suggestion-thumb img {
        width: 72px !important;
        height: 72px !important;

        object-fit: cover !important;

        border-radius: 8px !important;

        background: #F7F9FB !important;

        border: 1px solid rgba(255,255,255,0.15) !important;
    }


    /* ======================================================
       6. PRODUCT TITLE
       ====================================================== */

    body .autocomplete-suggestion .suggestion-title,
    body .autocomplete-suggestion .suggestion-title a,
    body .autocomplete-suggestion .wd-entities-title,
    body .autocomplete-suggestion .wd-entities-title a,
    body .wd-suggestion .wd-entities-title,
    body .wd-suggestion .wd-entities-title a,
    body .wd-suggestion-content .wd-entities-title,
    body .wd-suggestion-content .wd-entities-title a {
        color: var(--bvs-white) !important;

        -webkit-text-fill-color: var(--bvs-white) !important;

        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.3 !important;

        text-decoration: none !important;

        opacity: 1 !important;
    }


    /* ======================================================
       7. PRODUCT PRICE
       ====================================================== */

    body .autocomplete-suggestion .suggestion-price,
    body .autocomplete-suggestion .suggestion-price *,
    body .autocomplete-suggestion .price,
    body .autocomplete-suggestion .price *,
    body .autocomplete-suggestion p.price,
    body .autocomplete-suggestion p.price *,

    body .wd-suggestion .price,
    body .wd-suggestion .price *,
    body .wd-suggestion p.price,
    body .wd-suggestion p.price *,

    body .wd-suggestion-content .price,
    body .wd-suggestion-content .price *,
    body .wd-suggestion-content p.price,
    body .wd-suggestion-content p.price *,

    body .autocomplete-suggestion .amount,
    body .autocomplete-suggestion .woocommerce-Price-amount,
    body .autocomplete-suggestion .woocommerce-Price-currencySymbol,

    body .wd-suggestion .amount,
    body .wd-suggestion .woocommerce-Price-amount,
    body .wd-suggestion .woocommerce-Price-currencySymbol {

        color: var(--bvs-cyan) !important;

        -webkit-text-fill-color: var(--bvs-cyan) !important;

        opacity: 1 !important;

        font-size: 16px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;

        text-decoration: none !important;
    }


    /* Old / sale price */

    body .autocomplete-suggestion del,
    body .autocomplete-suggestion del *,
    body .wd-suggestion del,
    body .wd-suggestion del * {
        color: var(--bvs-muted) !important;
        -webkit-text-fill-color: var(--bvs-muted) !important;
        opacity: 0.7 !important;
    }


    /* Current / sale price */

    body .autocomplete-suggestion ins,
    body .autocomplete-suggestion ins *,
    body .wd-suggestion ins,
    body .wd-suggestion ins * {
        color: var(--bvs-cyan) !important;
        -webkit-text-fill-color: var(--bvs-cyan) !important;
        text-decoration: none !important;
    }


    /* ======================================================
       8. VIEW ALL RESULTS
       ====================================================== */

    body .wd-all-results,
    body a.wd-all-results,
    body .autocomplete-suggestions .wd-all-results,
    body .search-results-wrapper .wd-all-results {
        display: block !important;

        width: 100% !important;

        background: var(--bvs-navy-2) !important;

        color: var(--bvs-white) !important;
        -webkit-text-fill-color: var(--bvs-white) !important;

        border: 0 !important;
        border-bottom: 1px solid var(--bvs-divider) !important;

        padding: 16px 20px !important;

        text-align: center !important;

        font-size: 14px !important;
        font-weight: 700 !important;

        letter-spacing: 0.045em !important;

        text-transform: uppercase !important;

        box-shadow: none !important;
    }


    body .wd-all-results *,
    body .wd-all-results a {
        color: var(--bvs-white) !important;
        -webkit-text-fill-color: var(--bvs-white) !important;

        font-size: inherit !important;
        font-weight: inherit !important;
    }


    body .wd-all-results:hover,
    body a.wd-all-results:hover {
        background: var(--bvs-navy-hover) !important;
    }


    /* ======================================================
       9. MAIN MOBILE MENU
       ====================================================== */

    body .mobile-nav .wd-nav-mobile,
    body .mobile-nav .wd-nav-mobile > li,
    body .mobile-nav .wd-nav-mobile > li > a {
        background: var(--bvs-navy) !important;
    }


    body .mobile-nav .wd-nav-mobile > li {
        border-bottom: 1px solid var(--bvs-divider) !important;
    }


    body .mobile-nav .wd-nav-mobile > li > a,
    body .mobile-nav .wd-nav-mobile > li > a span {
        color: var(--bvs-white) !important;

        font-weight: 600 !important;

        opacity: 1 !important;
    }


    /* Main menu hover */

    body .mobile-nav .wd-nav-mobile > li > a:hover {
        background: var(--bvs-navy-2) !important;
    }


    /* ======================================================
       10. MOBILE MENU ARROWS
       ====================================================== */

    body .mobile-nav .wd-nav-opener,
    body .mobile-nav .wd-nav-opener:before,
    body .mobile-nav .wd-nav-opener:after {
        color: var(--bvs-cyan) !important;

        border-color: var(--bvs-divider) !important;
    }


    /* ======================================================
       11. SUBMENUS / CATEGORIES
       ====================================================== */

    body .mobile-nav .wd-nav-mobile .sub-menu {
        background: var(--bvs-navy-2) !important;
    }


    body .mobile-nav .wd-nav-mobile .sub-menu li {
        background: var(--bvs-navy-2) !important;

        border-bottom: 1px solid var(--bvs-divider) !important;
    }


    body .mobile-nav .wd-nav-mobile .sub-menu li a,
    body .mobile-nav .wd-nav-mobile .sub-menu li a span {
        color: var(--bvs-muted) !important;

        font-weight: 400 !important;

        opacity: 1 !important;
    }


    body .mobile-nav .wd-nav-mobile .sub-menu li a:hover {
        background: var(--bvs-navy-3) !important;
        color: var(--bvs-white) !important;
    }


    /* ======================================================
       12. DIVIDERS / BORDERS
       ====================================================== */

    body .mobile-nav hr,
    body .mobile-nav .wd-nav-mobile,
    body .mobile-nav .searchform,
    body .autocomplete-suggestions,
    body .wd-dropdown-results {
        border-color: var(--bvs-divider) !important;
    }


    /* ======================================================
       13. REMOVE RANDOM WHITE / BLACK BACKGROUNDS
       ====================================================== */

    body .mobile-nav .wd-dropdown,
    body .mobile-nav .wd-dropdown-menu,
    body .mobile-nav .wd-dropdown-results,
    body .mobile-nav .wd-dropdown-results *,
    body .autocomplete-suggestions > div {
        box-shadow: none !important;
    }


    /* ======================================================
       14. KEEP AJAX RESULT TEXT CRISP
       ====================================================== */

    body .autocomplete-suggestions,
    body .autocomplete-suggestions *,
    body .wd-dropdown-results,
    body .wd-dropdown-results * {
        text-shadow: none !important;
    }

}