/* =========================================================
   PROPERTY CARD – PREMIUM REAL ESTATE UI
========================================================= */

/* CARD */
.property-card{
  background: var(--bg-card);
  box-shadow: 0 12px 28px rgba(var(--brand-dark-rgb), 0.08);
  border-radius:18px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  position:relative;
  transition:.35s ease;
}
.property-card:hover{
  transform:translateY(-6px);
  box-shadow: 0 28px 60px rgba(var(--brand-dark-rgb), 0.18); /* Dynamic shadow */
}

/* IMAGE */
.pc-image{
  position:relative;
  aspect-ratio:1/1;
 background: var(--bg-light);
  display:flex;
  align-items:center;
  justify-content:center;
}
.pc-image img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  transition:.6s ease;
}
.property-card:hover .pc-image img{
  transform:scale(1.06);
}

/* ACTION ICONS */
.pc-actions{
  position:absolute;
  top:14px;
  right:14px;
  display:flex;
  gap:10px;
}
.pc-action-btn{
  width:38px;
  height:38px;
  background: var(--brand); /* Replaced #000 */
  border: 1px solid var(--accent); /* Replaced static gold */
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.pc-action-btn i{
 color: var(--accent); /* Replaced static gold */
}

/* BODY */
.pc-body{
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

/* TEXT */
.pc-title{font-size:16px;font-weight:800;color: var(--text);}
.pc-location{font-size:13px;color: var(--text-muted); /* Replaces #666 and #777 */}

/* STATUS */
.pc-status{
  align-self:flex-start;
  padding:5px 12px;
  font-size:10px;
  border-radius:999px;
  font-weight:700;
}
.pc-status-sale { background: rgba(var(--success-rgb), 0.1); color: var(--success); }
.pc-status-rent { background: rgba(var(--info-rgb), 0.1); color: var(--info); }
.pc-status-sold { background: rgba(var(--danger-rgb), 0.1); color: var(--danger); }

/* PRICE */
.pc-price-main{
  font-size:17px;
  font-weight:800;
  color: var(--text);
}

/* META */
.pc-meta-row{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
  margin-top:10px;
}
.pc-meta-label{font-size:11px;color: var(--text-muted); /* Replaces #666 and #777 */}
.pc-meta-value{font-weight:700}

/* CTA */
.pc-cta-btn{
  margin-top:auto;
  padding:11px;
 background: var(--brand); /* Replaces #000 */
  color: var(--bg);
  text-align:center;
  font-size:11px;
  letter-spacing:.15em;
  border-radius:8px;
}
.pc-cta-btn:hover{
  background: var(--accent);
  color: var(--brand-dark);
}

/* GRID */
.properties-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:26px;
}

/* FILTER BAR */
.property-filters{
  display:flex;
  gap:14px;
  margin-bottom:24px;
}
.property-filters select{
  padding:10px 14px;
  border-radius:8px;
  border: 1px solid var(--border); /* Replaced #ddd */
  background: var(--card);
  color: var(--text);
}

/* DESKTOP HOVER OVERLAY */
@media(min-width:769px){
  .property-card:hover .pc-image::after{
    content:'';
    position:absolute;
    inset:0;
    background: rgba(var(--brand-dark-rgb), 0.35); /* Dynamic rgba */
  }
}

/* MOBILE */
@media(max-width:768px){
  .property-filters{
    flex-direction:column;
  }
}


/* =========================================================
   INDEX PAGE – LATEST PROPERTIES SLIDER
========================================================= */

.section-properties--index{
  padding-top:60px;
}

/* SLIDER */
.property-slider{
  display:flex;
  gap:22px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  padding-bottom:8px;
}

.property-slider::-webkit-scrollbar{
  display:none;
}

/* CARD WIDTH */
.property-card--index{
  min-width:280px;
  scroll-snap-align:start;
  
}

/* IMAGE */
.property-card--index .pc-image{
  aspect-ratio:1 / 1;
  background: var(--bg-light); /* Replaced static #f4f4f4 */
  position:relative;
}

/* IMAGE FIT */
.property-card--index .pc-image img{
  width:100%;
  height:100%;
  object-fit:contain;
}

/* STATUS BADGE */
.property-card--index .pc-status{
  position:absolute;
  top:14px;
  left:14px;
  font-size:10px;
  letter-spacing:.14em;
  padding:5px 12px;
  border-radius:999px;
  background: var(--success); /* Replaced static #22c55e */
  color: var(--brand-dark); /* Replaced static #000 */
  font-weight:700;
}

/* BODY */
.property-card--index .pc-body{
  padding:16px;
  background: var(--card); /* Replaced #fff */
}

/* TITLE */
.property-card--index .pc-title{
  font-size:15px;
  font-weight:800;
  margin-bottom:4px;
}

/* LOCATION */
.property-card--index .pc-location{
  font-size:13px;
  color:#666;
}

/* PRI*

/* ===============================
   PROPERTY SHARE DROPDOWN
================================ */

.pc-actions{
  position:absolute;
  top:12px;
  right:12px;
}

.pc-action-btn{
  width:38px;
  height:38px;
  border-radius:50%;
  border:none;
  background: var(--brand); /* Replaces #000 */
  border: 1px solid var(--accent);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}

.pc-action-btn:hover{
  background: var(--accent);
  color: var(--brand-dark);
}

/* Dropdown */
.pc-share-menu{
  position:absolute;
  top:44px;
  right:0;
  background: var(--card); /* Replaced #fff */
  border-radius:12px;
  box-shadow: 0 12px 30px rgba(var(--brand-dark-rgb), 0.15);
  border: 1px solid var(--border);
  padding:6px;
  display:none;
  min-width:150px;
  z-index:5;
}

.pc-actions.open .pc-share-menu{
  display:block;
}

.pc-share-item{
  width:100%;
  background:none;
  border:none;
  padding:8px 10px;
  font-size:.85rem;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  border-radius:8px;
  color: var(--text); /* Replaced black */
}

.pc-share-item:hover{
  background: var(--bg-light); /* Replaced static gray */
}

.pc-share-item i{
  font-size:1rem;
}