html {
  direction: rtl;
  unicode-bidi: isolate;
}

@font-face {
  font-display: swap;
}

img {
  max-width: 100%;
  height: auto;
}

/* Border radius خفيف لكل صور المنتجات والتصنيفات */
.s-product-card img,
.s-category-card img,
.product-details img,
.s-product-image img,
.s-slider img {
    border-radius: 10px;
}



/* البادج الخاصة بعدد مرات الشراء */
.purchase-count-badge {
    background: rgba(218, 194, 37, 0.12);
    padding: 10px 14px;
    border-radius: 14px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    width: fit-content;
}

/* كلمة تم شراءه */
.purchase-count-badge strong {
    color: #dac225;
    font-weight: 700;
}

/* الرقم */
.purchase-count-badge span span {
    background: #dac225;
    color: #000;
    padding: 3px 9px;
    border-radius: 999px;
    font-weight: 800;
    font-size: 13px;
}

/* أيقونة تحفيزية */
.purchase-count-badge::before {
    content: "⭐";
    font-size: 15px;
}






/* ===============================
   Rose Promo Bar – Soft Gold
================================ */

#rose-only-bar {
  width: 100%;
  background: linear-gradient(
    135deg,
    #dac225 0%,
    #e6d66a 50%,
    #dac225 100%
  );
  color: #1e1e1e;
  box-shadow: 0 2px 6px rgba(0,0,0,.06); /* أخف بكتير */
  position: relative;
  z-index: 5;
}

/* محتوى الشريط */
.rose-bar-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 10px 16px;
  display: flex;
  justify-content: center;
  text-align: center;
}

/* الرابط = الكتلة السودا */
#rose-only-bar .rose-bar-link {
  display: inline-flex;
  flex-direction: column;
  gap: 2px;
  text-decoration: none;
  background-color: #000;   /* خلفية واحدة */
  color: #fff;
  padding: 8px 16px;
  border-radius: 18px;
  transition: opacity 0.25s ease;
}

/* السطور */
#rose-only-bar .rose-bar-text {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
}

/* هوفر خفيف */
#rose-only-bar .rose-bar-link:hover {
  opacity: 0.85;
}

/* موبايل */
@media (max-width: 768px) {
  .rose-bar-main {
    font-size: 14px;
  }
  .rose-bar-highlight {
    font-size: 14px;
  }
}

/* الوضع الداكن */
html.dark #rose-only-bar {
  background: linear-gradient(
    135deg,
    #8f7f1e 0%,
    #b8a93a 50%,
    #8f7f1e 100%
  );
  color: #f5f5f5;
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
}

/* النص المميز في الداكن – خلي الخلفية سوداء صافية زي العادي */
html.dark .rose-bar-highlight {
  background-color: #000; /* سوداء صافية */
  color: #fff;
}

/* Hover أنعم */
html.dark #rose-only-bar .rose-bar-link:hover {
  opacity: .9;
}




/* ================================
   سكشن البانرات نخفى صورة فى التليفونات
================================ */

/* موبايل فقط */
@media (max-width: 768px) {

  /* نخلي الجريد عمودي */
  .s-block--fixed-banner .grid {
    grid-template-columns: 1fr !important;
  }

  /* نخفي الصورة اللي في النص */
  .s-block--fixed-banner .grid > a:nth-child(2) {
    display: none !important;
  }

}


/* ================================
   Footer – Base tweaks (Light + Dark)
================================ */

/* ترتيب أيقونات التواصل */
.store-footer .s-contacts-item {
  display: flex !important;
  align-items: center;
  gap: 8px;
  flex-direction: row-reverse;
}

/* صناديق وسائل الدفع */
.store-footer .container.border-t > ul:last-of-type li {
  width: 48px;
  height: 32px;
  padding: 6px;
  background: #ffffff;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.store-footer .container.border-t > ul:last-of-type li img {
  max-height: 100%;
  width: auto;
  object-fit: contain;
}

/* ترتيب الفوتر – ديسكتوب فقط (ثابت في كل الأوضاع) */
@media (min-width: 1024px) {
  .footer-main-row {
    justify-content: space-between;
    flex-direction: row-reverse;
  }
  
  .footer-social-section {
    margin-left: auto;
  }

  .footer-menu-list {
    margin-right: auto;
    justify-content: center;
  }

}

/* اللوجو نفسه */

.store-footer a img {
  width: 60px !important;     /* كبّر المقاس */
  max-width: 60px;
  height: auto;
  max-height: none;           /* نلغي قيود الارتفاع */
  object-fit: contain;
  transition: all 0.3s ease;  /* تغيير ناعم عند تبديل الثيم */
}

/* موبايل – أصغر شوية */
@media (max-width: 768px) {
  .store-footer a img {
    width: 55px !important;
    max-width: 55px;
  }
}

/* ================================
   Footer
================================ */

html.dark .store-footer {
  background-color: #141414 !important;
  color: #ffffff !important;
}

/* النصوص */
html.dark .store-footer p,
html.dark .store-footer span,
html.dark .store-footer a,
html.dark .store-footer li {
  color: #ffffff !important;
}

