#SearchMobileDefault {
  /** NEW: Feb 2024 Redesign */
  /** this is the clone of the above, but placed in the search-box-wrapper for design purposes */
  /** fixing the weird top position issues for autocomplete results on mobile */
  /** OLD DESIGN */
  /*.search-box-wrapper {
        position: relative;
        padding: 0;

        .search-dropdown {
            height: 40px;
            padding: 0;
            background: #f3f2f2;
            border: 0;
            width: 100%;
            float: none;

            .inline-input {
                padding: 0.32em 0.6em;
                margin: 0;

                form {
                    position: relative;
                    display: block;

                    input[type=text] {
                        width: 100%;
                        height: 27px;
                        padding: .2em 3em .2em 1em;
                        border: 1px solid #eaeaea;
                        margin-top: 0;
                    }
                }

            }
        }
    }*/
}
#SearchMobileDefault div.nav-search-toggle.mobile {
  cursor: pointer;
  margin-left: 40px !important;
}
#SearchMobileDefault div.nav-search-toggle.mobile span {
  display: none;
}
#SearchMobileDefault div.nav-search-toggle.mobile:before {
  content: '\e618';
  font-family: 'Pe-icon-7-stroke';
  font-size: 1.5em;
  line-height: 1.25em;
  color: unset;
}
#SearchMobileDefault div.nav-search-toggle.mobile.active:before {
  color: white;
}
#SearchMobileDefault div#nav-search-toggle--mobile--search {
  position: absolute;
  top: 54px;
  left: 6px;
}
#SearchMobileDefault .search-box-wrapper {
  /** applying the "modal" style pop out */
  height: 100vh;
  padding: 0;
  position: fixed;
  top: 0;
  left: 0;
  background: unset;
  z-index: 14;
  display: none;
}
#SearchMobileDefault .search-box-wrapper.active {
  display: block;
  background: rgba(0, 0, 0, 0.7);
}
#SearchMobileDefault .search-box-wrapper .search-dropdown {
  top: 100px;
  background: #f3f2f2;
  border: 0;
  float: none;
  /** NOTE: the '!important' prevents the scaling transition, and simply lets the opacity transition work */
  height: 40px !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: rgba(255, 255, 255, 0.5) 0 0 0 0.1em;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input {
  padding: 0.32em 0.6em;
  margin: 0;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form {
  position: relative;
  display: block;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form input[type=text] {
  /*width: 100%;*/
  height: 27px;
  padding: .2em 3em .2em 1em;
  border: 1px solid #eaeaea;
  margin-top: 0;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form input,
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form label {
  position: relative !important;
  line-height: 1em;
  color: black !important;
  font-weight: 300;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form input {
  width: 65%;
  margin-right: 5%;
  text-align: left;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form input::placeholder {
  visibility: hidden;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input form label {
  border: 0;
  float: left;
  width: 30%;
  padding: 0;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input .btn-close {
  width: fit-content;
  right: 5px;
}
#SearchMobileDefault .search-box-wrapper .search-dropdown .inline-input .btn-close:before {
  font-size: 3.2em;
}
#SearchMobileDefault body .ui-autocomplete {
  position: fixed;
  top: 140px !important;
}
body.mobile-app {
  /** NEW: Feb 2024 Redesign */
  /** this is the clone of the above, but placed in the search-box-wrapper for design purposes */
  /** fixing the weird top position issues for autocomplete results on mobile */
  /** OLD DESIGN */
  /*.search-box-wrapper {
        position: relative;
        padding: 0;

        .search-dropdown {
            height: 40px;
            padding: 0;
            background: #f3f2f2;
            border: 0;
            width: 100%;
            float: none;

            .inline-input {
                padding: 0.32em 0.6em;
                margin: 0;

                form {
                    position: relative;
                    display: block;

                    input[type=text] {
                        width: 100%;
                        height: 27px;
                        padding: .2em 3em .2em 1em;
                        border: 1px solid #eaeaea;
                        margin-top: 0;
                    }
                }

            }
        }
    }*/
}
body.mobile-app div.nav-search-toggle.mobile {
  cursor: pointer;
  margin-left: 40px !important;
}
body.mobile-app div.nav-search-toggle.mobile span {
  display: none;
}
body.mobile-app div.nav-search-toggle.mobile:before {
  content: '\e618';
  font-family: 'Pe-icon-7-stroke';
  font-size: 1.5em;
  line-height: 1.25em;
  color: unset;
}
body.mobile-app div.nav-search-toggle.mobile.active:before {
  color: white;
}
body.mobile-app div#nav-search-toggle--mobile--search {
  position: absolute;
  top: 54px;
  left: 6px;
}
body.mobile-app .search-box-wrapper {
  /** applying the "modal" style pop out */
  height: 100vh;
  padding: 0;
  position: fixed;
  top: 0;
  left: 0;
  background: unset;
  z-index: 14;
  display: none;
}
body.mobile-app .search-box-wrapper.active {
  display: block;
  background: rgba(0, 0, 0, 0.7);
}
body.mobile-app .search-box-wrapper .search-dropdown {
  top: 100px;
  background: #f3f2f2;
  border: 0;
  float: none;
  /** NOTE: the '!important' prevents the scaling transition, and simply lets the opacity transition work */
  height: 40px !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: rgba(255, 255, 255, 0.5) 0 0 0 0.1em;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input {
  padding: 0.32em 0.6em;
  margin: 0;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form {
  position: relative;
  display: block;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form input[type=text] {
  /*width: 100%;*/
  height: 27px;
  padding: .2em 3em .2em 1em;
  border: 1px solid #eaeaea;
  margin-top: 0;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form input,
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form label {
  position: relative !important;
  line-height: 1em;
  color: black !important;
  font-weight: 300;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form input {
  width: 65%;
  margin-right: 5%;
  text-align: left;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form input::placeholder {
  visibility: hidden;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input form label {
  border: 0;
  float: left;
  width: 30%;
  padding: 0;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input .btn-close {
  width: fit-content;
  right: 5px;
}
body.mobile-app .search-box-wrapper .search-dropdown .inline-input .btn-close:before {
  font-size: 3.2em;
}
body.mobile-app body .ui-autocomplete {
  position: fixed;
  top: 140px !important;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper {
  display: flex;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
  background: #fff;
  z-index: 14;
  width: 100% !important;
  padding: 0.5px 0 0.5px 50px;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#nav-search-toggle--mobile--search {
  display: none !important;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer {
  display: block !important;
  top: 0;
  height: 59px !important;
  box-shadow: none;
  background: #fff;
  float: none;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  position: relative;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input {
  padding: 0.32em 0.6em;
  margin: 0;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search {
  position: relative;
  display: block;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search label {
  display: none !important;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search input {
  width: 100%;
  height: 35px;
  margin: 0.6em 0 0;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search input::placeholder {
  visibility: visible;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search input[type=text] {
  padding: 0.2em 3em 0.2em 1em;
  border: 1px solid #eaeaea;
  text-align: left;
  position: relative !important;
  line-height: 1em;
  color: black !important;
  font-weight: 300;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search button.action.search.button {
  display: block !important;
  top: 8px;
  right: 8px;
  left: unset;
  font-size: 0.8em;
  opacity: 1;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input form.form-search button.action.search.button span .fa {
  font-size: unset;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer div.inline-input div.btn-close {
  display: none;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper div#quickSearchContainer input[type="text"]:not(:placeholder-shown) {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 7px !important;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart {
  height: 100%;
  margin: 0;
  padding: 0.9em 0.9em 0 0;
  display: inline-grid;
  position: relative;
  right: unset;
  text-align: unset !important;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart .tool-header {
  display: inline-flex;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart .header-action-link-container {
  float: unset !important;
  margin: 0 !important;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart .header-action-link-container div.wishlist {
  margin: 0 0 0 -0.6em;
}
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart .header-action-link span:not([class*=counter]),
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart .header-action-link span.counter.qty.empty,
body.mobile-app header.page-header .header .nav-container div.search-box-wrapper .header-icons.position-right.content-cart .wishlist .header-action-link span {
  display: none !important;
}
body.mobile-app ul.ui-autocomplete {
  top: 47px !important;
  left: 0 !important;
  width: 100% !important;
}
