:root {
    --amartil-review-accent: #ff7800;
    --amartil-review-accent-dark: #e85d04;
    --amartil-review-text: #1f2a37;
    --amartil-review-muted: #6b7280;
    --amartil-review-border: #ececec;
    --amartil-review-bg: #ffffff;
}

/* عمود السلايدر */
.mp-reviews-carousel-col {
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.mp-reviews-carousel-wrap {
    position: relative;
    overflow: visible;
    padding: 0 0 1rem;
}

.mp-reviews-carousel-wrap.is-single {
    max-width: 420px;
    margin: 0 auto;
}

/* Swiper — نفس أسلوب CodePen (Owl center + scale) */
.mp-reviews-swiper {
    overflow: hidden;
    padding: 0 0 3rem;
    position: relative;
}

.mp-reviews-swiper .swiper-wrapper {
    align-items: center;
}

/* الشرائح غير النشطة: باهتة ومصغّرة — مثل .owl-item .item */
.mp-reviews-swiper .swiper-slide {
    height: auto;
    display: flex;
    justify-content: center;
    align-items: stretch;
    box-sizing: border-box;
    text-align: center;
    padding: 50px 20px;
   
    opacity: 0.2;
    transform: scale3d(0.8, 0.8, 1);
    transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

/* الشريحة المركزية النشطة — مثل .owl-item.active.center .item */
.mp-reviews-swiper .swiper-slide-active {
    opacity: 1;
    transform: scale3d(1, 1, 1);
}

.mp-review-slide {
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
    text-align: center;
    box-sizing: border-box;
}

/* قبل تهيئة Swiper */
.mp-reviews-swiper:not(.swiper-initialized) .swiper-wrapper {
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
}

.mp-reviews-swiper:not(.swiper-initialized) .swiper-slide {
    flex: 0 0 min(360px, 88vw);
}

.mp-reviews-swiper:not(.swiper-initialized) .swiper-slide:first-child {
    opacity: 1;
    transform: scale3d(1, 1, 1);
}

.testimonials,
.mp-reviews {
    padding: 1.25rem 0 1.5rem;
    background: transparent;
}

.mp-reviews-title {
    font-weight: 100;
    color: var(--amartil-review-text);
    margin: 0 0 1rem;
    font-size: 3rem;
    text-align: center !important;
}

.shadow-effect {
   
    padding: 20px;
    border-radius: 4px;
    text-align: center;
    
    box-sizing: border-box;
}

.amartil-reviews-carousel .shadow-effect p,
#customers-testimonials .shadow-effect p {
    font-family: inherit;
    font-size: 17px;
    line-height: 1.5;
    margin: 0 0 17px;
    font-weight: 300;
    color: var(--amartil-review-text);
}

.testimonial-name {
    margin: -17px auto 0;
    display: table;
    width: auto;
    padding: 9px 24px;
    border-radius: 12px;
    text-align: center;
    font-weight: 600;
    font-size: 1.5rem;
    box-shadow:  0 9px 18px rgb(0 0 0 / 9%), -2px 0px 20px rgb(0 0 0 / 6%);
}

.amartil-reviews-carousel .mp-review-slide,
#customers-testimonials .mp-review-slide {
    text-align: center;
}

.amartil-reviews-carousel img.img-circle,
#customers-testimonials img.img-circle {
    display: block !important;
    transform-style: preserve-3d;
    max-width:170px;
    width: 170px !important;
    height: 170px !important;
    object-fit: cover;
    margin: 0 auto 17px;
    border-radius: 50%;
    border: none;
    box-shadow: none;
}

.amartil-reviews-carousel.is-single .swiper-slide,
#customers-testimonials.is-single .swiper-slide {
    opacity: 1;
    transform: none;
    padding: 20px 12px;
    margin-bottom: 0;
}

.amartil-reviews-carousel.is-single .shadow-effect,
#customers-testimonials.is-single .shadow-effect {
    width: 100%;
    max-width: 100%;
    margin: 0 auto;
}

/* نقاط التنقل — مثل CodePen */
.mp-reviews-pagination {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 3;
    display: inline-block;
    width: 100%;
    text-align: center;
}

.mp-reviews-pagination .swiper-pagination-bullet {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin: 0 2px 5px;
    background: var(--amartil-review-accent);
    opacity: 1;
    border-radius: 50%;
    transform: translate3d(0, -50%, 0) scale(0.3);
    transform-origin: 50% 50% 0;
    transition: all 250ms ease-out;
}

.mp-reviews-pagination .swiper-pagination-bullet-active,
.mp-reviews-pagination .swiper-pagination-bullet:hover {
    transform: translate3d(0, -50%, 0) scale(0.7);
}

/* صفحة الإدارة / standalone */
.reviews-page {
    font-family: 'Tajawal', 'Poppins', sans-serif;
    background: #f6f7f9;
    color: var(--amartil-review-text);
    min-height: 100vh;
    --amartil-review-fog: rgba(246, 247, 249, 0.92);
}

.reviews-page__header {
    background: #fff;
    border-bottom: 1px solid var(--amartil-review-border);
    padding: 14px 0;
}

.reviews-page__brand img {
    height: 42px;
    width: auto;
}

.reviews-page__main {
    padding: 2rem 0 3rem;
}

.reviews-page .btn-amartil,
.reviews-admin .btn-amartil {
    background: var(--amartil-review-accent);
    border-color: var(--amartil-review-accent);
    color: #fff;
    font-weight: 700;
    border-radius: 999px;
    padding: 10px 22px;
}

.reviews-page .btn-amartil:hover,
.reviews-admin .btn-amartil:hover {
    background: var(--amartil-review-accent-dark);
    border-color: var(--amartil-review-accent-dark);
    color: #fff;
}

.reviews-page .btn-outline-amartil,
.reviews-admin .btn-outline-amartil {
    background: #fff;
    border: 1px solid var(--amartil-review-accent);
    color: var(--amartil-review-accent);
    font-weight: 700;
    border-radius: 999px;
    padding: 10px 22px;
}

.reviews-page .btn-outline-amartil:hover,
.reviews-admin .btn-outline-amartil:hover {
    background: rgba(255, 120, 0, 0.08);
    color: var(--amartil-review-accent-dark);
}

@media (max-width: 767px) {
    .mp-reviews-title {
        font-size: 2.2rem;
    }

    .mp-reviews {
        padding: 0.75rem 0 1rem;
    }

    .mp-reviews-carousel-col {
        padding: 0 0.65rem;
        box-sizing: border-box;
    }

    .mp-reviews-swiper .swiper-slide {
        padding: 30px 12px;
        margin-bottom: 10px;
    }

    .amartil-reviews-carousel .shadow-effect p,
    #customers-testimonials .shadow-effect p {
        font-size: 15px;
    }

    .mp-reviews-carousel-wrap.is-single {
        max-width: 100%;
        padding: 0;
    }
}