/* =========================================================
   THE DOPE PINEAPPLE - CLEAN SEARCH STYLING
   ========================================================= */

.ct-search-form .ct-ajax-loader {
  color: #000 !important;
}

/* Main wrapper */
html body .dope-blocksy-search-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 920px !important;
  margin: 0 auto !important;
  position: relative !important;
  z-index: 20 !important;
  box-sizing: border-box !important;
}

/* Form */
html body .dope-blocksy-search-wrap .ct-search-form,
html body .dope-blocksy-search-wrap form.dope-custom-product-search {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  width: 100% !important;
  max-width: 100% !important;
  position: relative !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

html body .dope-blocksy-search-wrap .ct-search-form > *,
html body .dope-blocksy-search-wrap form.dope-custom-product-search > * {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Search input */
html body .dope-blocksy-search-wrap input[type="search"] {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 72px !important;
  min-height: 72px !important;
  padding: 0 76px 0 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #a8cf3a !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #fff !important;
  font-size: 40px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  outline: none !important;
  box-shadow: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
}

html body .dope-blocksy-search-wrap input[type="search"]::placeholder {
  color: rgba(255, 255, 255, 0.65) !important;
  opacity: 1 !important;
}

/* Search button */
html body .dope-blocksy-search-wrap .ct-search-form button,
html body .dope-blocksy-search-wrap .ct-search-form .wp-element-button,
html body .dope-blocksy-search-wrap form.dope-custom-product-search button,
html body .dope-blocksy-search-wrap form.dope-custom-product-search button.wp-element-button {
  position: absolute !important;
  top: 36px !important;
  right: 0 !important;
  left: auto !important;
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  height: 56px !important;
  min-height: 56px !important;
  max-height: 56px !important;
  transform: translateY(-50%) !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #a8cf3a !important;
  color: #fff !important;
  padding: 0 !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 10 !important;
  box-shadow: none !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  transition: background 0.18s ease, opacity 0.18s ease, transform 0.18s ease !important;
}

html body .dope-blocksy-search-wrap .ct-search-form button:hover,
html body .dope-blocksy-search-wrap .ct-search-form .wp-element-button:hover,
html body .dope-blocksy-search-wrap form.dope-custom-product-search button:hover,
html body .dope-blocksy-search-wrap form.dope-custom-product-search button.wp-element-button:hover {
  background: #b4dd42 !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html body .dope-blocksy-search-wrap button svg,
html body .dope-blocksy-search-wrap .wp-element-button svg {
  display: block !important;
  width: 20px !important;
  height: 20px !important;
  fill: currentColor !important;
  color: inherit !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Spinner */
html body .dope-blocksy-search-wrap .dope-search-button-spinner {
  display: none !important;
  position: absolute !important;
  width: 28px !important;
  height: 28px !important;
  left: 50% !important;
  top: 50% !important;
  margin-left: -14px !important;
  margin-top: -14px !important;
  border: 3px solid rgba(0, 0, 0, 0.25) !important;
  border-top-color: #000 !important;
  border-radius: 999px !important;
  animation: dopeSearchSpin 0.7s linear infinite !important;
  box-sizing: border-box !important;
  pointer-events: none !important;
}

html body .dope-blocksy-search-wrap.dope-search-is-loading button svg,
html body .dope-blocksy-search-wrap .ct-search-form.dope-search-is-loading button svg {
  opacity: 0 !important;
  visibility: hidden !important;
}

html body .dope-blocksy-search-wrap.dope-search-is-loading .dope-search-button-spinner,
html body .dope-blocksy-search-wrap .ct-search-form.dope-search-is-loading .dope-search-button-spinner {
  display: block !important;
}

@keyframes dopeSearchSpin {
  to {
    transform: rotate(360deg);
  }
}

/* Results container */
html body .dope-blocksy-search-wrap .ct-live-results,
html body .dope-blocksy-search-wrap .dope-custom-live-results,
html body .dope-blocksy-search-wrap .ct-search-results {
  display: none !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  float: none !important;
  clear: both !important;
  order: 20 !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  gap: 10px !important;
  margin: 22px 0 0 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: none !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}

html body .dope-blocksy-search-wrap.dope-results-open .ct-live-results,
html body .dope-blocksy-search-wrap.dope-results-open .dope-custom-live-results,
html body .dope-blocksy-search-wrap .dope-custom-product-search.dope-results-open .dope-custom-live-results,
html body .dope-blocksy-search-wrap .dope-custom-product-search.ct-has-dropdown .dope-custom-live-results,
html body .dope-blocksy-search-wrap .ct-search-results:not(:empty) {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap;
}

html body .dope-blocksy-search-wrap .ct-live-results::-webkit-scrollbar,
html body .dope-blocksy-search-wrap .dope-custom-live-results::-webkit-scrollbar,
html body .dope-blocksy-search-wrap .ct-search-results::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

html body .dope-blocksy-search-wrap .ct-live-results a, html body .dope-blocksy-search-wrap .dope-custom-live-results a {
    background: #b7cb56 !important;
    color: #000 !important;
    font-size: 22px !important;
}

/* Result row */
html body .dope-blocksy-search-wrap .ct-search-item,
html body .dope-blocksy-search-wrap .ct-live-results .ct-search-item,
html body .dope-blocksy-search-wrap .dope-custom-live-results .ct-search-item,
html body .dope-blocksy-search-wrap .ct-search-results a,
html body .dope-blocksy-search-wrap .ct-search-results article,
html body .dope-blocksy-search-wrap .ct-live-results article {
  display: flex !important;
  align-items: center !important;
  gap: 22px !important;
  width: 49% !important;
  max-width: 49% !important;
  padding: 14px 18px !important;
  margin: 0 !important;
  border: 2px solid #000 !important;
  border-radius: 14px !important;
  background: #000 !important;
  color: #fff !important;
  text-decoration: none !important;
  box-sizing: border-box !important;
  box-shadow: none !important;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

html body .dope-blocksy-search-wrap .ct-search-item:hover,
html body .dope-blocksy-search-wrap .ct-live-results .ct-search-item:hover,
html body .dope-blocksy-search-wrap .dope-custom-live-results .ct-search-item:hover,
html body .dope-blocksy-search-wrap .ct-search-results a:hover,
html body .dope-blocksy-search-wrap .ct-live-results a:hover {
  border-color: rgba(168, 207, 58, 0.55) !important;
  background: #000 !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
  text-decoration: none !important;
}

/* Result image wrapper */
html body .dope-blocksy-search-wrap .ct-media-container,
html body .dope-blocksy-search-wrap .dope-live-result-media {
  width: 165px !important;
  height: 165px !important;
  min-width: 165px !important;
  max-width: 165px !important;
  flex: 0 0 165px !important;
  border: 0 !important;
  border-radius: 12px !important;
  background: #fff !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Result image */
html body .dope-blocksy-search-wrap .ct-media-container img,
html body .dope-blocksy-search-wrap .ct-media-container picture,
html body .dope-blocksy-search-wrap .dope-live-result-media img,
html body .dope-blocksy-search-wrap .dope-live-result-media picture {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 100% !important;
  min-height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  background: #fff !important;
  border: 0 !important;
  border-radius: 12px !important;
  opacity: 1 !important;
  visibility: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

html body .dope-blocksy-search-wrap .dope-live-result-media-empty {
  opacity: 0 !important;
}

/* Result content */
html body .dope-blocksy-search-wrap .dope-result-content,
html body .dope-blocksy-search-wrap .ct-search-item > span:not(.ct-media-container) {
  min-width: 0 !important;
  flex: 1 1 auto !important;
  display: block !important;
  color: #fff !important;
}

/* Product title */
html body .dope-blocksy-search-wrap .ct-search-title,
html body .dope-blocksy-search-wrap .entry-title,
html body .dope-blocksy-search-wrap .ct-search-item > span:not(.ct-media-container) {
  display: block !important;
  color: #fff !important;
  font-size: 26px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Price / meta */
html body .dope-blocksy-search-wrap .price,
html body .dope-blocksy-search-wrap .product-search-meta,
html body .dope-blocksy-search-wrap .product-search-meta small,
html body .dope-blocksy-search-wrap .product-search-meta .price,
html body .dope-blocksy-search-wrap .ct-search-excerpt,
html body .dope-blocksy-search-wrap .ct-meta {
  display: block !important;
  margin: 6px 0 0 0 !important;
  padding: 0 !important;
  color: rgb(177 205 74) !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.35 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* More results button */
html body .dope-blocksy-search-wrap .ct-search-more,
html body .dope-blocksy-search-wrap a[href*="/search/"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 10px auto 0 !important;
  padding: 13px 24px !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 14px !important;
  background: rgba(255, 255, 255, 0.06) !important;
  color: #a8cf3a !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease !important;
}

html body .dope-blocksy-search-wrap .ct-search-more:hover,
html body .dope-blocksy-search-wrap a[href*="/search/"]:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  border-color: rgba(168, 207, 58, 0.55) !important;
  color: #a8cf3a !important;
  transform: translateY(-1px) !important;
}

/* Search message */
html body .dope-blocksy-search-wrap .dope-search-message,
html body .dope-blocksy-search-wrap .ct-live-results p,
html body .dope-blocksy-search-wrap .dope-custom-live-results p,
html body .dope-blocksy-search-wrap .ct-search-results p {
  color: rgba(255, 255, 255, 0.72) !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  border: 1px solid #000 !important;
  border-radius: 14px !important;
  background: #000 !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

/* Mobile */
@media (max-width: 767px) {

/* Result row */
html body .dope-blocksy-search-wrap .ct-search-item,
html body .dope-blocksy-search-wrap .ct-live-results .ct-search-item,
html body .dope-blocksy-search-wrap .dope-custom-live-results .ct-search-item,
html body .dope-blocksy-search-wrap .ct-search-results a,
html body .dope-blocksy-search-wrap .ct-live-results a,
html body .dope-blocksy-search-wrap .dope-custom-live-results a,
html body .dope-blocksy-search-wrap .ct-search-results article,
html body .dope-blocksy-search-wrap .ct-live-results article {
  width: 100% !important;
  max-width: 100% !important;
}

  html body .dope-blocksy-search-wrap {
    max-width: 100% !important;
  }

  html body .dope-blocksy-search-wrap input[type="search"] {
    padding-right: 62px !important;
    font-size: 30px !important;
    padding-left: 30px !important;
  }

  html body .dope-blocksy-search-wrap .ct-search-form button,
  html body .dope-blocksy-search-wrap .ct-search-form .wp-element-button,
  html body .dope-blocksy-search-wrap form.dope-custom-product-search button,
  html body .dope-blocksy-search-wrap form.dope-custom-product-search button.wp-element-button {
    top: 30px !important;
    width: 48px !important;
    min-width: 48px !important;
    max-width: 48px !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
  }

  html body .dope-blocksy-search-wrap .ct-live-results,
  html body .dope-blocksy-search-wrap .dope-custom-live-results,
  html body .dope-blocksy-search-wrap .ct-search-results {
    margin-top: 18px !important;
  }

  html body .dope-blocksy-search-wrap .ct-search-item,
  html body .dope-blocksy-search-wrap .ct-live-results .ct-search-item,
  html body .dope-blocksy-search-wrap .dope-custom-live-results .ct-search-item,
  html body .dope-blocksy-search-wrap .ct-search-results a,
  html body .dope-blocksy-search-wrap .ct-live-results a {
    min-height: 96px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    gap: 12px !important;
  }

  html body .dope-blocksy-search-wrap .ct-media-container,
  html body .dope-blocksy-search-wrap .dope-live-result-media {
    width: 76px !important;
    height: 76px !important;
    min-width: 76px !important;
    max-width: 76px !important;
    flex: 0 0 76px !important;
    border-radius: 9px !important;
  }

  html body .dope-blocksy-search-wrap .ct-media-container img,
  html body .dope-blocksy-search-wrap .ct-media-container picture,
  html body .dope-blocksy-search-wrap .dope-live-result-media img,
  html body .dope-blocksy-search-wrap .dope-live-result-media picture {
    border-radius: 9px !important;
  }

  html body .dope-blocksy-search-wrap .ct-search-title,
  html body .dope-blocksy-search-wrap .entry-title {
    font-size: 18px !important;
  }

}