/* استهداف متغيراً المتجر الأصلية وطبقات زد */
:root {
    --bg-color: #F6E2CF !important;
    --background-color: #F6E2CF !important;
    --body-bg: #F6E2CF !important;
}

body, 
main, 
.site-content, 
.page-wrapper,
[class*="section-"],
[class*="container-"] {
    background-color: #F6E2CF !important;
}
/* 1. إلغاء القص عن الصورة وإظهارها كاملة */
.carousel-item img.img-fluid {
    object-fit: contain !important;
    height: auto !important;
}

/* 2. إلغاء نسبة الـ 16x9 الثابتة ليظهر ارتفاع الصورة الطبيعي بالكامل */
.carousel-item.ratio,
.carousel-item.ratio-16x9 {
    --bs-aspect-ratio: auto !important;
    height: auto !important;
}
/* 1. إجبار الحاوية على عرض 3 عناصر فقط وإخفاء الباقي */
.partners-section .swiper-wrapper,
div[class*="partner"] .swiper-wrapper {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    transform: none !important;
    width: 100% !important;
    max-width: 450px !important; /* مساحة تكفي 3 عناصر فقط */
    margin: 0 auto !important;
    overflow: hidden !important;
    gap: 20px !important;
}

/* 2. إخفاء أي عنصر زائل عن أول 3 عناصر */
.partners-section .swiper-slide:nth-child(gt(3)),
div[class*="partner"] .swiper-slide:nth-child(gt(3)),
.swiper-slide-duplicate {
    display: none !important;
}

/* 3. تثبيت حجم الكروت البيج */
.partners-section .card,
div[class*="partner"] .card {
    background-color: #ebd3c5 !important;
    border-radius: 18px !important;
    border: none !important;
    padding: 15px !important;
    width: 90px !important;
    height: 90px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.partners-section img,
div[class*="partner"] img {
    background: transparent !important;
    width: 45px !important;
    height: 45px !important;
    object-fit: contain !important;
}
/* توسيط عنوان قسم المميزات */
.css-partners h2,
.css-partners .flex-grow-1,
section[id*="a97a3045"] h2 {
    text-align: center !important;
    width: 100% !important;
    display: block !important;
    margin: 0 auto 20px auto !important;
}

/* إلغاء محاذاة الفليكس لليمين للعنوان */
.css-partners .d-flex.mb-2 {
    justify-content: center !important;
}
/* 1. جعل المربع البيج مرجع للمكان مع السماح بظهور ما خارجه */
.css-partners .card,
div[class*="partner"] .card {
    position: relative !important;
    overflow: visible !important;
    margin-bottom: 35px !important; /* مساحة كافية للكلمة تحت المربع */
}

/* 2. إضافة النص تحت المربع الأول (جودة مضمونة) */
.css-partners .swiper-slide:nth-child(1) .card::after,
div[class*="partner"] .swiper-slide:nth-child(1) .card::after {
    content: "جودة مضمونة" !important;
    position: absolute !important;
    bottom: -30px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    font-size: 14px !important;
    font-weight: bold !important;
    color: #4a2e2b !important;
    white-space: nowrap !important;
}

/* 3. إضافة النص تحت المربع الثاني (خدمة العملاء) */
.css-partners .swiper-slide:nth-child(2) .card::after,
div[class*="partner"] .swiper-slide:nth-child(2) .card::after {
    content: "خدمة العملاء" !important;
    position: absolute !important;
    bottom: -30px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    font-size: 14px !important;
    font-weight: bold !important;
    color: #4a2e2b !important;
    white-space: nowrap !important;
}

/* 4. إضافة النص تحت المربع الثالث (شحن سريع) */
.css-partners .swiper-slide:nth-child(3) .card::after,
div[class*="partner"] .swiper-slide:nth-child(3) .card::after {
    content: "شحن سريع" !important;
    position: absolute !important;
    bottom: -30px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    font-size: 14px !important;
    font-weight: bold !important;
    color: #4a2e2b !important;
    white-space: nowrap !important;
}
/* تغيير خلفية الهيدر وشريط التنقل إلى اللون العنابي */
#navbarSupportedContent,
header,
header .navbar,
.bg-secondary.bg-opacity-10 {
    background-color: #DFCAB6 !important;
}

/* تغيير لون النصوص والروابط داخل الهيدر للأبيض لكي تظهر بوضوح */
#navbarSupportedContent a,
#navbarSupportedContent .nav-link,
header a,
header .nav-link,
header i,
header svg {
    color: #ffffff !important;
    fill: #ffffff !important;
}
/* تغيير خلفية شريط القائمة العلوية للون العنابي */
#navigation-menu,
.css-menu,
section[id="navigation-menu"] {
    background-color: #6E0A0F !important;
}

/* تغيير لون عناصر القائمة والروابط للأبيض لتظهر بوضوح */
#navigation-menu a,
#navigation-menu .nav-link,
#navigation-menu span,
.css-menu .nav-link {
    color: #ffffff !important;
}

/* تغيير لون الأيقونات (إن وجدت) للأبيض */
#navigation-menu svg,
#navigation-menu i {
    fill: #ffffff !important;
    color: #ffffff !important;
}
/* 1. ضبط الحاوية والمربع ليكون الكارت بحواف دائرية وضل مميز */
.css-testimonials .card {
    position: relative !important;
    overflow: visible !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08) !important;
    border: none !important;
    margin-top: 35px !important; /* مساحة علوية لعلامة الاقتباس */
    padding-top: 25px !important;
}

