/* Explain: Styles for the artists carousel, including arrows and pagination. */
/* ---------- قسم الفنانين — كاروسيل بأسهم يمين/يسار ونقاط أسفله ---------- */
.artists-carousel {
    position: relative;
    margin-top: 0.75rem;
}

/* مساحة داخلية حتى لا تغطي الأسهم بطاقات الفنانين */
.artists-carousel .artists-swiper {
    padding-inline: 1.6rem;
}

@media (min-width: 768px) {
    .artists-carousel .artists-swiper {
        padding-inline: 3.4rem;
    }
}

.carousel-arrow {
    position: absolute;
    top: 50%;
    z-index: 5;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    border: 1px solid var(--border-color);
    background: rgba(16, 26, 46, 0.94);
    color: var(--text-color);
    font-size: 1rem;
    cursor: pointer;
    transform: translateY(-50%);
    box-shadow: var(--shadow-card);
    transition: color 0.25s ease, border-color 0.25s ease, background 0.25s ease, opacity 0.25s ease;
}

.carousel-arrow:hover {
    color: var(--primary-color);
    border-color: var(--primary-color);
    background: rgba(212, 175, 55, 0.12);
}

.carousel-arrow:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.35);
}

.carousel-arrow.swiper-button-disabled {
    opacity: 0.4;
    cursor: default;
}

/* تخطيط منطقي: البداية = اليمين في RTL */
.artists-swiper-prev { inset-inline-start: 0.2rem; }
.artists-swiper-next { inset-inline-end: 0.2rem; }

@media (max-width: 767px) {
    .carousel-arrow {
        width: 38px;
        height: 38px;
        font-size: 0.88rem;
    }
    .artists-swiper-prev { inset-inline-start: 0; }
    .artists-swiper-next { inset-inline-end: 0; }
}

/* النقاط أسفل الكاروسيل */
.artists-swiper-pagination {
    position: static;
    width: auto;
    margin-top: 0.75rem;
    text-align: center;
    --swiper-pagination-bullet-size: 10px;
    --swiper-pagination-bullet-horizontal-gap: 5px;
    --swiper-pagination-bullet-inactive-color: var(--border-color);
    --swiper-pagination-bullet-inactive-opacity: 1;
    --swiper-pagination-color: var(--primary-color);
}

.artists-swiper-pagination.swiper-pagination-bullets-dynamic {
    overflow: visible;
}