/* Smart Image System CSS */
/* Akıllı resim servisi ile birlikte kullanılır */

/* Ana sayfa featured properties resimlerini düzelt */
.listing-card-four {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Background image olan kartlar için */
.listing-card-four[style*="background-image"] {
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

/* Tüm property resimlerini düzelt */
.property-image, 
.listing-card img, 
.property-card img,
.carousel-item img,
.thumbnail img {
    object-fit: cover;
    object-position: center;
}

/* Portföy sayfası için */
.listing-card .img-gallery img {
    object-fit: cover;
    object-position: center;
}

/* Property details carousel için */
.carousel-inner .carousel-item img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 400px;
}

/* Thumbnail'lar için */
.carousel-indicators img {
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 80px;
}

/* Genel resim düzeltmesi */
img.property-photo {
    object-fit: cover;
    object-position: center;
}

/* Smart image için özel classlar */
.smart-image {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}

.smart-image-portrait {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}

.smart-image-landscape {
    max-width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
}

/* Mobile responsive için */
@media (max-width: 768px) {
    .listing-card-four {
        min-height: 250px !important;
    }
    
    .carousel-inner .carousel-item img {
        height: 300px;
    }
}

/* Resim yükleme animasyonu */
.smart-image-loading {
    background: linear-gradient(90deg, #f0f0f0 25%, transparent 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}