/* =========================================================
   AVAILABLE NOW CAROUSEL — OPTIMIZED STYLESHEET
   ========================================================= */

/* ===== 1. WRAPPER / OWL CAROUSEL CONTAINER ===== */
.availableNowCarousel {
  display: block;
  overflow: visible;
  width: 100%;
  opacity: 0;                   /* Hide until initialized */
  transition: opacity 0.25s ease-in;
}
.availableNowCarousel.owl-loaded {
  opacity: 1;                   /* Show when Owl ready */
}
.availableNowCarousel .owl-stage-outer {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ===== 2. CARD LINK ===== */
.availableNowCarousel .escort-card-link {
  text-decoration: none;
  color: inherit;
  display: block;
  height: 100%;
}

/* ===== 3. CARD CONTAINER ===== */
.availableNowCarousel .escort-card {
  position: relative;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 22px rgba(0,0,0,0.14);
  display: flex;
  flex-direction: column;
  height: 380px;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.availableNowCarousel .escort-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 18px rgba(0,0,0,0.25);
}

/* ===== 4. CARD VARIANTS ===== */
.availableNowCarousel .escort-card.active-now {
  border: 1px solid #22adaf;
  box-shadow: 0 4px 15px rgba(34,173,175,0.2);
}
.availableNowCarousel .escort-card.normal {
  border: 1px solid #e2e2e2;
}

/* ===== 5. PHOTO SECTION ===== */
.availableNowCarousel .escort-photo {
  position: relative;
  flex: 0 0 270px;
  height: 270px;
  overflow: hidden;
}
.availableNowCarousel .escort-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.availableNowCarousel .escort-card:hover .escort-img {
  transform: scale(1.05);
}

/* ===== 6. AVAILABLE NOW BAR ===== */
.availableNowCarousel .label-available-now {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  background-color: #22adaf;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  font-family: "Open Sans", sans-serif;
  text-align: center;
  text-transform: capitalize;
  padding: 6px 0;
  z-index: 10;
  border-bottom: 1px solid rgba(0,0,0,0.1);
  box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
.availableNowCarousel .label-available-now i {
  font-size: 13px;
  margin-right: 3px;
  vertical-align: middle;
}
.availableNowCarousel .label-available-now span {
  opacity: 0.9;
  margin-left: 4px;
  font-weight: 500;
  text-transform: none;
}

/* ===== 7. FEATURED TAG ===== */
.availableNowCarousel .escort-featured {
  position: absolute;
  bottom: 0;
  right: 0;
  background: linear-gradient(90deg, #6b00b2, #22adaf);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 700;
  padding: 4px 8px;
  border-top-left-radius: 6px;
  text-transform: uppercase;
  z-index: 5;
}

/* ===== 8. INFO SECTION ===== */
.availableNowCarousel .escort-info {
  flex: 1;
  padding: 8px 10px 12px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  text-align: left;
}
.availableNowCarousel .escort-name {
  font-weight: 700;
  color: #222;
  font-size: 0.95rem;
  margin-bottom: 2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.availableNowCarousel .escort-meta {
  color: #555;
  font-size: 0.78rem;
  margin-bottom: 2px;
}
.availableNowCarousel .escort-cat {
  color: #6b00b2;
  font-weight: 600;
  font-size: 0.8rem;
}
.availableNowCarousel .escort-rate {
  color: #22adaf;
  font-weight: 700;
  font-size: 0.82rem;
  margin-top: 3px;
}

/* ===== 9. OWL DOTS ===== */
.availableNowCarousel .owl-dots {
  text-align: center;
  margin-top: 10px;
}
.availableNowCarousel .owl-dot span {
  width: 7px;
  height: 7px;
  background: #ccc;
  border-radius: 50%;
  display: inline-block;
  margin: 0 3px;
}
.availableNowCarousel .owl-dot.active span {
  background: #474949;
}

/* ===== 10. RESPONSIVE ===== */
@media (max-width: 1024px) {
  .availableNowCarousel .escort-card { height: 350px; }
  .availableNowCarousel .escort-photo { height: 250px; flex: 0 0 250px; }
}
@media (max-width: 768px) {
  .availableNowCarousel .escort-card { height: 332px; }
  .availableNowCarousel .escort-photo { height: 230px; flex: 0 0 230px; }

  .availableNowCarousel .escort-info { padding: 6px 8px 8px; }
  .availableNowCarousel .escort-name { margin-bottom: 1px; }
  .availableNowCarousel .escort-meta { margin-bottom: 1px; }

  .availableNowCarousel .label-available-now { font-size: 10px; padding: 4px 0; }
  .availableNowCarousel .label-available-now i { font-size: 11px; margin-right: 3px; }

  .availableNowCarousel .owl-dots { margin-top: 4px; }
}
@media (max-width: 480px) {
  .availableNowCarousel { width: calc(100% + 32px); margin-left: -16px; margin-right: -16px; }
  .availableNowCarousel.mb-3 { margin-bottom: 0.5rem !important; }

  .availableNowCarousel .escort-card { height: 292px; }
  .availableNowCarousel .escort-photo { height: 198px; flex: 0 0 198px; }
  .availableNowCarousel .escort-info { padding: 5px 7px 7px; }

  .availableNowCarousel .escort-name { font-size: 0.9rem; margin-bottom: 0; }
  .availableNowCarousel .escort-meta { font-size: 0.72rem; margin-bottom: 0; }
  .availableNowCarousel .escort-cat { font-size: 0.75rem; }
  .availableNowCarousel .escort-rate { font-size: 0.78rem; margin-top: 1px; }

  .availableNowCarousel .label-available-now { font-size: 10px; padding: 4px 0; }
  .availableNowCarousel .label-available-now i { font-size: 11px; }
  .availableNowCarousel .label-available-now span { font-size: 0.92em; }

  .availableNowCarousel .escort-featured { font-size: 0.58rem; padding: 3px 6px; border-top-left-radius: 5px; }

  .availableNowCarousel .owl-dots { margin-top: 2px; }
  .availableNowCarousel .owl-dot span { width: 6px; height: 6px; margin: 0 2px; }
}
