/* Add custom CSS styles below *//* ===== الفوتر الذهبي ===== */
footer.store-footer,
.store-footer__inner {
  background-color: #e6c979 !important; /* الذهبي المستخدم بالأعلى */
  background: #e6c979 !important;
  border: none !important;
  box-shadow: none !important;
  color: #2E4365 !important; /* الأزرق الغامق للنصوص */
}

/* ===== النصوص والأيقونات داخل الفوتر ===== */
footer.store-footer *,
.store-footer__inner * {
  color: #2E4365 !important;
  fill: #2E4365 !important;
  stroke: #2E4365 !important;
}

/* ===== إزالة أي فاصل أو ظل ===== */
footer.store-footer::before,
.store-footer__inner::before {
  content: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* ===== تنعيم التنسيق العام ===== */
.store-footer__inner {
  padding: 25px 10px !important;
  border-radius: 0 !important;
}
/* ===== خلفية قسم المنتجات بالكامل ===== */
salla-products-list.vertical-products.s-products-list.hydrated {
  background-color: #2E4365 !important; /* الأزرق الأساسي */
  background: #2E4365 !important;
  border: none !important;
  box-shadow: none !important;
  padding: 30px 0 !important;
}

/* ===== النصوص داخل هذا القسم ===== */
salla-products-list.vertical-products.s-products-list.hydrated * {
  color: #ffffff !important; /* النصوص والأيقونات بيضاء */
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* ===== كروت المنتجات نفسها تظل بيضاء لتميّزها ===== */
salla-products-list.vertical-products.s-products-list.hydrated .product,
salla-products-list.vertical-products.s-products-list.hydrated .product-box,
salla-products-list.vertical-products.s-products-list.hydrated custom-salla-product-card {
  background-color: #ffffff !important;
  color: #2E4365 !important;
  border-radius: 10px !important;
  box-shadow: 0 2px 10px rgba(0,0,0,0.1) !important;
}
/* ===== القسم الذهبي أعلى المنتجات ===== */
div.flex.items-stretch.justify-between.relative {
  background-color: #e6c979 !important; /* الذهبي الملكي */
  background: #e6c979 !important;
  border: none !important;
  box-shadow: none !important;
  padding: 20px 0 !important;
}

/* ===== النصوص والأيقونات داخله ===== */
div.flex.items-stretch.justify-between.relative * {
  color: #2E4365 !important; /* أزرق غامق للنص */
  fill: #2E4365 !important;
  stroke: #2E4365 !important;
}

/* ===== إزالة أي فواصل أو حدود ===== */
div.flex.items-stretch.justify-between.relative::before,
div.flex.items-stretch.justify-between.relative::after {
  content: none !important;
  border: none !important;
}
/* ===== خلفية الموقع بالكامل ===== */
body,
html,
#app {
  background-color: #2E4365 !important; /* الأزرق الملكي */
  background: #2E4365 !important;
  color: #ffffff !important; /* النصوص الأساسية تصير بيضاء */
}

/* ===== عشان ما يخرب التنسيق داخل الأقسام البيضاء ===== */
section,
header,
footer,
div.container,
.s-block.container {
  background-color: transparent !important;
}

/* ===== النصوص داخل المحتوى تظل مقروءة ===== */
body * {
  color: #ffffff !important;
}
/* ===== الشريط العلوي (Main Navigation) ===== */
.main-nav-container.shadow-default.bg-white {
  background-color: #2E4365!important; /* الذهبي الملكي */
  background: #2E4365 !important;
  box-shadow: none !important;
  border: none !important;
}

/* ===== النصوص والأيقونات داخله ===== */
.main-nav-container.shadow-default.bg-white * {
  color: #2E4365 !important; /* أزرق غامق للتباين */
  fill: #2E4365 !important;
  stroke: #2E4365 !important;
}

/* ===== إزالة الظل القديم وتنعيم الحواف ===== */
.main-nav-container {
  border-radius: 0 0 12px 12px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}
/* ===== قسم آراء العملاء ===== */
.s-reviews-testimonial {
  background-color: #e6c979 !important; /* الذهبي الملكي */
  background: #e6c979 !important;
  border: none !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1) !important;
  border-radius: 12px !important;
  color: #2E4365 !important; /* النص بالأزرق الغامق */
}

/* ===== النصوص والأيقونات داخل قسم آراء العملاء ===== */
.s-reviews-testimonial * {
  color: #2E4365 !important; /* أزرق غامق */
  fill: #2E4365 !important;
  stroke: #2E4365 !important;
}

/* ===== ضبط التباعد والهوامش ===== */
.s-reviews-testimonial {
  padding: 25px !important;
  margin: 15px auto !important;
}
/* =========================================
   فرض اللون الذهبي على كل البطاقات بالقسم
   ========================================= */