/* نصوص خفيفة */
html.dark .store-footer .opacity-50,
html.dark .store-footer .opacity-70,
html.dark .store-footer .text-gray-400 {
  color: rgba(255,255,255,0.6) !important;
}

/* hover */
html.dark .store-footer a:hover {
  color: #dac225 !important;
}

/* الخط الفاصل */
html.dark .store-footer .border-t {
  border-color: rgba(255,255,255,0.1) !important;
}

/* الأيقونات واللوجوهات بدون أي تأثير */
html.dark .store-footer img,
html.dark .store-footer svg {
  filter: none !important;
}

/* نتأكد إننا في اللايت مود */
footer.store-footer-wrap 
ul.flex.justify-center.lg\:justify-end li {
  
  width: 64px;        /* كبرنا الكونتينر */
  height: 40px;
  padding: 6px;
  
  background: #fff;
  border-radius: 6px;
  
  display: flex;
  align-items: center;
  justify-content: center;
}

/* تكبير محتوى الصورة نفسه */
footer.store-footer-wrap 
ul.flex.justify-center.lg\:justify-end li img {

  width: 100%;
  height: 100%;
  object-fit: contain;
  transform: scale(1.15); /* تكبير ناعم */
}

/* تحسين شكل بسيط */
footer.store-footer-wrap 
ul.flex.justify-center.lg\:justify-end li:hover {
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}


/* ***************************** */

/* ===== BOLD Highlight Bar (Dark Mode Only) ===== */
html.dark .s-block--marquee,
body.dark .s-block--marquee,
[data-theme="dark"] .s-block--marquee {
  background-color: #dac225 !important;
  color: #000000 !important;
}

/* ===============================
   Header – Dark Mode (Transparent → Solid)
================================ */

/* الحالة الافتراضية (بدون Scroll) */
html.dark .store-header,
html.dark .main-nav {
  background-color: transparent !important;
  color: #ffffff !important;
  transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

/* إخفاء البوردر في البداية */
html.dark .store-header {
  border-bottom: none;
}

/* عند السكروول (Sticky) */
html.dark .store-header.is-sticky,
html.dark .store-header.is-scrolled,
html.dark .main-nav.is-sticky,
html.dark .main-nav.is-scrolled {
  background-color: #121212 !important; /* أسود أنيق */
  box-shadow: 0 2px 15px rgba(0,0,0,0.6);
}

/* البوردر يظهر مع السكروول */
html.dark .store-header.is-sticky {
  border-bottom: 1px solid #2a2a2a;
}

/* هرمبرجر – لون أبيض في Dark Mode */
html.dark .mburger span {
  background-color: #ffffff !important;
}

/* لوجو المتجر – يتحول أبيض في Dark Mode فقط */
html.dark .store-header .navbar-brand.default-logo img {
  filter: brightness(0) invert(1);
}

/* ***************************** */

.floating-contacts .floating-contacts__trigger .opened-icon,
.floating-contacts .floating-contacts__trigger .closed-icon,
.floating-contacts .floating-contacts__trigger .sicon-chat-bubbles{
    color: #000 !important;
}

/* ***************************** */

/* إصلاح خلفية السكشن في الدارك مود */
html.dark section.s-block--enhanced-features,
body.dark section.s-block--enhanced-features {
  background-color: #0f172a !important; /* غامق أنيق */
  
  /* لو حابب جريدينت في الدارك */
  background-image: linear-gradient(
    135deg,
    #0f172a 0%,
    #020617 100%
  ) !important;
}

html.dark .s-block--features__item,
body.dark .s-block--features__item {
  background-color: #020617 !important;
  border: 1px solid rgba(255,255,255,0.06);
}


/* ================================
   Coupon Popup Responsive Fix
================================ */

/* المحتوى الرئيسي */
.altumcode-coupon-content {
  display: flex;
  align-items: center;
  gap: 12px;
}

/* الصورة */
.altumcode-coupon-image {
  width: 90px;
  max-width: 90px;
  height: auto;
  flex-shrink: 0;
  border-radius: 6px;
}

/* النص */
.altumcode-coupon-content > div {
  flex: 1;
}

/* زر الإغلاق – كل الأجهزة */
.altumcode-close {
  font-size: 26px !important;
  width: 36px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  border-radius: 50%;
  cursor: pointer;
}

/* ================================
   Mobile Adjustments
================================ */
@media (max-width: 768px) {

  .altumcode-wrapper {
    max-width: 92vw !important;
  }

  .altumcode-coupon-content {
    align-items: flex-start;
  }

  .altumcode-coupon-image {
    width: 80px;
    max-width: 80px;
  }

  .altumcode-coupon-title {
    font-size: 15px;
  }

  .altumcode-coupon-description {
    font-size: 13px;
  }

  .altumcode-coupon-coupon-code {
    font-size: 14px;
    padding: 6px 10px;
  }

  .altumcode-coupon-button {
    font-size: 14px;
    padding: 8px 12px;
  }
}

/* إغلاق النافذة – نزول لتحت */
.altumcode-wrapper.popup-closing {
  animation: popupSlideDown 0.4s ease forwards;
}

@keyframes popupSlideDown {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0;
    transform: translateY(80px);
  }
}