
/* Suggestions box styling */
.suggestions-box {
  position: absolute;
  background-color: #FFFFFF; /* White background for suggestions */
  max-height: 200px;
  overflow-y: auto;
  width: 100%;
  z-index: 1000;
  max-width: 475px;
}

/* Individual suggestion item */
.suggestions-box div {
  padding: 10px;
  cursor: pointer;
  color: #000000; /* Black text color for suggestions */
  font-family: sans-serif; /* Use your font family */
}

/* Highlight suggestion on hover */
.suggestions-box div:hover {
  background-color: #ED2027; /* Light gold background on hover */
  color: #FFFFFF; /* White text on hover for better contrast */
}

/* Recent searches box */
.recent-searches {
  padding: 10px;
  background-color: #ED2027; /* Dark gold background for recent searches header */
  font-weight: bold;
  color: #FFFFFF; /* White text for the recent searches header */
}

/* Individual recent search item */
.recent-searches-item {
  padding: 10px;
  cursor: pointer;
  color: #000000; /* Black text color for recent search items */
}

/* Highlight recent search on hover */
.recent-searches-item:hover {
  background-color: #ED2027; /* Light gold hover effect for recent searches */
  color: #FFFFFF; /* White text on hover */
}






.icon-heart {
    cursor: pointer;
    transition: color 0.3s ease;
}

.icon-heart.bookmarked {
    color: red;
}




.desc-content-container {
      position: relative;
}
.desc-content {
      display: -webkit-box;
      -webkit-line-clamp: 5; /* Show only 5 lines */
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis; /* Add ellipsis (...) after the cut-off */
}
.desc-content.show-more {
      display: block;
      -webkit-line-clamp: unset;
      max-height: none; /* Allow the paragraph to expand fully */
      overflow: visible;
}

#map-single1 {
    width: 100%;
    height: auto;
}

iframe {
    display: block;
    width: 100%;
    height: 400px;
    border: 0;
}




.image-overlay-container {
    position: relative;
    width: 100%;
    height: auto;
    border-radius: 20px; /* Circular edges for the container */
    overflow: hidden; /* Ensures the image and overlay follow the rounded edges */
}

.image-overlay-container img {
    display: block;
    width: 100%;
    height: auto;
    min-width: 446px; /* Set minimum width */
    min-height: 298px; /* Set minimum height */
    object-fit: cover; /* Ensures the image scales properly */
    border-radius: 20px; /* Match the container's circular edges */
}

.city-list-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, 0.3); /* Lighter overlay for more image visibility */
    border-radius: 20px; /* Match the container's circular edges */
    z-index: 1; /* Ensure it overlays the image */
}

.list-4 {
    list-style: none;
    margin: 0;
    padding: 0;
    color: white;
    text-align: center;
    z-index: 10; /* Ensure the list appears on top of the overlay */
}

.list-4 li {
    margin: 5px 0;
    font-size: 18px; /* Font size for the list items */
}

.list-4 a {
    color: white;
    text-decoration: none;
    font-size: 18px; /* Match the font size of the list items */
}

.list-4 a:hover {
    text-decoration: underline;
}