/* 2. إخفاء أو تعديل أيقونة الاقتباس القديمة الموجودة بالأسفل */
.css-testimonials .card img,
.css-testimonials .card svg,
.css-testimonials .card .quote-icon {
    display: none !important;
}

/* 3. إنشاء علامة الاقتباس العنابية الكبيرة أعلى الكارت من اليسار */
.css-testimonials .card::before {
    content: "“" !important;
    position: absolute !important;
    top: -35px !important;
    left: 15px !important;
    font-family: Georgia, serif, sans-serif !important;
    font-size: 80px !important;
    line-height: 1 !important;
    color: #6E0A0F !important; /* اللون العنابي المطلوب */
    font-weight: bold !important;
    z-index: 10 !important;
}

/* 4. محاذاة النص داخل الكارت وترتيبه */
.css-testimonials .card .card-body,
.css-testimonials .card p {
    text-align: center !important;
    color: #4a4a4a !important;
    font-size: 14px !important;
    line-height: 1.6 !important;
}
/* 1. إخفاء النص واستبداله باللوجو في العمود الأول فقط من الفوتر */
footer .row > div:first-child h2.h6.text-body.fw-bold {
    font-size: 0 !important;
    line-height: 0 !important;
    display: inline-block !important;
    width: 130px !important;
    height: 50px !important;
    position: relative !important;
}

/* 2. طباعة الصورة المباشرة للشعار داخل العنصر المنسوب للعمود الأول فقط */
footer .row > div:first-child h2.h6.text-body.fw-bold::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-image: url('https://media.zid.store/cdn-cgi/image/w=200,q=100/https://media.zid.store/437831ab-7c8b-4c8c-a222-9b799a010c4a/50e0d8ad-c989-4db1-958a-fcbab745c245.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: right center !important;
}
/* 1. جعل حاوية الرابط مرجع للتموضع */
footer span.rotate-center {
    position: relative !important;
    display: inline-block !important;
}

/* 2. إخفاء شعار زد ورابطه الأصلي تماماً ومنع التفاعل معه */
footer span.rotate-center a[href*="zid.sa"] {
    opacity: 0 !important;
    pointer-events: none !important;
}

/* 3. إنشاء النص الجديد "صُنع بواسطة غامر" في نفس المكان */
footer span.rotate-center::before {
    content: "صُنع بواسطة غامر" !important;
    font-size: 0.875rem !important;
    color: #75272B !important;
    font-family: Suisse Intl, sans-serif !important;
    display: inline-block !important;
    cursor: pointer !important;
}

/* 4. إلباس رابط غامر الشفاف فوق النص بالكامل للتحويل مباشرة */
footer span.rotate-center::after {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 999 !important;
    cursor: pointer !important;
}