/* Explain: Styles for ad spaces and overrides for hero section Swiper. - */
/* Ad Spaces */
.ad-space {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--surface-color);
    border: 1px dashed var(--border-color);
    color: var(--text-muted);
    font-size: 0.875rem;
    text-align: center;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.ad-space::before {
    content: 'مساحة إعلانية';
    position: absolute;
    top: 0;
    right: 0;
    font-size: 0.65rem;
    background: var(--border-color);
    color: var(--text-muted);
    padding: 2px 6px;
    border-bottom-left-radius: 4px;
    z-index: 10;
}

/* Swiper Overrides for News Hero */
.hero-swiper {
    --swiper-navigation-color: #ffffff;
    --swiper-pagination-color: var(--accent-color);
    --swiper-navigation-size: 1.5rem;
}
.hero-swiper .swiper-button-next,
.hero-swiper .swiper-button-prev {
    background: rgba(0,0,0,0.5);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    backdrop-filter: blur(4px);
}
.hero-swiper .swiper-button-next::after,
.hero-swiper .swiper-button-prev::after {
    font-size: 1.2rem;
}
.hero-swiper .swiper-pagination-bullet {
    background: #ffffff;
    opacity: 0.5;
}
.hero-swiper .swiper-pagination-bullet-active {
    opacity: 1;
    background: var(--accent-color);
}