/* ---------------------------------------------
|| Property Cards - GRID
-------------------------------------------------- */
.swiper-related-properties .property-card {
  border: 1px solid #ddd;
  margin-bottom: 1.25rem;
}


/* Remove margin from property cards inside any swiper instance to prevent layout conflicts. */
.swiper-slide .property-card {
  margin-inline: 0;
}

/* Project Highlights */
.swiper-project-highlights {
  padding-block: 1rem;
}

.swiper-project-highlights .swiper-slide {
  height: auto;
  display: flex;
  align-items: stretch;
}

.highlight-box {
  padding: 1.5rem;
  color: #fff;
  width: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 0.5rem;
  box-shadow: var(--box-shadow-1);
}

.swiper-project-highlights .swiper-slide:nth-child(odd) .highlight-box {
  background-color: hsl(var(--color-primary));
}

.swiper-project-highlights .swiper-slide:nth-child(even) .highlight-box {
  background-color: hsl(var(--color-accent-2));
}

/* Swiper */
.swiper-container {
  width: 100%;
  height: auto;
  overflow: hidden;
}
.swiper-slide {
  width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-container {
  width: 100%;
  height: auto; /* Adjust height as needed */
}

.swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper-pagination-bullet {
  background: #fff;
}

/* Swiper Js */
.swiper-button-next,
.swiper-button-prev {
  width: 30px;
  height: 30px;
  padding: 10px;
}

/* Adjust the arrow icon size */
.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 20px;
}

/* Target Swiper Navigation Arrows */
.swiper-button-next,
.swiper-button-prev {
  color: #fff;
  background: hsl(var(--color-accent-2));
  padding: 15px;
  border-radius: 50%;
  transition: all 0.3s ease;
}

/* Hover Effect */
.swiper-button-next:hover,
.swiper-button-prev:hover {
  background: rgba(0, 0, 0, 0.8);
}

/* Remove default arrow icons and use custom */
.swiper-button-next::after,
.swiper-button-prev::after {
  font-size: 12px;
}