/* Add custom CSS styles below */ 
#main-nav {
    background: #05002b;
}
@media (min-width: 1024px){
   salla-slider.photos-slider .swiper-slide {
      margin-left: 1024;
      margin-right: 1024;
      width: 100% ;
   }
}
salla-slider.photos-slider .swiper {
    padding-left: 0 !important;
}
section.s-block.s-block--photos-slider {
    margin: 0 ;
}
#app .main-nav.fixed-pinned .inner,
#app .side-panel{
   /* top: 50px; */
}


#app .side-panel{
z-index: 99999;
}

#app .s-block--photos-slider salla-slider.photos-slider .swiper{
    padding-right: 0;
    padding-left: 0;
}
#app .s-block--photos-slider salla-slider.photos-slider .swiper-slide{
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
}

#app .s-block--photos-slider img,
#app salla-slider.photos-slider .swiper-slide{
    border-radius: 0;
}
#app .main-nav.animated .inner {
    transition: top .5s,transform .5s 0.2s,opacity .4s;
}
#main-nav.fixed-pinned .inner{
 padding-top: 0.375rem;
 padding-bottom: 0.375rem;
}
.s-slider-thumbs .s-slider-thumbs-container .swiper-slide img {
    object-fit: contain;
}
.right-side h2 {
  font-size: 30px; /* Adjust the font size as needed */
  color: #5b55d6; /* Dark blue color */
  position: relative;
  display: inline-block;
}
salla-slider.photos-slider:not(.hydrated)>div {
    justify-content: start !important;
}
.dark {
    --color-primary: #5b55d6;
}
body.login-page {
  position: relative;
}
.s-login-modal .s-modal-title:after {
  content: "❗ لعملائنا الكرام خارج المملكة: استخدام رقم الهاتف للدخول غير متوفر حاليًا، يتم إرسال الكود عبر الإيميل فقط.";
  display: block;
  font-size: 13px;
  color: #008000;
  margin-top: 25px;
  /* Removed font-weight property */
}
}
.your-banner-class-or-id {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999;
}
.my-custom-class {

font-size: 16px;

}
.main-menu a span {
  font-size: 16px !important;
  font-weight: 550 !important;
}

#widget-storemenu a span {
  font-size: 17px !important;
  font-weight: 500 !important;
  }
body {
 font-size: 17px;
 font-weight: 400;
}
body:not(:has(.pricesBar))#app .main-nav.fixed-pinned .inner,
body:not(:has(.pricesBar))#app .side-panel {
    top: 0 !important;
}
div.s-block__title h2.last:mb-4 {
  font-family: "DIN Next LT Arabic Regular", serif !important;
}





/* الكود التالي يهدف لتنظيم روابط الفوتر */

/* الحاوية الأساسية للشبكة */
.custom-footer-grid {
    display: grid !important;
    width: 100% !important;
    padding: 10px 0 !important;
    text-align: right !important;
    direction: rtl !important;
    /* هذا السطر يمنع الأعمدة من التمدد بشكل طولي زائد */
    align-items: start !important; 
}

/* عمودين للموبايل و 4 للديسكتوب مع ضبط المسافات بين الأعمدة */
@media (min-width: 768px) {
    .custom-footer-grid {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 20px !important;
    }
}
@media (max-width: 767px) {
    .custom-footer-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px !important;
    }
}

/* تنسيق العناوين بشكل أنيق ومدمج */
.custom-footer-col h3 {
    font-size: 16px !important;
    font-weight: bold !important;
    color: #222 !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    padding-bottom: 8px !important;
    border-bottom: 1px solid #eaeaea !important; /* خط سفلي خفيف يفصل العنوان عن الروابط */
}

/* تصفير الهوامش الافتراضية الخاصة بمنصة سلة */
.custom-footer-col ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* تقليل المسافات بين الروابط (رأسياً) */
.custom-footer-col li {
    margin-bottom: 8px !important; 
    text-align: right !important;
}

/* تنسيق الروابط بحجم خط مناسب ومسافات دقيقة للموبايل والديسكتوب */
.custom-footer-col a {
    font-size: 14px !important;
    color: #555 !important;
    text-decoration: none !important;
    display: inline-block !important; /* تغيير من block إلى inline-block لمنع المساحات الوهمية */
    line-height: 1.4 !important;
    transition: color 0.2s ease-in-out !important;
}

/* لون الرابط عند المرور عليه بالماوس (لون ذهبي مناسب لهوية الموقع) */
.custom-footer-col a:hover {
    color: #d4af37 !important; 
}