/*
 * Bileşen: Kart Slider
 * Amaç: Swiper.js tabanlı kart slider'larının stilini yönetir.
 */

.bf-dynamic-slider.swiper {
    visibility: hidden; opacity: 0; transition: opacity 0.3s ease;
    position: relative;
    margin-left: auto; margin-right: auto;
    padding-bottom: 60px;
    width: 100%;
    overflow: hidden; 
    z-index: 1;
}

.bf-dynamic-slider.swiper.swiper-initialized-custom { visibility: visible; opacity: 1; }

.bf-dynamic-slider .swiper-slide {
    height: auto;
    display: flex;
    flex-shrink: 0;
    position: relative;
}
.bf-dynamic-slider .swiper-slide > * { width: 100%; }

.bf-slider-nav {
    position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%);
    width: 100%; max-width: 200px; height: 40px;
    display: flex; align-items: center; justify-content: space-between;
    z-index: 10;
}

.bf-dynamic-slider .swiper-button-next,
.bf-dynamic-slider .swiper-button-prev {
    position: static; transform: none; width: 36px; height: 36px; margin: 0;
    cursor: pointer; display: flex; align-items: center; justify-content: center;
    color: var(--color-text-muted); background-color: var(--color-background-soft);
    border-radius: 50%; border: 1px solid var(--color-border-light);
    transition: all 0.2s ease;
}
.bf-dynamic-slider .swiper-button-next:hover,
.bf-dynamic-slider .swiper-button-prev:hover { color: var(--color-background); background-color: var(--color-primary); border-color: var(--color-primary); }

.bf-dynamic-slider .swiper-button-next::after,
.bf-dynamic-slider .swiper-button-prev::after { font-family: 'Material Symbols Rounded'; font-size: 20px; font-weight: bold; color: inherit; }
.bf-dynamic-slider .swiper-button-prev::after { content: 'chevron_left'; }
.bf-dynamic-slider .swiper-button-next::after { content: 'chevron_right'; }

.bf-dynamic-slider .swiper-pagination {
    position: static; transform: none; width: auto; flex-grow: 1;
    display: flex; justify-content: center; align-items: center;
    overflow: hidden; white-space: nowrap;
}
.bf-dynamic-slider .swiper-pagination-bullet { background: var(--color-border-medium); opacity: 1; width: 6px; height: 6px; transition: all 0.2s ease; }
.bf-dynamic-slider .swiper-pagination-bullet-active { background: var(--color-primary); transform: scale(1.5); }

@media (max-width: 767px) {
    .bf-slider-nav { max-width: 160px; }
    .bf-dynamic-slider .swiper-button-next, .bf-dynamic-slider .swiper-button-prev { width: 32px; height: 32px; }
}