/* --- CSS CAROUSEL AYARLARI --- */

.carousel-container {
    overflow: hidden;
    position: relative;
}

.carousel-track {
    display: flex;
    width: 200%;
    transition: transform 0.5s ease-in-out;
    /* OTOMATİK DÖNÜŞ: Artık hiçbir statik !important kural bunu ezmeyecek */
    animation: slider 10s infinite;
}

.carousel-slide {
    width: 50%;
    flex-shrink: 0;
}

/* KEYFRAMES (Otomatik Geçiş Matematiği) */
@keyframes slider {
    0% {
        transform: translateX(0%);
    }

    45% {
        transform: translateX(0%);
    }

    50% {
        transform: translateX(-50%);
    }

    95% {
        transform: translateX(-50%);
    }

    100% {
        transform: translateX(0%);
    }
}

/* --- ÇAKIŞMA ÇÖZÜMÜ: MANUEL KONTROL SADECE HOVER ESNASINDA DEVREDE --- */

/* Kural 1: Üzerine gelince animasyonu durdur (Tıklama için zorunlu) */
.carousel-container:hover .carousel-track {
    animation-play-state: paused !important;
}

/* Kural 2: Manuel Konumlandırma (Hover Kuralı ile BİRLEŞTİRİLDİ) */
/* Sadece mouse üzerindeyken ve ilgili radyo butonu seçiliyken, pozisyonu ayarla.
       Bu sayede otomatik dönen animasyonu ezmez. */
.carousel-container:hover #slide-1:checked ~ .carousel-inner-wrapper .carousel-track {
    transform: translateX(0%) !important;
}

.carousel-container:hover #slide-2:checked ~ .carousel-inner-wrapper .carousel-track {
    transform: translateX(-50%) !important;
}


/* --- BUTON STİL VE KONUMU (Görünürlük garantilenir) --- */

.carousel-activator {
    display: none;
}

.control-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 45px;
    height: 45px;
    background-color: #343a40;
    color: white;
    text-align: center;
    line-height: 45px;
    font-size: 1.5rem;
    cursor: pointer;
    z-index: 10;
    user-select: none;
    transition: background-color 0.2s;
    display: none;
    pointer-events: auto;
}

.prev-btn {
    left: 20px;
}

.next-btn {
    right: 20px;
}

.manual-control-wrapper {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}

/* --- BUTON GÖRÜNÜRLÜĞÜ --- */

/* Görünürlüğü garanti altına alıyoruz */
#slide-1:checked ~ .manual-control-wrapper .next-for-2,
#slide-1:checked ~ .manual-control-wrapper .prev-for-2,
#slide-2:checked ~ .manual-control-wrapper .next-for-1,
#slide-2:checked ~ .manual-control-wrapper .prev-for-1 {
    display: block !important;
}