/* استيراد خط Tajawal من Google Fonts */
.tajawal-extralight {
  font-family: "Tajawal", sans-serif;
  font-weight: 200;
  font-style: normal;
}

.tajawal-light {
  font-family: "Tajawal", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.tajawal-regular {
  font-family: "Tajawal", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.tajawal-medium {
  font-family: "Tajawal", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.tajawal-bold {
  font-family: "Tajawal", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.tajawal-extrabold {
  font-family: "Tajawal", sans-serif;
  font-weight: 800;
  font-style: normal;
}

.tajawal-black {
  font-family: "Tajawal", sans-serif;
  font-weight: 900;
  font-style: normal;
}

/* الخط الافتراضي لكل المتجر */
body,
button,
input,
select,
textarea {
  font-family: 'Tajawal', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-weight: 400; /* نص أساسي مريح للقراءة */
}

/* العناوين الرئيسية (مثل اسم المنتج، عناوين الأقسام) */
h1, h2 {
  font-family: 'Tajawal', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-weight: 700; /* Bold واضح لكن مو ثقيل بزيادة */
}

/* العناوين الثانوية (داخل الصفحات، في الأقسام الجانبية) */
h3, h4 {
  font-family: 'Tajawal', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-weight: 500; /* Medium مناسب للعناوين الفرعية */
}

/* نصوص مساعدة وملاحظات خفيفة */
.small,
small,
.help-text,
.s-product-options-option label small {
  font-weight: 300; /* وزن خفيف للتفاصيل الإضافية */
}

/* أزرار وإجراءات مهمة (للتأكيد على الدعوة للفعل) */
button,
.btn,
.s-product-actions button,
.add-to-cart-btn {
  font-weight: 700;
}

footer .s-contacts-title,
footer .s-links-title {
    color: #f5f5dc !important;
}
/* تغيير لون اسم المنتج في صفحة وصف المنتج */
h1.da-tm.leading-normal.text-lg.md\:text-xl {
  color: #006666 !important;
}
/* لون عناوين خيارات المنتج (مثل: الاسم، المقاس ...) */
.s-product-options-option-label b,
.s-product-options-option-label span {
  color: #006666 !important;
}
/* تغيير لون نص زر أضف للسلة */
.s-button-element.s-button-btn.s-button-primary .s-button-text {
    color: #f5f5dc !important;
}
/* تدرّج خلفية بطاقة المنتج custom-salla-product-card */
custom-salla-product-card.s-product-card-entry {
  background: linear-gradient(
    135deg,
    #f9f9ea 0%,
    #ffffff 50%,
    #e0f5f5 100%
  ) !important;
  border-color: #f5f5dc !important; /* نفس لون الهوية */
}

/* في حال كانت بعض الثيمات تلف البطاقة داخل عناصر إضافية */
.s-product-card-entry.custom-salla-product-card {
  background: linear-gradient(
    135deg,
    #f9f9ea 0%,
    #ffffff 50%,
    #e0f5f5 100%
  ) !important;
  border-color: #f5f5dc !important;
}
/* الهيدر في كل الحالات على نفس العنصر الذي يحمل bg-white */
.store-header .header-inner.inner.bg-white.da-bgm,
.store-header.fixed-sticky .header-inner.inner.bg-white.da-bgm,
.main-nav-container.fixed-header .header-inner.inner.bg-white.da-bgm {
  background-image: linear-gradient(
    135deg,
    #f9f9ea 0%,
    #ffffff 50%,
    #e0f5f5 100%
  ) !important;
  background-color: #ffffff !important; /* لون احتياطي تحت التدرّج */
}
/* تدرّج خلفية القائمة الجانبية (القائمة المنبثقة للجوال) */
#mobile-menu {
  background-image: linear-gradient(
    135deg,
    #f9f9ea 0%,
    #ffffff 50%,
    #e0f5f5 100%
  ) !important;
  background-color: transparent !important; /* حتى لا يغطي التدرّج لون ثابت */
}

.hero-banner-text {
  text-align: right;
  color: #003333;
  font-family: 'Tajawal', system-ui, sans-serif;
}

.hero-banner-text h1 {
  font-size: 1.8rem;
  font-weight: 700;
}

.hero-banner-text p {
  font-size: 1rem;
  font-weight: 400;
  margin-top: 0.5rem;
}

.hero-banner-text .hero-btn {
  margin-top: 1rem;
  background-color: #006666;
  color: #ffffff;
  padding: 0.75rem 1.8rem;
  border-radius: 999px;
  font-weight: 700;
}

  font-size: 15px;
}

.slide--cat-entry {
  background: linear-gradient(to right, 
    #f9f9ea 0%,
    #ffffff 50%,
    #e0f5f5 100%) !important;
}

/* إذا كانت هناك override من Swiper */
.swiper-wrapper .slide--cat-entry {
  background: linear-gradient(to right, 
    #f9f9ea 0%,
    #ffffff 50%,
    #e0f5f5 100%) !important;
}

.slide--cat-entry {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.slide--cat-entry:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}
.description {
  color: #006666 !important;
  
  background-color: rgba(255, 255, 255, 0.7);
  padding: 3px 6px;
  border-radius: 12px; /* أو حتى 16px */
  display: inline-block;
}