.p-content {
    padding: 14px;
    color: #000000;
    font-size: 22px;
    font-family: "Droid Arabic Naskh";
    font-size: 18px;
    line-height: 2;
    text-align: justify;
}

.title-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-bottom: 1px solid #d29e5b;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.title {
    position: relative;
    /* color: #614d3c;*/
    font-size: 40px;
    font-weight: bold;
    font-family: arial
}

.headTitle {
    font-family: "DroidArabicKufiRegular";
    padding: 10px 0;
}

.title:after {
    position: absolute;
    width: 100%;
    height: 6px;
    background: #d29e5b;
    content: "";
    display: block;
    -webkit-transform: translatey(-33%);
    -ms-transform: translatey(-33%);
    transform: translatey(-33%);
}

button {
    display: block;
    -webkit-text-decoration: none;
    text-decoration: none;
}

.btn-more {
    width: 170px;
    background: #614D3C !important;
    color: white;
    padding: 9px;
    border: none;
    text-align: center;
    font-size: 20px;
    font-family: "DroidArabicKufiRegular";
}


.video-container {
    position: relative;
    width: 100%; /* نسبة العرض */
    padding-bottom: 56.25%; /* نسبة الارتفاع 16:9 */
    height: 0;
    overflow: hidden;
}


.video-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 8px; /* تطابق الزوايا المستديرة */
}

.swiper-container {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 40px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Adjust the height if needed */
}

.swiper-button-next,
.swiper-button-prev {
    color: #000;
/ / تغيير لون الأسهم حسب رغبتك
}

.testimonial-item img {
    width: 100%;
    height: auto;
    max-width: 200px; /* تغيير الحجم حسب الحاجة */
    max-height: 260px; /* تغيير الحجم حسب الحاجة */
    object-fit: cover; /* الحفاظ على نسبة الأبعاد */
    border-radius: 10px; /* زوايا دائرية للصورة */
}

.swiper-container {
    padding: 20px 0; /* إضافة حواف لأسفل وأعلى */
}

@media (max-width: 576px) {
    .swiper-slide {
        width: 100%; /* عرض كتاب واحد فقط في الشاشات الصغيرة */
    }
}

.testimonial-item {
    display: flex;
    flex-direction: column;
    align-items: center; /* محاذاة العناصر في المنتصف */
    text-align: center;
    height: 300px; /* تحديد ارتفاع موحد لكل العناصر */
}

.testimonial-item img {
    width: 100%; /* عرض الصورة 100% من العنصر */
    height: auto; /* الحفاظ على نسبة العرض إلى الارتفاع */
    max-height: 260px; /* ارتفاع أقصى للصورة */
    object-fit: cover; /* الحفاظ على نسبة الأبعاد */
    border-radius: 10px; /* زوايا دائرية للصورة */
}

.swiper-container {
    padding: 20px 0; /* إضافة حواف لأسفل وأعلى */
}

@media (max-width: 576px) {
    .swiper-slide {
        width: 100%; /* عرض كتاب واحد فقط في الشاشات الصغيرة */
    }

    .swiper-container {
        padding: 10px; /* تقليل الحواف على الشاشات الصغيرة */
    }

    .testimonial-item {
        height: auto; /* السماح بالارتفاع التلقائي للعناصر الصغيرة */
    }
}

@media (min-width: 577px) and (max-width: 768px) {
    .swiper-slide {
        width: 50%; /* عرض كتابين في الشاشات المتوسطة */
    }
}

@media (min-width: 769px) {
    .swiper-slide {
        width: 20%; /* عرض 5 كتب في الشاشات الكبيرة */
    }
}

.swiper-button-next,
.swiper-button-prev {
    color: #fff; /* لون الأزرار */
    width: 40px; /* عرض الأزرار */
    height: 40px; /* ارتفاع الأزرار */
    background-color: rgba(0, 0, 0, 0.5); /* خلفية الأزرار */
    border-radius: 50%; /* زوايا دائرية */
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-button-next {
    right: 14px; /* المسافة من اليمين */
}

.swiper-button-prev {
    left: 14px; /* المسافة من اليسار */
}

.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 20px; /* حجم أيقونات الأسهم */
}

/* التأكد من أن الأزرار لا تتداخل مع المحتوى */
.swiper-container {
    position: relative; /* لجعل الأزرار تتداخل مع المحتوى */
}

.breadcrumb {
    padding: 0.5rem 0.75rem;
    background-color: #f3eadf;
}

.breadcrumb-item a {
    color: #d29e5b !important;
}
#videoTrack {
    border-radius: 10px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.fAYnAn {
    background: #fff;
    box-shadow: 0 4px 4px 0 rgb(0 0 0 / 10%);
    line-height: 3;
}
