/* ==========================================================================
   🎡 CATEGORY SLIDER — KirpiBaby Navigation Menu (FINAL VERSION)
   Color Pills + Active Highlight + Category Background
   ========================================================================== */

/* CONTAINER (auto-inherits category background color) */
.category-slider-container {
    padding: 18px 0;
    margin: 20px auto 30px;
    max-width: 1300px;
    background: var(--accent-bg);
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.05);
}

/* SLIDER WRAPPER */
.category-slider .swiper-slide {
    width: auto;
}

/* BASE STYLE */
.category-slider a {
    display: inline-block;
    padding: 8px 18px;
    font-size: 15px;
    border-radius: 20px;
    text-decoration: none;
    white-space: nowrap;
    border: 2px solid transparent;
    font-weight: 500;
    transition: 0.25s ease;
}

/* ==========================================================================
   🎨 CATEGORY COLORS – PILLS (10 MAIN CATEGORIES)
   ========================================================================== */

/* Masallar */
.category-slider a.cat-masallar {
    background: #FAE9FA;
    color: #B04BAF;
    border-color: #C36CC3;
}
.category-slider a.cat-masallar:hover {
    background: #C36CC3;
    color: #fff;
}

/* Bilgi */
.category-slider a.cat-bilgi {
    background: #E9F9FB;
    color: #258B94;
    border-color: #3FA4AD;
}
.category-slider a.cat-bilgi:hover {
    background: #3FA4AD;
    color: #fff;
}

/* Psikoloji */
.category-slider a.cat-psikoloji {
    background: #F1FAE9;
    color: #4E9E33;
    border-color: #74B85A;
}
.category-slider a.cat-psikoloji:hover {
    background: #74B85A;
    color: #fff;
}

/* Takvim */
.category-slider a.cat-takvim {
    background: #FFF3E5;
    color: #E97A22;
    border-color: #F59548;
}
.category-slider a.cat-takvim:hover {
    background: #F59548;
    color: #fff;
}

/* Aile */
.category-slider a.cat-aile {
    background: #F0EFFF;
    color: #5654C9;
    border-color: #7775D8;
}
.category-slider a.cat-aile:hover {
    background: #7775D8;
    color: #fff;
}

/* Sağlık */
.category-slider a.cat-saglik {
    background: #E7F7F5;
    color: #35998E;
    border-color: #56B1A6;
}
.category-slider a.cat-saglik:hover {
    background: #56B1A6;
    color: #fff;
}

/* Oyunlar */
.category-slider a.cat-oyunlar {
    background: #FFFBEA;
    color: #E4B200;
    border-color: #F4CA2E;
}
.category-slider a.cat-oyunlar:hover {
    background: #F4CA2E;
    color: #fff;
}

/* Ürünler */
.category-slider a.cat-urunler {
    background: #FCECEC;
    color: #C05050;
    border-color: #D46E6E;
}
.category-slider a.cat-urunler:hover {
    background: #D46E6E;
    color: #fff;
}

/* Medya */
.category-slider a.cat-medya {
    background: #E8F4FD;
    color: #176BC4;
    border-color: #3F8BD9;
}
.category-slider a.cat-medya:hover {
    background: #3F8BD9;
    color: #fff;
}

/* Nuk */
.category-slider a.cat-nuk {
    background: #E6F5FB;
    color: #3C92C3;
    border-color: #5AAFD8;
}
.category-slider a.cat-nuk:hover {
    background: #5AAFD8;
    color: #fff;
}

/* ==========================================================================
   ⭐ ACTIVE CATEGORY (auto-detected via JS)
   ========================================================================== */
.category-slider a.active {
    box-shadow: 0 0 0 3px rgba(0,0,0,0.06) inset;
    font-weight: 600;
    opacity: 1 !important;
}