/* ==================================================
   PURE PRIME - HEADER
   النسخة النهائية الموحّدة
   ================================================== */


/* =========================================
   1) الوضع الطبيعي
   صفحات المنتج وباقي صفحات المتجر
   ========================================= */

#mainnav {
  position: relative !important;
  width: 100% !important;
  z-index: 9999 !important;

  background: #fff !important;
  background-color: #fff !important;

  border: 0 !important;
  box-shadow: none !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

#mainnav .sahra-top-navbar {
  background: #fff !important;
  background-color: #fff !important;

  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

#mainnav a,
#mainnav button,
#mainnav .sahra-top-navbar a,
#mainnav .sahra-color-text {
  color: #5c17e8 !important;
}

body:has(.s-block--bundle-immersive-showcase) #mainnav a,
body:has(.s-block--bundle-immersive-showcase) #mainnav button,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sahra-top-navbar a {
  color: #fff !important;
}

/* أيقونات الهيدر في صفحات المنتج وباقي الصفحات */
#mainnav .sicon-menu,
#mainnav .sicon-menu::before,
#mainnav .sicon-shopping-bag,
#mainnav .sicon-shopping-bag::before,
#mainnav .sicon-cart,
#mainnav .sicon-cart::before,
#mainnav svg,
#mainnav svg path {
  color: #5c17e8 !important;
  fill: #5c17e8 !important;
  stroke: #5c17e8 !important;
}

/* الرئيسية فقط تبقى الأيقونات بيضاء */
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-menu,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sahra-color-text,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-menu::before,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-shopping-bag,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-shopping-bag::before,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-cart,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-cart::before,
body:has(.s-block--bundle-immersive-showcase) #mainnav svg,
body:has(.s-block--bundle-immersive-showcase) #mainnav svg path {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}

/* السلة والحساب في الصفحات الداخلية */
#mainnav .sicon-shopping-bag2,
#mainnav .sicon-shopping-bag2::before,
#mainnav .sicon-user,
#mainnav .sicon-user::before,
#mainnav .header-btn__icon,
#mainnav .header-btn__icon::before {
  color: #5c17e8 !important;
  fill: #5c17e8 !important;
  stroke: #5c17e8 !important;
}

body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-shopping-bag2,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-shopping-bag2::before,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-user,
body:has(.s-block--bundle-immersive-showcase) #mainnav .sicon-user::before,
body:has(.s-block--bundle-immersive-showcase) #mainnav .header-btn__icon,
body:has(.s-block--bundle-immersive-showcase) #mainnav .header-btn__icon::before {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}

/* =========================================
   2) الصفحة الرئيسية فقط
   الهيدر شفاف ويطفو فوق الهيرو
   ========================================= */

body:has(.s-block--bundle-immersive-showcase) #mainnav {
  position: absolute !important;

  top: 0 !important;
  left: 0 !important;
  right: 0 !important;

  width: 100% !important;
  z-index: 9999 !important;

  background: transparent !important;
  background-color: transparent !important;

  border: 0 !important;
  box-shadow: none !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}

body:has(.s-block--bundle-immersive-showcase)
#mainnav .sahra-top-navbar {
  background: transparent !important;
  background-color: transparent !important;

  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;

  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
}


/* =========================================
   3) إزالة الفراغ الافتراضي فوق أول بلوك
   في الرئيسية فقط
   ========================================= */

body:has(.s-block--bundle-immersive-showcase)
#main-content > .s-block:first-of-type {
  margin-top: 0 !important;
}


/* =========================================
   4) الجوال فقط
   رفع الهيرو خلف الهيدر
   وهو الحل الذي أزال المساحة البيضاء
   ========================================= */

@media (max-width: 767px) {

  body:has(.s-block--bundle-immersive-showcase)
  #main-content {
    margin-top: -80px !important;
    padding-top: 0 !important;
  }

}

@media (max-width: 640px) {
  .sticky-product-bar {
    background: #5c17e8 !important;
    background-color: #5c17e8 !important;
  }
}

@media (max-width: 640px) {
  .sticky-product-bar__quantity {
    border: 1px solid #fff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
  }

  .sticky-product-bar__quantity > * {
    border-color: #fff !important;
  }
}
@media (max-width: 640px) {

  .sticky-product-bar__quantity button,
  .sticky-product-bar__quantity input,
  .sticky-product-bar__quantity span,
  .sticky-product-bar__quantity div {
    border-color: #fff !important;
  }

  .sticky-product-bar__quantity button {
    color: #fff !important;
  }

  .sticky-product-bar__quantity input {
    color: #fff !important;
  }
}

/* =========================================
   القائمة الجانبية للجوال
   تبقى زرقاء في جميع الصفحات
   ========================================= */

@media (max-width: 1024px) {

  #mobile-menu,
  #mobile-menu.mm-spn,
  #mobile-menu.mm-spn--light {
    background: #fff !important;
    background-color: #fff !important;
    color: #5c17e8 !important;
  }

  #mobile-menu a,
  #mobile-menu li,
  #mobile-menu span,
  #mobile-menu i {
    color: #5c17e8 !important;
  }

  #mobile-menu a::before,
  #mobile-menu a::after,
  #mobile-menu li::before,
  #mobile-menu li::after {
    color: #5c17e8 !important;
    border-color: #5c17e8 !important;
  }

}
/* عنوان المنتج */
.s-product-card-content-title,
.s-product-card-content-title a {
  color: #000000 !important;
}

/* وصف المنتج */
.s-product-card-content-subtitle {
  color: #000000 !important;
}