.slider-wrapper {
    position: relative;
    width: 100%;
    height: 664px;
    overflow: hidden;
    border-radius: 12px;
}

/* skeleton overlay */
.slider-skeleton {
    position: absolute;
    inset: 0;
    z-index: 50;
    border-radius: 12px;
    overflow: hidden;
    transition: opacity 0.4s ease;
}

/* slider */
#carouselExampleDark {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* shimmer */
.skeleton-shimmer {
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #e8e8e8 25%, #f5f5f5 50%, #e8e8e8 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* 🔥 slider sabit durur */
#carouselExampleDark {
    position: absolute;
    inset: 0;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease;
}

/* image */
.carousel-item img {
    height: 664px;
    object-fit: cover;
}

/* --- INDICATOR (ÇİZGİ) --- */
.carousel-indicators [data-bs-target] {
    width: 60px !important;
    height: 5px !important;
    border-radius: 10px !important;
    background-color: #cccccc !important;
    opacity: 1 !important;
    border: none !important;
}

.carousel-indicators .active {
    background-color: #4166D0 !important;
}

/* --- OK BUTONLARI --- */
.carousel-control-prev,
.carousel-control-next {
    width: 52px !important;
    height: 52px !important;
    background-color: #4166D0 !important;
    border-radius: 50% !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    transition: background 0.2s, transform 0.15s !important;
    opacity: 1 !important;
}

.carousel-control-prev { left: 28px !important; }
.carousel-control-next { right: 28px !important; }

.carousel-control-prev:hover,
.carousel-control-next:hover {
    background-color: #3055C0 !important;
    transform: translateY(-50%) scale(1.07) !important;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
    filter: brightness(0) invert(1) !important;
    background-size: 45% !important;
}