section.s-block.s-block--features.container,
.s-block-features,
.s-block--features,
.s-block--features.container,
.s-block-features__item,
.s-block--features__item,
.s-block-features .grid > div,
.s-block--features .grid > div {
  background: #e6c979
 !important; /* الذهبي */
  border: none !important;
}

/* تظبيط الحواف والظل */
.s-block-features__item,
.s-block--features__item {
  border-radius: 16px !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
}

/* تعديل النصوص لتكون مقروءة فوق الذهبي */
.s-block-features__item h2,
.s-block-features__item p,
.s-block--features__item h2,
.s-block--features__item p {
  color: #1a1a1a !important;
}

/* الأيقونات بلون المتجر البنفسجي */
.s-block-features__item .feature-icon,
.s-block-features__item .feature-icon *,
.s-block--features__item .feature-icon,
.s-block--features__item .feature-icon * {
  color: #e6c979
 !important;
  fill: #e6c979
 !important;
}
/* إزالة الخلفية الصفراء الكبيرة وترك فقط المربعات ذهبية */
section.s-block.s-block--features.container {
  background: none !important; /* يشيل الخلفية الصفراء */
}

/* خلي فقط المربعات نفسها ذهبية */
.s-block-features__item,
.s-block--features__item {
  background-color: #e5c661 !important; /* الذهبي */
  border-radius: 16px !important;
  border: none !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15) !important;
}

/* تنسيق النصوص */
.s-block-features__item h2,
.s-block-features__item p,
.s-block--features__item h2,
.s-block--features__item p {
  color: #1a1a1a !important;
}

/* الأيقونات بالبنفسجي */
.s-block-features__item .feature-icon,
.s-block--features__item .feature-icon {
  color: #ffffff !important;
  fill: #ffffff!important;
}
/* إخفاء قسم التعليقات بالكامل */
salla-comments {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
}
/* ===== لون خلفية محتوى بطاقة المنتج ===== */
.s-product-card-content {
  background-color: #e6c979 !important; /* ذهبي ملكي */
  color: #2E4365 !important; /* أزرق غامق للنص */
  border-radius: 10px !important;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15) !important;
  padding: 15px !important;
  transition: transform 0.3s ease, box-shadow 0.3s ease !important;
}

/* ===== تأثير عند تمرير الماوس ===== */
.s-product-card-content:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2) !important;
}

/* ===== النصوص داخل البطاقة ===== */
.s-product-card-content * {
  color: #2E4365 !important; /* أزرق غامق */
  fill: #2E4365 !important;
  stroke: #2E4365 !important;
}
footer.store-footer {
  background-color: #2E4365 !important; /* الأزرق الغامق */
  color: #ffffff !important;
}

footer.store-footer .container,
footer.store-footer a,
footer.store-footer span {
  color: #ffffff !important;
}
footer.store-footer .container {
  background-color: #2E4365 !important; /* الأزرق الغامق */
  color: #ffffff !important; /* نص أبيض */
  border-radius: 10px !important; /* حواف ناعمة (اختياري) */
  padding: 20px !important; /* مسافة داخلية أنيقة */
}

/* يخلي النصوص والروابط داخل الفوتر باللون الأبيض */
footer.store-footer .container a,
footer.store-footer .container span,
footer.store-footer .container p,
footer.store-footer .container h3 {
  color: #ffffff !important;
}
/* جعل خلفية div الداخلي للفوتر باللون الأزرق */
footer.store-footer .store-footer__inner {
  background-color: #2E4365 !important; /* أزرق غامق فخم */
  color: #ffffff !important; /* نص أبيض */
  padding: 25px !important; /* مسافة داخلية مريحة */
  border-radius: 8px !important; /* حواف ناعمة */
}

/* تأكيد على أن النصوص والروابط بيضاء */
footer.store-footer .store-footer__inner a,
footer.store-footer .store-footer__inner span,
footer.store-footer .store-footer__inner p,
footer.store-footer .store-footer__inner h3 {
  color: #ffffff !important;
}
/* تغيير لون شريط التنقل (النافبار) إلى الأزرق */
#mainnav.main-nav-container {
  background-color: #2E4365 !important; /* الأزرق الرئيسي */
  color: #ffffff !important; /* النصوص بيضاء */
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2) !important; /* ظل خفيف */
}

/* تأكد أن روابط التنقل بيضاء */
#mainnav.main-nav-container a {
  color: #ffffff !important;
}

