/* Add custom CSS styles below */ 
header, .store-header, .site-header, .main-header, .header-wrapper, [class*="header"] {
    background-color: #FAF6F0 !important;
    background: #FAF6F0 !important;
}
/* ==================================================================
   1. تحويل القسم الثاني والرابع إلى تمرير عمودي (شبكة من منتجين)
   ================================================================== */
.main-homepage-sections > div:nth-of-type(2) .products-slider-wrapper,
.main-homepage-sections > div:nth-of-type(4) .products-slider-wrapper {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* منتجين بجانب بعض عمودياً */
    gap: 12px !important;
    overflow: visible !important;
    white-space: normal !important;
    flex-wrap: wrap !important;
}

/* ضبط كروت المنتجات داخل القسمين الثاني والرابع لتأخذ الحجم الكامل للشبكة */
.main-homepage-sections > div:nth-of-type(2) .product-card,
.main-homepage-sections > div:nth-of-type(4) .product-card {
    width: 100% !important;
    flex: none !important;
    margin: 0 !important;
}

/* إخفاء أزرار التنقل (الأسهم) ونقاط التمرير السفلية للقسمين العموديين فقط */
.main-homepage-sections > div:nth-of-type(2) .swiper-button-next,
.main-homepage-sections > div:nth-of-type(2) .swiper-button-prev,
.main-homepage-sections > div:nth-of-type(2) .swiper-pagination,
.main-homepage-sections > div:nth-of-type(4) .swiper-button-next,
.main-homepage-sections > div:nth-of-type(4) .swiper-button-prev,
.main-homepage-sections > div:nth-of-type(4) .swiper-pagination {
    display: none !important;
}

/* ==================================================================
   2. الحفاظ على التمرير الأفقي الذكي لبقية الأقسام السبعة الأخرى
   ================================================================== */
.main-homepage-sections > div:not(:nth-of-type(2)):not(:nth-of-type(4)) .products-slider-wrapper {
    display: flex !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch;
    gap: 8px !important;
}

.main-homepage-sections > div:not(:nth-of-type(2)):not(:nth-of-type(4)) .product-card {
    flex: 0 0 45% !important; /* نسبة عرض المنتج ليظهر جزء من المنتج التالي */
    inline-size: 45% !important;
}