/* خلفية الرأس بكافة عناصره */
.store-header,
.store-header .top-navbar,
#mainnav,
.main-nav-container,
.main-nav-container .inner {
    background-color: #000 !important;
    color: #fff !important;
    border-color: #333 !important;
}

/* الروابط والأيقونات داخل الهيدر */
.store-header a,
.store-header .header-btn__icon,
.store-header .sicon-menu,
.main-nav-container a,
.main-nav-container .header-btn__icon,
.main-nav-container .icon {
    color: #fff !important;
}

/* ألوان العناصر في شريط الأدوات العلوي (العملة واللغة وسلة المشتريات والبحث) */
.store-header .header-buttons button,
.store-header .header-buttons .btn--rounded-gray,
.store-header .cart-count {
    color: #fff !important;
    background-color: transparent !important;
    border-color: #555 !important;
}

/* حقل البحث داخل الهيدر */
.store-header .header-search input[type="search"] {
    background-color: #222 !important;
    border: 1px solid #555 !important;
    color: #fff !important;
}
.store-header .header-search input[type="search"]::placeholder {
    color: #aaa !important;
}

/* قلب ألوان شعار المتجر ليظهر أبيض على الخلفية السوداء */
.store-header .navbar-brand img {
    filter: invert(1) grayscale(100%) !important;
}

/* تذييل الموقع */
.store-footer,
.store-footer .store-footer__inner {
    background-color: #000 !important;
    color: #fff !important;
}

/* الروابط والعناوين داخل التذييل */
.store-footer a,
.store-footer h3,
.store-footer h4,
.store-footer h5,
.store-footer p {
    color: #fff !important;
}

/* أيقونات التواصل الاجتماعي في التذييل */
.store-footer i {
    color: #fff !important;
}

/* خطوط فاصلة للهيدر والفوتر */
.store-header,
.store-footer {
    border-width: 0 0 1px 0;
    border-style: solid;
    border-color: #333 !important;
}
.store-footer {
    border-width: 1px 0 0 0;
}

/* أزرار بالفوتر (إن وجدت) */
.store-footer button {
    background-color: #333 !important;
    color: #fff !important;
    border: 1px solid #555 !important;
}
.store-footer button:hover {
    background-color: #444 !important;
    color: #fff !important;
}

==============

/* ===== قفل شبكة البنرات 3×2 ومنع كسر الصف ===== */

/* الحاوية نفسها تبقى Grid بـ 3 أعمدة */
section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  align-items: start !important;      /* العناصر تبدأ من أعلى الخلية */
  justify-items: stretch !important;
}

/* كل عنصر مباشر داخل الـgrid (مهما كان نوعه) */
section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row > *{
  /* 1) امنع أي هوامش علوية تُنزل العنصر (مثل sm:mt-8) */
  margin-top: 0 !important;

  /* 2) امنع أي span/start/shorthand من Tailwind يكسر الصف */
  grid-column: auto !important;            /* ألغِ أي col-start */
  grid-column-end: span 1 !important;      /* ألغِ أي col-span */
  grid-row: auto !important;

  /* 3) محاذاة من أعلى وتمدّد أفقي كامل */
  place-self: start stretch !important;

  /* ارتفاع وبنية الكرت (يمكنك تعديل الأرقام لو رغبت) */
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  align-items: center !important;
  height: 260px !important;                /* ارتفاع موحّد للكرت */
  padding: 12px !important;
  box-sizing: border-box !important;
  background: #f6f8f9;
  border-radius: 12px;
  min-width: 0 !important;                 /* يمنع دفع زملائه للسطر التالي */
}

/* صورة البنر سواء كانت خلفية داخل .lazy__bg أو <img> عادي */
section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row > * > .lazy__bg,
section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row > * > img{
  width: 100% !important;
  height: 200px !important;                /* لو تبيها أكبر جرّب 220px */
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  object-fit: contain !important;
  display: block !important;
  border-radius: 8px;
}

