#suggestions-box-wrapper {
  display: none;
  position: relative;
  background-color: #fff;
  width: 100%;
  max-height: 250px;
  overflow-y: auto;
  border: 1px solid #ddd; /* Border color */
  border-radius: 4px; /* Rounded corners */
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); /* Shadow for better visibility */
  z-index: 9; /* Ensure it appears above other elements */
}

#suggestions-box-wrapper ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

#suggestions-box-wrapper li {
  padding: 10px;
  cursor: pointer;
  border-bottom: 1px solid #ddd; /* Divider line between items */
  transition: background-color 0.2s ease; /* Smooth background color transition */
}

#suggestions-box-wrapper li:hover {
  background-color: #f0f0f0;
}

#suggestions-box-wrapper li:hover {
  background-color: #f5f5f5; /* Hover effect */
}

.product-search-form {
  position: absolute;
  z-index: 9;
  right: 0;
  padding: 40px 55px;
  width: 590px;
}

#suggestions-box-wrapper li.no-results {
  padding: 12px 16px;
  color: #999;
  text-align: center;
}

#product-search-form label {
  display: none;
}

#product-search-form .form-text {
  width: 100%;
  border: 2px solid transparent;
}

#product-search-form .form__item {
  margin-bottom: 0;
}

/* Responsive Styles */
@media (max-width: 1024px) { /* Tablets and smaller screens */
  .product-search-form {
    padding: 20px 40px;
    width: 100%;
  }

  #suggestions-box-wrapper {
    max-height: 200px; /* Reduce height on smaller screens */
  }

  .hero--homepage .hero__fg {
    padding-top: 90px !important;
  }
}