/**
 * Varlık carousel'leri (.explore-slider) — Embla layout'u.
 *
 * Slick, DOM'u kendi sarmalayıp slide genişliklerini inline style ile
 * yazıyordu. Embla bunu yapmaz: viewport overflow'u ve slide genişlikleri
 * CSS'e ait. Slide sayıları eski Slick responsive bloğuyla aynı tutuldu
 * (>1200: data-slide kadar, <=1200: 3, <=767: tek slide).
 *
 * embla-explore.js `.explore-slider`'a `.embla-container` ekler ve üstüne
 * `.embla-viewport` sarar.
 */

.embla-viewport {
    overflow: hidden;
    width: 100%;
}

/* .row varsayılan flex-wrap: wrap — Embla tek sırada akış ister */
.row.explore-slider.embla-container {
    flex-wrap: nowrap;
    backface-visibility: hidden;
    touch-action: pan-y pinch-zoom;
}

/* Bootstrap col genişliklerini Embla slide genişliğiyle değiştir.
   --embla-slides, markup'taki data-slide değerinden JS ile gelir. */
.row.explore-slider.embla-container > [class*="col-"] {
    flex: 0 0 calc(100% / var(--embla-slides, 6));
    max-width: none;
    min-width: 0;
}

@media (max-width: 1200px) {
    .row.explore-slider.embla-container > [class*="col-"] {
        flex-basis: 33.3333%;
    }
}

@media (max-width: 767px) {
    .row.explore-slider.embla-container > [class*="col-"] {
        flex-basis: 85%;
    }
}

/* Kartlar arası boşluk — eskiden col padding (12+12) üstüne kartın kendi
   `margin: 0 25px 20px 5px` kuralı biniyor, aralar ~54px açılıyordu.
   Boşluk 16px'e çekilip artan yer kartlara verildi. */
.row.explore-slider.embla-container {
    margin-left: -8px;
    margin-right: -8px;
}

.row.explore-slider.embla-container > [class*="col-"] {
    padding-left: 8px;
    padding-right: 8px;
}

.row.explore-slider.embla-container .realestate-item.loop-style1 {
    margin-left: 0;
    margin-right: 0;
}

/* Boş durum (tek .col-12) carousel değil — tam genişlik kalsın */
.row.explore-slider.embla-container > .col-12 {
    flex-basis: 100%;
}

/* Sürükleme sırasında kart linkleri seçilmesin/sürüklenmesin */
.row.explore-slider.embla-container a {
    -webkit-user-drag: none;
}
