/**
 * 绉诲姩绔悳绱㈡彃浠舵渶杩戞悳绱㈣瘝鏍峰紡
 * 涓?top-bar 鐨勬悳绱笅鎷夎彍鍗曟牱寮忎繚鎸佷竴鑷?
 */

/* Platform product-search plugin visual normalization */
.plugin-product-search,
.plugin-product-search * {
  box-sizing: border-box;
}

.plugin-product-search {
  color: #111 !important;
  font-family: inherit;
}

.plugin-product-search-SearchBar {
  color: #111 !important;
}

.plugin-product-search-SearchBar .plugin-product-search-searchInputWrap {
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) 32px !important;
  align-items: center !important;
  column-gap: 12px !important;
  width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 18px !important;
  color: #111 !important;
  background: #fff !important;
  border: 1px solid rgb(0 0 0 / 18%) !important;
  border-radius: 0 !important;
  box-shadow: 0 18px 45px rgb(0 0 0 / 16%) !important;
  overflow: hidden !important;
}

.plugin-product-search-SearchBar .plugin-product-search-searchInputWrap:focus-within {
  border-color: #111 !important;
  box-shadow: 0 18px 45px rgb(0 0 0 / 16%), 0 0 0 1px #111 !important;
}

.plugin-product-search-SearchBar .plugin-product-search-search-input-searchBtn {
  grid-column: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  min-width: 28px !important;
  height: 58px !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #111 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.plugin-product-search-SearchBar .plugin-product-search-searchInputWarp,
.plugin-product-search-SearchBar .plugin-product-search-index-input {
  grid-column: 2 !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  width: 100% !important;
  height: 58px !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #111 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.plugin-product-search-SearchBar .plugin-product-search-index-input-bg,
.plugin-product-search-SearchBar .plugin-product-search-index-input-bg-item {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  pointer-events: none !important;
}

.plugin-product-search-SearchBar .plugin-product-search-searchInput,
.plugin-product-search-SearchBar input[type="search"],
.plugin-product-search-SearchBar input[type="text"] {
  display: block !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 58px !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #111 !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 14px !important;
  line-height: 58px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -webkit-text-fill-color: #111 !important;
}

.plugin-product-search-SearchBar .plugin-product-search-searchInput::placeholder,
.plugin-product-search-SearchBar input[type="search"]::placeholder,
.plugin-product-search-SearchBar input[type="text"]::placeholder {
  color: rgb(0 0 0 / 48%) !important;
  opacity: 1 !important;
  -webkit-text-fill-color: rgb(0 0 0 / 48%) !important;
}

.plugin-product-search-SearchBar input[type="search"]::-webkit-search-cancel-button,
.plugin-product-search-SearchBar input[type="search"]::-webkit-search-decoration {
  display: none !important;
  -webkit-appearance: none !important;
}

.plugin-product-search-SearchBar .plugin-product-search-custom-search-icon {
  display: block !important;
  width: 19px !important;
  height: 21px !important;
  color: #111 !important;
  fill: currentColor !important;
  stroke: none !important;
  pointer-events: none;
}

.plugin-product-search-SearchBar .plugin-product-search-custom-search-icon path {
  fill: currentColor !important;
  stroke: none !important;
}

.plugin-product-search-SearchBar .plugin-product-search-searchInputWrap > .plugin-product-search-expand-scope:last-child,
.plugin-product-search-SearchBar .plugin-product-search-expand-scope:has(.plugin-product-search-closeIcon) {
  grid-column: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  min-width: 32px !important;
  height: 58px !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #111 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  line-height: 1 !important;
  cursor: pointer !important;
}

.plugin-product-search-SearchBar .plugin-product-search-closeIcon {
  display: block !important;
  width: 24px !important;
  height: 24px !important;
  color: #111 !important;
  stroke: currentColor !important;
}

.plugin-product-search-SearchResult {
  color: #111 !important;
  background: #fff !important;
  border-color: rgb(0 0 0 / 10%) !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] a,
.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] button {
  color: #111 !important;
}

/* Scoped layout for the app-generated recommended search panel. */
.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] {
  display: block !important;
  gap: 0 !important;
  width: 100% !important;
  min-height: auto !important;
  padding: 0 !important;
  color: #111 !important;
  background: #fff !important;
  border-top: 1px solid rgb(0 0 0 / 10%) !important;
  overflow: visible !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-SearchResult-word-side {
  display: none !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-RecommendProducts-container {
  min-width: 0 !important;
  height: auto !important;
  max-height: none !important;
  padding: 32px 32px 28px !important;
  background: #fff !important;
  overflow: visible !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-RecommendProducts-title {
  margin: 0 0 18px !important;
  color: #111 !important;
  font-family: inherit !important;
  font-size: 22px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-RecommendProducts {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 18px !important;
  align-items: start !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductItem {
  min-width: 0 !important;
  width: 100% !important;
  color: #111 !important;
  text-align: center !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductImage,
.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductImage-wrap {
  width: 100% !important;
  aspect-ratio: 2 / 3 !important;
  overflow: hidden !important;
  background: #f6f2ed !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductImage img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductName {
  display: -webkit-box !important;
  max-width: 92% !important;
  margin: 18px auto 0 !important;
  overflow: hidden !important;
  color: #111 !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.28 !important;
  letter-spacing: 0.02em !important;
  text-align: center !important;
  text-transform: uppercase !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 2 !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductPrice {
  display: flex !important;
  justify-content: center !important;
  margin-top: 14px !important;
  color: #111 !important;
  text-align: center !important;
}

.plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-currentPrice__item {
  color: #111 !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  line-height: 1.3 !important;
}

@media (max-width: 959px) {
  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] {
    display: block !important;
    min-height: auto !important;
  }

  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-SearchResult-word-side {
    display: block !important;
    width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: none !important;
    padding: 22px 18px 0 !important;
    color: #111 !important;
    background: #fff !important;
    overflow: visible !important;
  }

  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-RecommendProducts-title {
    font-size: 20px !important;
  }

  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-RecommendProducts-container {
    padding: 22px 18px 24px !important;
  }

  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-RecommendProducts {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px 14px !important;
  }

  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-ProductName {
    margin-top: 12px !important;
    font-size: 13px !important;
  }

  .plugin-product-search-SearchResult[data-theme-search-panel="club-layout"] .plugin-product-search-currentPrice__item {
    font-size: 14px !important;
  }
}