/* =========================================================
   Quick Links (تسوّق) — Compact / No Icon / No Image
   Paste at END of your CSS to override previous rules
   ========================================================= */

/* إخفاء أيقونة الخط + أي صورة/دائرة كانت مضافة */
body#app.index a.slide--cat-entry i{
  display:none !important;
}
body#app.index a.slide--cat-entry::before{
  content:none !important;
  display:none !important;
}

/* تحويل حاوية الروابط السريعة إلى توزيع مرن */
body#app.index .s-block--categories-slider .swiper-wrapper{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  justify-content:center !important;
  align-items:center !important;
  padding:6px 4px !important;
}

/* جعل الرابط نفسه “زر مودرن” بحجم النص */
body#app.index a.slide--cat-entry{
  width:auto !important;
  min-width:unset !important;
  max-width:100% !important;

  height:auto !important;
  min-height:unset !important;

  padding:12px 16px !important;
  border-radius:999px !important;

  background:rgba(255,255,255,.78) !important;
  border:1px solid rgba(198,164,109,.35) !important;
  box-shadow:0 10px 18px rgba(0,0,0,.05) !important;

  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;

  gap:0 !important;
  text-align:center !important;

  transition:transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}

body#app.index a.slide--cat-entry:hover{
  transform:translateY(-1px) !important;
  background:rgba(251,246,240,.95) !important;
  box-shadow:0 14px 24px rgba(0,0,0,.08) !important;
}

/* النص داخل الرابط */
body#app.index a.slide--cat-entry h2{
  margin:0 !important;
  padding:0 !important;

  font-size:14px !important;
  font-weight:950 !important;
  letter-spacing:.2px !important;

  /* افتراضيًا سطر واحد مع قص لطيف لو طال */
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;

  color:var(--aseel-ink) !important;
}

/* لو تبغاه يسمح بسطرين بدل القص (اختياري):
body#app.index a.slide--cat-entry h2{
  white-space:normal !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
}
*/



/* =========================================================
   FOOTER — 2 Columns + Readable Colors (Override at END)
   ========================================================= */

/* 1) الأساسيات: ألوان واضحة + خلفية فاخرة */
body#app footer.store-footer,
body#app .store-footer{
  background: #171717 !important;
  color: rgba(251,246,240,.92) !important;
  border-top: 1px solid rgba(198,164,109,.40) !important;
}

body#app footer.store-footer *{
  color: inherit !important; /* يحل مشكلة اختفاء اللون */
}

/* 2) عنوان الأقسام */
body#app footer.store-footer h3,
body#app footer.store-footer .s-contacts-title{
  color: #c6a46d !important;
  font-weight: 950 !important;
  letter-spacing: .2px !important;
  margin: 0 0 12px 0 !important;
  text-align: right !important;
}

/* 3) نصوص وصفية */
body#app footer.store-footer p,
body#app footer.store-footer .store-footer__text,
body#app footer.store-footer .store-footer__text p{
  color: rgba(251,246,240,.82) !important;
  line-height: 1.9 !important;
  font-weight: 650 !important;
  text-align: right !important;
}

/* 4) تحويل أعمدة الذيل إلى Grid بعمودين على الجوال */
body#app footer.store-footer .store-footer__inner .container{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 18px 16px !important;
  align-items: start !important;
  direction: rtl !important;
}

/* على الشاشات الأكبر: 3 أعمدة */
@media (min-width: 768px){
  body#app footer.store-footer .store-footer__inner .container{
    grid-template-columns: 1.2fr 1fr 1fr !important;
    gap: 22px !important;
  }
}

/* 5) محاذاة كل بلوك في الذيل */
body#app footer.store-footer .store-footer__col,
body#app footer.store-footer .footer-col,
body#app footer.store-footer .s-block{
  text-align: right !important;
}

/* 6) روابط مهمة — شكل قائمة واضحة */
body#app footer.store-footer a.s-menu-footer-item{
  color: rgba(251,246,240,.88) !important;
  font-weight: 750 !important;
  display: block !important;
  padding: 9px 0 !important;
  border-bottom: 1px solid rgba(198,164,109,.14) !important;
  transition: color .18s ease, transform .18s ease !important;
}
body#app footer.store-footer a.s-menu-footer-item:hover{
  color: #c6a46d !important;
  transform: translateX(-2px) !important;
}

/* 7) تواصل معنا — ترتيب الأيقونات والنص */
body#app footer.store-footer salla-contacts .s-contacts-item{
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid rgba(198,164,109,.12) !important;
  direction: rtl !important;
}
body#app footer.store-footer salla-contacts .s-contacts-icon{
  color: #c6a46d !important;
  background: rgba(198,164,109,.14) !important;
  border: 1px solid rgba(198,164,109,.22) !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* 8) شريط المدفوعات والحقوق — توسيط منظم */
body#app footer.store-footer .copyright-text{
  border-top: 1px solid rgba(198,164,109,.20) !important;
  margin-top: 18px !important;
  padding-top: 14px !important;
  text-align: center !important;
}
body#app footer.store-footer .copyright-text p{
  color: rgba(251,246,240,.62) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  text-align: center !important;
}

/* 9) شارات الدفع: خلفية فاتحة + لفّ تلقائي */
body#app footer.store-footer salla-payments{
  display:flex !important;
  flex-wrap: wrap !important;
  justify-content:center !important;
  gap: 10px !important;
  margin-top: 10px !important;
}
body#app footer.store-footer salla-payments img{
  background: rgba(251,246,240,.95) !important;
  border-radius: 10px !important;
  padding: 6px 8px !important;
  border: 1px solid rgba(198,164,109,.18) !important;
}

/* 10) حل أي خلفية/تلوين غريب يسبب اختفاء */
body#app footer.store-footer [class*="text-"],
body#app footer.store-footer .text-muted,
body#app footer.store-footer .text-gray,
body#app footer.store-footer .text-secondary{
  color: rgba(251,246,240,.82) !important;
}