/**
* NOTICE OF LICENSE
*
* This source file is subject to the Academic Free License version 3.0
* that is bundled with this package in the file LICENSE.txt
* It is also available through the world-wide-web at this URL:
* https://opensource.org/licenses/AFL-3.0
*
* DISCLAIMER
*
* Do not edit or add to this file if you wish to upgrade this module to a newer
* versions in the future. If you wish to customize this module for your
* needs please refer to CustomizationPolicy.txt file inside our module for more information.
*
* @author Webkul IN
* @copyright Since 2010 Webkul
* @license https://opensource.org/licenses/AFL-3.0 Academic Free License version 3.0
*/

#wk_es_search_widget {
  position: relative;
}

#wk_es_search_widget .ui-autocomplete {
  box-sizing: border-box;
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 70vh;
  z-index: 9999;
}

#wk_es_search_widget .ui-menu-item {
  float: none;
  width: 100%;
  margin-bottom: 5px;
}

#wk_es_search_widget .ui-menu-item .product {
  font-size: 15px;
}

#wk_es_search_widget .ui-menu-item .ui-corner-all {
  float: none;
  width: 100%;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
}

#wk_es_search_widget .wk-img-search {
  float: left;
  width: 60px;
  margin-right: 5px;
}

/* WKES_CUSTOM_HIGHLIGHT: autocomplete row colors/gradient */
#wk_es_search_widget .ui-menu-item .ui-menu-item-wrapper {
  border: 1px solid transparent;
  border-radius: 6px;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}

#wk_es_search_widget .ui-menu-item .ui-menu-item-wrapper:hover,
#wk_es_search_widget .ui-menu-item .ui-menu-item-wrapper:focus,
#wk_es_search_widget .ui-menu-item .ui-menu-item-wrapper.ui-state-active,
#wk_es_search_widget .ui-menu-item .ui-menu-item-wrapper.ui-state-focus {
  background: linear-gradient(90deg, #e8f5e9 0%, #f7fbf8 100%) !important;
  color: #153a1b !important;
  border-color: #cfe5d4;
  outline: none;
}

/* WKES_FULLROW_HIGHLIGHT: force full-width active row */
#wk_es_search_widget .ui-menu-item {
  margin: 0 !important;
}

#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper,
#wk_es_search_widget .ui-menu-item > .ui-corner-all,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all,
#wk_es_search_widget .ui-menu-item > a.ui-menu-item-wrapper {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  border-radius: 0 !important;
}

#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper:hover,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper.ui-state-active,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper.ui-state-focus,
#wk_es_search_widget .ui-menu-item > .ui-corner-all:hover,
#wk_es_search_widget .ui-menu-item > .ui-corner-all.ui-state-active,
#wk_es_search_widget .ui-menu-item > .ui-corner-all.ui-state-focus,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all:hover,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all.ui-state-active,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all.ui-state-focus {
  background: linear-gradient(90deg, #e8f5e9 0%, #f7fbf8 100%) !important;
  color: #153a1b !important;
  border: 0 !important;
}

/* WKES_FINAL_FIX: full-width highlight + visible vertical scrollbar */
#wk_es_search_widget .ui-autocomplete {
  max-height: 60vh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}

#wk_es_search_widget .ui-menu-item {
  margin: 0 !important;
  padding: 0 !important;
}

#wk_es_search_widget .ui-menu-item > a.ui-corner-all,
#wk_es_search_widget .ui-menu-item > a.ui-menu-item-wrapper,
#wk_es_search_widget .ui-menu-item > .ui-corner-all,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

#wk_es_search_widget .ui-menu-item > a.ui-corner-all.ui-state-active,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all.ui-state-focus,
#wk_es_search_widget .ui-menu-item > a.ui-menu-item-wrapper.ui-state-active,
#wk_es_search_widget .ui-menu-item > a.ui-menu-item-wrapper.ui-state-focus,
#wk_es_search_widget .ui-menu-item > .ui-corner-all.ui-state-active,
#wk_es_search_widget .ui-menu-item > .ui-corner-all.ui-state-focus,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper.ui-state-active,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper.ui-state-focus,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all:hover,
#wk_es_search_widget .ui-menu-item > a.ui-menu-item-wrapper:hover,
#wk_es_search_widget .ui-menu-item > .ui-corner-all:hover,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper:hover {
  background: linear-gradient(90deg, #e8f5e9 0%, #f7fbf8 100%) !important;
  color: #153a1b !important;
}

/* prevent inner text span from painting its own partial background */
#wk_es_search_widget .ui-menu-item .product,
#wk_es_search_widget .ui-menu-item .product.ui-state-active,
#wk_es_search_widget .ui-menu-item .product.ui-state-focus {
  background: transparent !important;
}

/* WKES_FONT_TUNE: match theme font and reduce dropdown text size */
#wk_es_search_widget .ui-autocomplete,
#wk_es_search_widget .ui-menu-item,
#wk_es_search_widget .ui-menu-item > a.ui-corner-all,
#wk_es_search_widget .ui-menu-item > a.ui-menu-item-wrapper,
#wk_es_search_widget .ui-menu-item > .ui-corner-all,
#wk_es_search_widget .ui-menu-item > .ui-menu-item-wrapper,
#wk_es_search_widget .ui-menu-item .product {
  font-family: Inter, Arial, Helvetica, sans-serif !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
}

/* WKES_WIDTH_FORCE: force dropdown to full widget width */
#_desktop_search_widget #wk_es_search_widget {
  position: relative !important;
}

#_desktop_search_widget #wk_es_search_widget .ui-autocomplete,
#_desktop_search_widget #wk_es_search_widget ul.ui-autocomplete,
#_desktop_search_widget #wk_es_search_widget .ui-front.ui-autocomplete {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  min-width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
