/* ================================================================
   Online Ahmedabad — listing.css
   Add this to your existing stylesheet
   ================================================================ */

/* Verified badge — sits on top of card, top right */
.card-verified {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 24px;
  height: 24px;
  background: #111111;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 99999;
  box-shadow: 0 2px 6px rgba(0,0,0,0.35);
  pointer-events: none;
}

/* Location line below business name */
.card-location {
  font-size: 12px;
  opacity: 0.65;
  margin-top: 3px;
  font-weight: 400;
}

/* No listings message */
.no-listings {
  text-align: center;
  opacity: 0.4;
  padding: 48px 0;
  font-size: 14px;
}

/* Ensure listing card media doesn't inherit generic `.card-img` rules from other sections */
.work-card .card-visual {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.work-card .card-img {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  z-index: 0;
}

.work-card .card-img img,
.work-card .card-img video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Keep the verified badge above the media layers */
.work-card .card-verified {
  z-index: 5;
}

.work-card .work-card-info {
  z-index: 2;
}

.work-card .card-arrow {
  z-index: 4;
}