/* عند المرور بالماوس */
#mainnav.main-nav-container a:hover {
  color: #FFD700 !important; /* ذهبي فاخر عند المرور */
  transition: 0.3s;
}
/* ===== شريط المنتج المثبت ===== */
section.sticky-product-bar {
  background-color: #2E4365 !important; /* أزرق ملكي */
  color: #FFD700 !important; /* النصوص بالذهبي */
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* النصوص داخل الشريط */
section.sticky-product-bar *,
section.sticky-product-bar span,
section.sticky-product-bar strong {
  color: #FFD700 !important; /* الذهبي */
}

/* زر الإضافة للسلة */
section.sticky-product-bar button,
section.sticky-product-bar .salla-add-product-button,
section.sticky-product-bar .add-to-cart,
section.sticky-product-bar .btn {
  background-color: #FFD700 !important; /* ذهبي */
  color: #2E4365 !important; /* نص الزر أزرق */
  border: none !important;
  font-weight: bold !important;
  transition: 0.3s;
}

/* تأثير عند المرور على الزر */
section.sticky-product-bar button:hover,
section.sticky-product-bar .btn:hover {
  background-color: #ffffff !important; /* أبيض عند المرور */
  color: #2E4365 !important;
}

/* إصلاح التمدد المفجور */
section.sticky-product-bar {
  max-width: 100% !important;
  margin: 0 auto !important;
  padding: 10px 20px !important;
  box-sizing: border-box !important;
}

/* تأكد أن العناصر متراصة بشكل أنيق */
section.sticky-product-bar .container,
section.sticky-product-bar .flex {
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
}
/* ===== إصلاح شريط المنتج المثبّت بالكامل ===== */
section.sticky-product-bar{
  position: fixed; bottom: 0; left: 0; right: 0;
  z-index: 1000;
  background: #2E4365 !important;   /* الأزرق */
  color: #FFD700 !important;         /* الذهبي للنص */
  --tw-text-opacity: 1 !important;   /* منع شفافية النص */
  box-shadow: none !important; border: 0 !important;
  padding: 10px 16px !important;
}

/* صف العناصر داخل الشريط يكون أفقي ومرتب */
section.sticky-product-bar .container,
section.sticky-product-bar .flex{
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  flex-wrap: nowrap !important;
}

/* إظهار أي عنصر ممكن يكون مخفي */
section.sticky-product-bar .hidden{ display: initial !important; }

/* السعر */
section.sticky-product-bar [class*="price"],
section.sticky-product-bar [class*="amount"]{
  color: #FFD700 !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center;
}

/* التحكم في الكمية */
section.sticky-product-bar [class*="quantity"],
section.sticky-product-bar [class*="qty"]{
  display: inline-flex !important;
  align-items: center; gap: 6px;
  background: transparent !important;
  color: #FFD700 !important;
}
section.sticky-product-bar [class*="qty"] input{
  width: 56px !important; height: 40px !important;
  text-align: center; border: 1px solid rgba(255,215,0,.6) !important;
  background: #2E4365 !important; color: #FFD700 !important;
  border-radius: 8px;
}
section.sticky-product-bar [class*="qty"] button{
  width: 40px; height: 40px; border-radius: 8px;
  background: #FFD700 !important; color: #2E4365 !important;
  border: 0; font-weight: 700;
}

/* زر إضافة للسلة – أوقف تمدده الطولي وخله افقي */
section.sticky-product-bar .s-add-product-button-with-sticky-bar button,
section.sticky-product-bar .add-to-cart,
section.sticky-product-bar .btn{
  height: 48px !important;
  width: auto !important;           /* لا يتمدد 100% */
  min-width: 170px !important;
  padding: 0 18px !important;
  border-radius: 12px !important;
  background: #FFD700 !important;   /* ذهبي */
  color: #2E4365 !important;        /* نص أزرق */
  border: 0 !important; font-weight: 800 !important;
}
section.sticky-product-bar .btn:hover{ filter: brightness(1.05); }

/* أيقونات SVG */
section.sticky-product-bar svg{ fill:#FFD700 !important; stroke:#FFD700 !important; }

/* منع أي ارتفاع غريب */
section.sticky-product-bar *{ max-height: 100vh !important; }
/* الشريط العلوي (mainnav) */
#mainnav.main-nav-container {
  background-color: #2E4365 !important; /* أزرق متجرك */
  border: none !important;
  box-shadow: none !important;
}

/* النصوص داخل الشريط */
#mainnav.main-nav-container *,
#mainnav.main-nav-container a {
  color: #2E4365 !important; /* ذهبي */
}

/* أيقونات */
#mainnav.main-nav-container svg,
#mainnav.main-nav-container svg * {
  fill: #2E4365 !important;
  stroke: #2E4365 !important;
}

