/* ================================================
   Property Skeleton Loading System — Happy Realestate
   ================================================
   ใช้กับ: /search (grid ผลลัพธ์)
   trigger: เมื่อ filter/sort form ถูก submit
   ================================================ */

@keyframes sk-shimmer {
    0%   { background-position: -400px 0; }
    100% { background-position:  400px 0; }
}

/* Base shimmer box */
.sk-box {
    display: block;
    background: linear-gradient(90deg, #ececec 0%, #e0e0e0 40%, #ececec 80%);
    background-size: 800px 100%;
    animation: sk-shimmer 1.4s ease-in-out infinite;
    border-radius: 6px;
}

/* ── Skeleton card — mirrors .property-card-modern exactly ── */
.sk-card {
    border-radius: 16px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 0 0 1px rgba(0,0,0,.07), 0 2px 12px rgba(0,0,0,.09);
    height: 100%;
}

/* Image placeholder: same 4:3 ratio as property image */
.sk-card__img  { aspect-ratio: 4/3; width: 100%; border-radius: 0; }

.sk-card__body { padding: .75rem; }

/* Price line: mirrors ฿15,000 font-size ~1.05rem */
.sk-card__price  { height: 1.3rem;  width: 55%; margin-bottom: .5rem;  }

/* Title: 2-line clamp at 0.875rem */
.sk-card__line1  { height: .85rem;  width: 90%; margin-bottom: .35rem; }
.sk-card__line2  { height: .85rem;  width: 70%; margin-bottom: .35rem; }

/* Property code: 0.68rem */
.sk-card__code   { height: .6rem;   width: 40%; margin-bottom: .5rem;  }

/* Location: 0.8rem */
.sk-card__loc    { height: .75rem;  width: 60%; margin-bottom: .5rem;  }

/* Feature row: bedrooms/bathrooms/area */
.sk-card__feat   { height: .65rem;  width: 50%; margin-top:   .5rem;   }

/* ── Section wrapper — hidden until .sk-show is added by JS ── */
.sk-section {
    display: none;
}
.sk-section.sk-show {
    display: block;
}

@media (prefers-reduced-motion: no-preference) {
    .sk-section.sk-show {
        animation: sk-fadein .12s ease;
    }
    @keyframes sk-fadein {
        from { opacity: 0; }
        to   { opacity: 1; }
    }
}