/* عنوان البنر */
section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row > * :where(h2,h3,.title,span){
  margin-top: 10px !important;
  text-align: center !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  color: #000 !important;
  min-height: 36px !important;             /* مساحة موحّدة للنص */
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

/* تجاوب */
@media (max-width: 991px){
  section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row{
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
@media (max-width: 600px){
  section.s-block.s-block--banners.container > div.grid.md\:grid-cols-3.two-row.grid-flow-row{
    grid-template-columns: 1fr !important;
  }
}

----------------

/* 🎨 تحسين شكل البنرات (الكروت) */
section.s-block.s-block--banners.container .banner-entry {
  background: #fff !important;            /* خلفية موحدة */
  border-radius: 14px !important;         /* زوايا ناعمة */
  box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important; /* ظل خفيف */
  overflow: hidden !important;            /* يمنع خروج العناصر بره الكرت */
  transition: transform 0.25s ease, box-shadow 0.25s ease !important;
  text-align: center !important;          /* توسيط النص */
  padding: 10px !important;
}

/* 🖼️ تحسين شكل الصور داخل الكرت */
section.s-block.s-block--banners.container .banner-entry img,
section.s-block.s-block--banners.container .banner-entry .lazy_bg {
  transition: transform 0.3s ease !important;
  max-height: 200px !important;           /* ارتفاع مناسب للصور */
  object-fit: contain !important;
  margin: 0 auto !important;              /* توسيط الصورة */
  display: block !important;
}

/* ✨ تأثير عند المرور (Hover) على الكرت */
section.s-block.s-block--banners.container .banner-entry:hover {
  transform: translateY(-6px) scale(1.03) !important; /* يكبر شوي ويرتفع */
  box-shadow: 0 6px 18px rgba(0,0,0,0.15) !important; /* ظل أوضح */
}

/* ✨ تأثير عند المرور (Hover) على الصورة */
section.s-block.s-block--banners.container .banner-entry:hover img,
section.s-block.s-block--banners.container .banner-entry:hover .lazy_bg {
  transform: scale(1.05) !important;      /* الصورة تكبر شوي */
}

٨٨٨٨٨٨٨٨٨٨

/* خلفية القائمة المنسدلة */
.sub-menu {
  background-color: #ffffff !important; /* أبيض */
  box-shadow: 0 8px 20px rgba(0,0,0,.15) !important;
}

/* النصوص داخل القائمة */
.sub-menu a,
.sub-menu span {
  color: #000000 !important; /* أسود */
}

/* الأيقونات (لو في أيقونات داخل القائمة) */
.sub-menu i,
.sub-menu svg {
  color: #000000 !important;
  fill: #000000 !important;
}

/* الهوفر */
.sub-menu a:hover span {
  color: #d4af37 !important; /* ذهبي عند المرور */
}

######################

/* خلفية قائمة المستخدم */
.s-user-menu-dropdown {
  background-color: #ffffff !important; /* أبيض */
  box-shadow: 0 6px 18px rgba(0,0,0,.15) !important;
  border-radius: 6px !important;
}

/* العناصر النصية */
.s-user-menu-dropdown-item-title {
  color: #000000 !important; /* أسود */
  font-weight: 500;
}

/* الأيقونات داخل القائمة */
.s-user-menu-dropdown-item i,
.s-user-menu-dropdown-item svg {
  color: #000000 !important;
  fill: #000000 !important;
}

/* الهوفر */
.s-user-menu-dropdown-item:hover .s-user-menu-dropdown-item-title,
.s-user-menu-dropdown-item:hover i,
.s-user-menu-dropdown-item:hover svg {
  color: #d4af37 !important; /* ذهبي */
  fill: #d4af37 !important;
  transition: all .25s ease;
}

(((((((((((((
تغيير الوان قائمة المستخدم عرض الجوال

/* تحسينات خفيفة لقائمة المستخدم */
@media (max-width:1024px){
  /* مساحة لمس مريحة + خط أوضح */
  #aayon-user-mini.open .a-list a{
    padding: 16px 12px !important;   /* ≥48px لمس */
    font-size: 15.5px !important;
  }

  /* لون هوفر ذهبي لطيف (نفس هوية الموقع) */
  #aayon-user-mini.open .a-list a:hover{
    background: #f7f3e6 !important;  /* ذهبي فاتح */
  }

  /* فواصل أخف */
  #aayon-user-mini.open .a-list li{
    border-bottom: 1px solid #eee !important;
  }

  /* حواف وزيادة ظل خفيفة */
  #aayon-user-mini.open .a-panel{
    border-radius: 18px 18px 0 0 !important;
    box-shadow: 0 -10px 28px rgba(0,0,0,.18) !important;
  }

  /* مسافة أمان لأسفل iPhone (Safe Area) */
  #aayon-user-mini.open .a-panel{
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px)) !important;
  }
}