/* شيل تأثير الأبيض الافتراضي */
#mainnav.main-nav-container.bg-white {
  background-color: #2E4365 !important;
}
/* 🎨 تغيير الخلفية للعنصر الذهبي إلى الأزرق */
div.flex.items-stretch.justify-between.relative {
  background-color: #2E4365 !important; /* الأزرق الرسمي */
  background: #2E4365 !important;
  border: none !important;
  box-shadow: none !important;
  opacity: 1 !important;
}

/* 👁️ النصوص والأيقونات باللون الأبيض */
div.flex.items-stretch.justify-between.relative * {
  color: #ffffff !important;
  fill: #ffffff !important;
  stroke: #ffffff !important;
}
/* 🔵 زر الإضافة للسلة بالأزرق والنص بالأبيض */
button.s-button,
button.s-button-btn,
button.s-button-element,
button.s-button-outline,
.s-button-wide button,
.s-button {
  background-color: #2E4365 !important; /* الأزرق الرسمي */
  color: #ffffff !important; /* النص أبيض */
  border: none !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: 0.3s ease !important;
}

/* ✨ عند تمرير الماوس يصير أفتح شوي */
button.s-button:hover,
.s-button:hover {
  background-color: #3E5485 !important; /* أزرق أفتح عند الهوفر */
  color: #ffffff !important;
}
/* ✨ تغيير لون أيقونة الحساب إلى ذهبي */
.header-btn__icon.sicon-user-circle::before {
  color: #E6C979 !important; /* الذهبي */
}

/* لو كانت الأيقونة SVG داخل زر */
.header-btn__icon svg,
.header-btn__icon svg path {
  fill: #E6C979 !important;
  stroke: #E6C979 !important;
}
/* 🛍️ تغيير لون أيقونة السلة إلى ذهبي */
.header-btn__icon.icon.sicon-shopping-bag::before {
  color: #E6C979 !important; /* الذهبي */
}

/* لو كانت الأيقونة بصيغة SVG داخل الزر */
.header-btn__icon.icon.sicon-shopping-bag svg,
.header-btn__icon.icon.sicon-shopping-bag svg path {
  fill: #E6C979 !important;
  stroke: #E6C979 !important;
}
/* 🧨 إزالة زر المفضلة من المنتجات بالكامل */
.s-product-card-wishlist-btn {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
/* 🧩 حل مشكلة القص داخل الحاويات */
.grid,
.flex,
div {
  overflow: visible !important;
}
/* ألوان البراند */
:root{
  --royale-blue: #224365;
  --royale-gold: #E6C979; /* الذهبي المستخدم عندك في الهيدر */
}
/* 🎨 قلب الألوان - الكرت ذهبي والمحتوى أزرق */
.s-product-card {
  background-color: #E6C979 !important; /* ذهبي */
  border-radius: 14px !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

/* 🟦 القسم الداخلي أزرق */
.s-product-card-content {
  background-color: #224365 !important; /* أزرق */
  color: #ffffff !important;
  padding: 15px !important;
  border-radius: 0 0 14px 14px !important;
  min-height: 140px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

/* 🖋️ النصوص باللون الأبيض */
.s-product-card-content * {
  color: #ffffff !important;
}

/* 🖼️ صورة المنتج بدون قص */
.s-product-card-image {
  background: transparent !important;
  object-fit: contain !important;
  height: 230px !important;
  margin-top: 10px !important;
}

/* 🛒 زر إضافة للسلة ذهبي بنص أزرق */
.s-product-card .s-button,
.s-product-card .s-button-outline {
  background: #E6C979 !important;
  color: #E6C979!important;
  border: 2px solid #E6C979 !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
}
/* ✨ جعل الكرت ذهبي والمحتوى الداخلي أزرق */
.s-product-card {
  background-color: #E6C979 !important; /* الذهبي الفخم */
  border-radius: 16px !important;
  overflow: hidden !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  border: 2px solid #E6C979 !important;
}
/* 🛒 زر إضافة للسلة باللون الذهبي */
button.s-button,
button.s-button-outline,
.s-product-card button,
.s-product-card .s-button-element {
  background-color: #E6C979 !important; /* ذهبي */
  color: #224365 !important; /* النص أزرق */
  border: none !important;
  font-weight: 700 !important;
  border-radius: 8px !important;
  transition: 0.3s ease !important;
}

/* ✨ عند تمرير الماوس عليه */
button.s-button:hover,
button.s-button-outline:hover,
.s-product-card button:hover {
  background-color: #d8b64d !important; /* ذهبي أغمق شوي */
  color: #ffffff !important;
}
/* 🧱 تعبئة الصورة بالكامل بدون فراغ أبيض */
.s-product-card-image {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  height: 100% !important;
}

.s-product-card-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 0 !important;
}