/* Add custom CSS styles below */ 

/**********************
   الخلفية العامة للهيدر
***********************/
header,
.main-header,
.site-header {
    background-color: #0A1F33 !important; /* كحلي داكن */
}


/**********************
   الشريط العلوي TOP BAR
***********************/
.top-nav {
    background-color: #0A1F33 !important;
    color: #FFFFFF !important;
}

.top-nav a {
    color: #FFFFFF !important;
}

.top-nav a:hover {
    color: #12B3D6 !important;
}


/**********************
   الهيدر الرئيسي (اللوقو + البحث + الحساب)
   ✅ تعديل: خلفية بيضاء + نص/أيقونات سوداء + بحث/سلة أوضح
***********************/
#header-mainbar,
.header-mainbar {
    background-color: #FFFFFF !important;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

/* النصوص والروابط داخل الهيدر الرئيسي */
#header-mainbar,
#header-mainbar a,
#header-mainbar span,
#header-mainbar .text {
    color: #111111 !important;
}

/* عناوين تسجيل الدخول الثانوية */
#header-mainbar .login-button .text span:last-child {
    color: rgba(17,17,17,0.70) !important;
}

/* أيقونات الهيدر داخل mainbar فقط */
#header-mainbar svg,
#header-mainbar i {
    color: #111111 !important;
    fill: #111111 !important;
}

/* Hover داخل mainbar */
#header-mainbar a:hover {
    color: #12B3D6 !important;
}
#header-mainbar .header-icon-button:hover i,
#header-mainbar .header-icon-button:hover svg {
    color: #12B3D6 !important;
    fill: #12B3D6 !important;
}

/**********************
   شريط القائمة (مفصول بلون مختلف)
***********************/
#mainnav.main-nav-container,
.main-nav-container.menu-has-buttons {
    background-color: #102A43 !important; /* أفتح من الهيدر */
    border-top: 1px solid rgba(255,255,255,0.05);
}


/**********************
   روابط القائمة الرئيسية
***********************/
#mainnav .main-menu > li > a {
    color: #FFFFFF !important;
    font-weight: 500;
}

#mainnav .main-menu > li > a:hover {
    color: #12B3D6 !important;
}

/* العنصر النشط */
#mainnav .main-menu > li.active > a,
#mainnav .main-menu > li.current-menu-item > a {
    color: #12B3D6 !important;
    border-bottom: 2px solid #12B3D6;
}


/**********************
   أيقونات الهيدر (باقي الهيدر)
***********************/
header svg,
header i {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}

/* ✅ استثناء مهم: داخل header-mainbar خليها سوداء */
#header-mainbar svg,
#header-mainbar i {
    color: #111111 !important;
    fill: #111111 !important;
}
/**********************
   شريط البحث
   ✅ تعديل: بحث أوضح داخل mainbar
***********************/
header input[type="search"] {
    background-color: #FFFFFF !important;
    color: #0A1F33 !important;
    border-radius: 6px;
}

/* بحث الهيدر الرئيسي فقط */
#header-mainbar input[type="search"],
#header-mainbar .s-search-input {
    background-color: #F6F7F9 !important;
    color: #111111 !important;
    border: 1px solid rgba(0,0,0,0.12) !important;
    border-radius: 10px !important;
}

/* أيقونة البحث داخل mainbar */
#header-mainbar .s-search-icon svg {
    color: rgba(17,17,17,0.70) !important;
    fill: rgba(17,17,17,0.70) !important;
}

/* ✅ السلة داخل mainbar أوضح */
#header-mainbar .s-cart-summary-wrapper {
    background: rgba(0,0,0,0.04) !important;
    border: 1px solid rgba(0,0,0,0.10) !important;
    border-radius: 12px !important;
    padding: 8px 10px !important;
}

/* رقم السلة */
#header-mainbar .s-cart-summary-count {
    background: #12B3D6 !important;
    color: #FFFFFF !important;
}

/* زر البحث */
header button,
header .search-btn {
    background-color: #0B5FAE !important;
    color: #FFFFFF !important;
    border-radius: 6px;
}

header button:hover,
header .search-btn:hover {
    background-color: #094C8C !important;
}


/**********************
   القائمة المنسدلة (Dropdown)
***********************/
.main-nav-container .sub-menu {
    background-color: #102A43 !important;
    border-radius: 10px;
    padding: 8px 0;
    box-shadow: 0 8px 20px rgba(0,0,0,0.25);
}

/* جميع النصوص داخل المنسدلة */
.main-nav-container .sub-menu *,
.menu-has-buttons .sub-menu * {
    color: #FFFFFF !important;
}

/* روابط العناصر */
.main-nav-container .sub-menu a {
    padding: 10px 18px;
    display: block;
    font-size: 14px;
    transition: all 0.3s ease;
}

/* تأثير المرور */
.main-nav-container .sub-menu li:hover > a {
    background-color: #41565a !important;
    color: #FFFFFF !important;
    border-radius: 6px;
}

/* منع الشفافية أو بهتان اللون */
.main-nav-container .sub-menu li {
    opacity: 1 !important;
}
/*********************************
   RESPONSIVE FIXES (Mobile + Large Screens)
   يحافظ على التناسق في جميع الأحجام
**********************************/

/* الشاشات الكبيرة: البحث يتمدد بشكل مناسب ولا يزاحم الأيقونات */
@media (min-width: 1024px){
  #header-mainbar .search-bar{
    flex: 1;
    max-width: 680px;          /* عرض مناسب للبحث */
  }

  #header-mainbar .s-search-input,
  #header-mainbar input[type="search"]{
    height: 52px !important;   /* أقل من 60 لتناسق أفضل */
  }

  /* أزرار الحساب/السلة تكون متقاربة ومتناسقة */
  #header-mainbar .header-icon-button{
    align-items: center;
    gap: 10px;
  }
}

/* الجوال: تصغير ارتفاع حقل البحث + تحسين المسافات */
@media (max-width: 768px){
  /* تقليل المسافات داخل الهيدر الرئيسي */
  #header-mainbar .container.sides-wrap{
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* حجم اللوقو لا يكبر ويكسر الصف */
  #header-mainbar .navbar-brand img{
    max-height: 44px !important;
    height: auto !important;
  }

  /* أيقونة المنيو تكون واضحة داخل خلفية بيضاء */
  #header-mainbar .menu-trigger i{
    font-size: 26px !important;
  }

  /* النص بجانب أيقونة حسابي قد يسبب زحمة بالجوال */
  #header-mainbar .login-button .text{
    display: none !important;
  }

  /* السلة لا تتمدد وتسبب كسر */
  #header-mainbar .s-cart-summary-wrapper{
    padding: 6px 8px !important;
    border-radius: 10px !important;
  }

  /* شريط البحث في الجوال (اللي تحت) يكون واضح ومناسب */
  .search-bar--mobile .s-search-input,
  .search-bar--mobile input[type="search"]{
    height: 42px !important;
    border-radius: 10px !important;
  }
}

/* شاشات كبيرة جدًا: نزيد عرض البحث بدون مبالغة */
@media (min-width: 1440px){
  #header-mainbar .search-bar{
    max-width: 820px;
  }
}

/*********************************
   السلايدر الرئيسي - خلفية وارتفاع
**********************************/
.s-block--default-home-slider,
.s-block--full-bg {
    position: relative;
}

.s-block--default-home-slider .swiper-slide {
    min-height: 520px;
    background-size: cover !important;
    background-position: center center !important;
}


/*********************************
   طبقة تغميق فوق الصورة لتحسين وضوح النص
**********************************/
.s-block--default-home-slider .swiper-slide::before {
    display: none !important;
}
.s-block--default-home-slider .swiper-slide {
    min-height: 520px;
    background-size: cover !important;   /* تملأ المساحة بدون تشويه */
    background-position: center center !important;
    background-repeat: no-repeat !important;
}


.home-slider__content {
    position: relative;
    z-index: 2;
}


/*********************************
   تنسيق النص داخل السلايدر
**********************************/
.home-slider__content h3 {
    font-size: 40px;
    font-weight: 800;
    margin-bottom: 15px;
}

.home-slider__content p {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 25px;
    color: #E6F2F8;
}


/*********************************
   زر السلايدر
**********************************/
.home-slider__content .btn {
    background-color: #12B3D6;
    color: #fff;
    padding: 12px 26px;
    font-size: 16px;
    border-radius: 8px;
    transition: 0.3s;
}

.home-slider__content .btn:hover {
    background-color: #0B5FAE;
    transform: translateY(-3px);
}


/*********************************
   الأسهم الجانبية
**********************************/
.s-block--default-home-slider .s-slider-nav-arrow {
    background: rgba(10,31,51,0.65);
    backdrop-filter: blur(4px);
    width: 52px;
    height: 52px;
    border-radius: 50%;
    transition: 0.3s;
}

.s-block--default-home-slider .s-slider-nav-arrow svg {
    fill: #FFFFFF;
}

.s-block--default-home-slider .s-slider-nav-arrow:hover {
    background: #12B3D6;
}


/*********************************
   نقاط التنقل
**********************************/
.s-block--default-home-slider .swiper-pagination-bullet {
    background: rgba(255,255,255,0.5);
    width: 10px;
    height: 10px;
    opacity: 1;
}

.s-block--default-home-slider .swiper-pagination-bullet-active {
    background: #12B3D6;
    transform: scale(1.2);
}


/*********************************
   📱 استجابة للجوال
**********************************/
@media (max-width: 992px) {
   /* الوضع الافتراضي (كمبيوتر) */
.s-block--default-home-slider .swiper-slide {
    min-height: 520px;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;
}

}
/*********************************
  حل جذري لقص صور السلايدر في الجوال
**********************************/

@media (max-width: 768px) {

  /* نجعل السلايدر يأخذ نسبة أبعاد ثابتة */
  .s-block--default-home-slider .swiper-slide {
      height: auto !important;
      min-height: unset !important;
      aspect-ratio: 16 / 9 !important; /* أهم سطر */
      position: relative;
  }

  /* نجعل الصورة تملأ السلايد بالكامل */
  .s-block--default-home-slider .swiper-lazy,
  .s-block--default-home-slider .swiper-lazy-loaded {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      /* background-size: contain !important; /* تظهر كاملة بدون قص */ */
      background-position: center center !important;
      background-repeat: no-repeat !important;
  }

  /* نعيد تموضع النص */
  .s-block--default-home-slider .home-slider__content {
      position: relative;
      z-index: 2;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px !important;
      text-align: center;
  }

  /* إزالة أي طبقة تغميق قد تغطي الصورة */
  .s-block--default-home-slider .swiper-slide::before {
      display: none !important;
  }
}


/*********************************
   📱 جوالات صغيرة جدًا
**********************************/
/* إصلاح قص صور السلايدر في الجوال */
/* ===== إصلاح عرض صور السلايدر في الجوال بدون اختفاء ===== */
/* ===== إصلاح سلايدر سلة في الجوال بدون ما يختفي ===== */
/* ===== سلايدر الجوال بدون قص وبدون فراغات ===== */
/* @media (max-width: 768px) {

  /* نخلي السلايد بارتفاع مناسب للشاشة */
  /* .s-block--default-home-slider .swiper-slide {
      min-height: 60vh !important; /* ارتفاع متناسق مع شاشة الجوال */
  } */

  /* الصورة تغطي كامل المساحة بدون فراغ */
  /* .s-block--default-home-slider .swiper-slide .swiper-lazy,
  .s-block--default-home-slider .swiper-slide .swiper-lazy-loaded {
      background-size: cover !important;   /* تملأ المساحة */
      /* background-position: center center !important;
      background-repeat: no-repeat !important; */
  } */

  /* إلغاء أي طبقة فوق الصورة */
  /* .s-block--default-home-slider .swiper-slide::before {
      display: none !important;
  } */

  /* تقليل الحشو الداخلي للنص */
  /* .home-slider__content {
      padding-top: 20px !important;
      padding-bottom: 20px !important;
  } */
} */




/* ====== قسم مميزات المتجر ====== */
.s-block--features-list {
    margin-top: 40px;
    margin-bottom: 40px;
}

.s-block--features {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

/* الكرت */
.s-block--features__item {
    background: #ffffff;
    border-radius: 14px;
    padding: 25px 20px;
    display: flex;
    align-items: center;
    gap: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    transition: all 0.3s ease;
    border: 1px solid #f1f1f1;
}

.s-block--features__item:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.10);
}

/* الأيقونة */
.s-block--features__item .feature-icon {
    font-size: 26px;
    color: #fff;
    background: linear-gradient(135deg, #12B3D6, #0B5FAE);
    width: 55px;
    height: 55px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* العنوان */
.s-block--features__item h4 {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #0A1F33;
}

/* الوصف */
.s-block--features__item p {
    font-size: 14px;
    color: #6b7c93;
    margin: 0;
}
@media (max-width: 992px) {
    .s-block--features {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .s-block--features {
        grid-template-columns: 1fr;
    }

    .s-block--features__item {
        padding: 18px;
    }

    .s-block--features__item h4 {
        font-size: 16px;
    }

    .s-block--features__item p {
        font-size: 13px;
    }
}


/*********************************
   خلفية القسم بالكامل
**********************************/
#main-links-2 {
    background: linear-gradient(180deg, #0A1F33 0%, #0F2B46 100%);
    padding: 45px 0; /* زودنا المساحة */
}


/*********************************
   عنوان القسم + الوصف (توسيط مثالي)
**********************************/
#main-links-2 .s-slider-block__title {
    text-align: center;
    display: block;
    margin-bottom: 35px;
}

#main-links-2 .s-slider-block__title-right,
#main-links-2 .s-slider-block__title-left {
    width: 100%;
    justify-content: center;
}

#main-links-2 h2 {
    color: #FFFFFF !important;
    font-size: 34px; /* أكبر */
    font-weight: 800;
    margin-bottom: 10px;
}

#main-links-2 p {
    color: #B8D7EA !important;
    font-size: 17px;
    max-width: 750px;
    margin: 0 auto;
}


/*********************************
   كروت التصنيفات (أكبر)
**********************************/
#main-links-2 .slide--cat-entry {
    background: #102A43;
    border-radius: 18px;
    padding: 26px 18px; /* تكبير الحواف الداخلية */
    text-align: center;
    transition: all 0.35s ease;
    border: 1px solid rgba(255,255,255,0.05);
    height: 100%;
    display: block;
}


/* صورة التصنيف (أكبر وواضحة) */
#main-links-2 .slide--cat-entry .bg-cover {
    height: 120px;
    width: 120px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background-size: cover;
    background-position: center;
    border: 4px solid #0B5FAE;
    transition: all 0.35s ease;
}


/* اسم التصنيف */
#main-links-2 .slide--cat-entry h4 {
    color: #FFFFFF;
    font-size: 19px;
    margin-bottom: 8px;
    font-weight: 700;
}


/* وصف التصنيف */
#main-links-2 .slide--cat-entry span {
    color: #9FBAD0;
    font-size: 14px;
    line-height: 1.6;
}


/*********************************
   تأثير المرور (Hover)
**********************************/
#main-links-2 .slide--cat-entry:hover {
    transform: translateY(-10px) scale(1.03);
    background: #0B5FAE;
    border-color: #12B3D6;
    box-shadow: 0 18px 35px rgba(0,0,0,0.35);
}

#main-links-2 .slide--cat-entry:hover h4,
#main-links-2 .slide--cat-entry:hover span {
    color: #FFFFFF;
}

#main-links-2 .slide--cat-entry:hover .bg-cover {
    border-color: #12B3D6;
    transform: scale(1.12);
}


/*********************************
   تكبير عرض السلايد نفسه
**********************************/
#main-links-2 .swiper-slide {
    height: auto !important;
}


/*********************************
   أسهم السلايدر
**********************************/
#main-links-2 .s-slider-nav-arrow {
    background: #102A43;
    border-radius: 50%;
    width: 48px;
    height: 48px;
    transition: all 0.3s ease;
}

#main-links-2 .s-slider-nav-arrow svg {
    fill: #FFFFFF;
}

#main-links-2 .s-slider-nav-arrow:hover {
    background: #12B3D6;
}


/*********************************
   النقاط السفلية (إن وجدت)
**********************************/
#main-links-2 .swiper-pagination-bullet {
    background: #6C8AA6;
    opacity: 1;
}

#main-links-2 .swiper-pagination-bullet-active {
    background: #12B3D6;
}

/* ==============================
   FOOTER (نفس الألوان السابقة)
============================== */

/* خلفية الفوتر الأساسية */
.store-footer{
  background: linear-gradient(180deg, #0B1C2D 0%, #081520 100%);
  color:#FFFFFF;
  font-size:15px;
  line-height:1.85;
}

.store-footer a{
  color:#E6F7FF;
  text-decoration:none;
  transition:.25s ease;
}

.store-footer a:hover{
  color:#12B3D6;
}

/* الجزء العلوي */
.store-footer__top{
  padding:60px 0 45px;
  border-bottom:1px solid rgba(255,255,255,0.06);
}

/* شريط التطبيقات (كان bg-gray-100) - نخليه متناغم مع نفس الألوان */
.store-footer .bg-gray-100{
  background: rgba(255,255,255,0.05) !important;
}
.store-footer .-mt-11{
  margin-top:-44px;
}

/* الوصف */
.store-footer blockquote{
  color:#FFFFFF;
  line-height:1.9;
  font-size:14px;
  border-right:3px solid #12B3D6;
  padding-right:12px;
  margin:0;
}

/* عناوين الأعمدة */
.footer-title,
.s-contacts-title{
  font-size:17px;
  font-weight:700;
  margin-bottom:18px;
  color:#FFFFFF;
  position:relative;
}

.footer-title::after,
.s-contacts-title::after{
  content:"";
  position:absolute;
  bottom:-8px;
  right:0;
  width:35px;
  height:3px;
  background:#12B3D6;
  border-radius:3px;
}

/* روابط القوائم */
.s-menu-footer-item{
  display:block;
  margin-bottom:10px;
  color:#CFEAF6;
  font-size:14px;
  transition:.25s ease;
}

/* RTL/LTR ذكي */
html[dir="rtl"] .s-menu-footer-item:hover{ transform: translateX(3px); }
html[dir="ltr"] .s-menu-footer-item:hover{ transform: translateX(-3px); }

.s-menu-footer-item:hover{
  color:#12B3D6;
}

/* قسم التواصل */
.s-contacts-item{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:12px;
  font-size:14px;
  color:#D6EAF3;
  transition:.25s ease;
}

.s-contacts-item:hover{
  color:#12B3D6;
}

/* خلي svg يرث اللون (مهم لأيقونة X) */
.s-contacts-icon{ color:#12B3D6; }
.s-contacts-icon svg{
  width:18px;
  height:18px;
  fill: currentColor;
}

/* السوشال */
.s-social-list{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.s-social-link a{
  width:38px;
  height:38px;
  background: rgba(255,255,255,0.06);
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  transition:.25s ease;
  color:#fff;
}

.s-social-link a:hover{
  background:#12B3D6;
  transform: translateY(-3px);
}

.s-social-icon svg{
  width:18px;
  height:18px;
  fill: currentColor;
}

/* الجزء السفلي الداكن (نفس لونك السابق) */
.store-footer .bg-darker{
  background:#0d4062 !important;
  border-top:1px solid rgba(255,255,255,0.06);
}

.store-footer .bg-darker p{
  color:#A9C7D6;
}

.store-footer .bg-darker a{
  color:#12B3D6;
}

/* وسائل الدفع */
.s-payments-list-item{
  background: rgb(255 251 255);
  padding:6px;
  border-radius:6px;
  transition:.25s ease;
}

.s-payments-list-item:hover{
  background: rgba(18,179,214,0.15);
  transform: translateY(-2px);
}

/* استجابة الجوال */
@media (max-width:768px){
  .store-footer__top{ text-align:center; }

  .footer-title::after,
  .s-contacts-title::after{
    right:50%;
    transform: translateX(50%);
  }

  .s-social-list{ justify-content:center; }

  .s-contacts-item{ justify-content:center; }

  /* تصحيح عرض وصف الشعار لو كان ضيق */
  .store-footer .max-w-\[75\%\]{ max-width:100% !important; }
}


/*********************************
    خلفية القسم
**********************************/
.s-block--brands-grid {
    background: linear-gradient(180deg, #0F2B46 0%, #0A1F33 100%);
    padding: 70px 0;
}


/*********************************
    عنوان القسم
**********************************/
.s-block--brands-grid h2 {
    color: #FFFFFF;
    font-size: 28px;
    font-weight: 700;
}

.s-block--brands-grid .s-block__display-all {
    color: #12B3D6;
    font-weight: 600;
}

.s-block--brands-grid .s-block__display-all:hover {
    color: #ffffff;
}


/*********************************
    كروت الشعارات
**********************************/
.brand-item {
    background: #ffffff;;
    border-radius: 14px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 110px;
    transition: all 0.35s ease;
    border: 1px solid rgba(255,255,255,0.05);
}


/* الشعار واضح بدون أي فلاتر */
.brand-item img {
    max-height: 60px;
    width: auto;
    object-fit: contain;
    filter: none !important;
    opacity: 1 !important;
    transition: transform 0.3s ease;
}


/*********************************
    تأثير Hover (بدون التأثير على الشعار نفسه)
**********************************/
.brand-item:hover {
    transform: translateY(-6px);
    background: #0B5FAE;
    border-color: #12B3D6;
    box-shadow: 0 10px 25px rgba(0,0,0,0.25);
}

.brand-item:hover img {
    transform: scale(1.05);
}


/*********************************
    استجابة الشاشات
**********************************/
@media (max-width: 992px) {
    .brand-item {
        height: 95px;
        padding: 15px;
    }

    .brand-item img {
        max-height: 48px;
    }
}

@media (max-width: 576px) {
    .s-block--brands-grid {
        padding: 50px 0;
    }

    .s-block--brands-grid h2 {
        font-size: 22px;
        text-align: center;
        width: 100%;
    }

    .s-block--brands-grid .s-block__title {
        flex-direction: column;
        gap: 10px;
    }

    .brand-item {
        height: 85px;
    }

    .brand-item img {
        max-height: 42px;
    }
}
/* ===== عنوان القسم في المنتصف ===== */
.s-block--faqs .s-block__title {
    text-align: center;
    margin-bottom: 40px;
}

.s-block--faqs .s-block__title h2 {
    font-size: 32px;
    font-weight: 700;
    color: #1f2937; /* غامق أنيق */
}

/* ===== شكل كرت السؤال ===== */
.faqs-list__item {
    border-radius: 14px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.05);
    border: 1px solid #eee;
    margin-bottom: 18px;
    transition: all 0.3s ease;
    overflow: hidden;
}

/* تأثير عند المرور */
.faqs-list__item:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
}

/* ===== عنوان السؤال ===== */
.faqs-list__item label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 18px 22px;
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    color: #111827;
}

/* لون عند فتح السؤال */
.faqs-list input:checked + .faqs-list__item label {
    background: linear-gradient(90deg, #0ea5e9, #2563eb);
    color: #fff;
}

/* ===== أيقونة الفتح ===== */
.faq-item {
    font-size: 18px;
    transition: transform 0.3s ease;
}

/* تدوير الأيقونة عند الفتح */
.faqs-list input:checked + .faqs-list__item .faq-item {
    transform: rotate(45deg);
}

/* ===== صندوق الإجابة ===== */
.faq-answer-wrap {
    max-height: 0;
    overflow: hidden;
    transition: all 0.4s ease;
    background: #f9fafb;
}

/* عند فتح السؤال تظهر الإجابة */
.faqs-list input:checked + .faqs-list__item .faq-answer-wrap {
    max-height: 500px;
    padding: 18px 22px;
}

/* نص الإجابة */
.faq-answer p {
    margin: 0;
    color: #374151;
    line-height: 1.8;
    font-size: 15px;
}
/////////////////////////////
/* ===== شبكة المميزات ===== */
#info-blocks-2-3 {
    margin: 60px 0;
}

#info-blocks-2-3 .info-block__list {
    gap: 30px;
}

/* الكرت */
#info-blocks-2-3 .info-block {
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    transition: all 0.35s ease;
    position: relative;
    background: #fff;
}

#info-blocks-2-3 .info-block:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 40px rgba(0,0,0,0.12);
}

/* الصورة */
#info-blocks-2-3 .info-block__img img {
    width: 100%;
    height: 260px;
    object-fit: cover;
    display: block;
    transition: transform 0.5s ease;
}

#info-blocks-2-3 .info-block:hover .info-block__img img {
    transform: scale(1.06);
}

/* المحتوى */
#info-blocks-2-3 .info-block__content {
    position: absolute;
    bottom: 20px;
    right: 20px;
    left: 20px;
    text-align: center;
}

/* زر اكتشف المزيد */
#info-blocks-2-3 .info-block__content a {
    display: inline-block;
    background: linear-gradient(135deg, #12B3D6, #0B5FAE);
    color: #fff !important;
    padding: 10px 22px;
    border-radius: 30px;
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(11,95,174,0.35);
    transition: all 0.3s ease;
}

#info-blocks-2-3 .info-block__content a:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 22px rgba(11,95,174,0.45);
}
@media (max-width: 992px) {
    #info-blocks-2-3 .info-block__img img {
        height: 220px;
    }
}

@media (max-width: 576px) {
    #info-blocks-2-3 .info-block__img img {
        height: 190px;
    }

    #info-blocks-2-3 .info-block__content {
        bottom: 15px;
    }

    #info-blocks-2-3 .info-block__content a {
        padding: 8px 18px;
        font-size: 13px;
    }
}

//////////////////////////////////////////
#main-links-8 .s-slider-block__title {
    text-align: center;
    margin-bottom: 35px;
}

#main-links-8 .s-slider-block__title-right {
    width: 100%;
}

#main-links-8 .s-slider-block__title h2 {
    font-size: 30px;
    font-weight: 800;
    color: #0A1F33;
}

#main-links-8 .s-slider-block__title p {
    font-size: 16px;
    color: #5C7C92;
    margin-top: 8px;
}

#main-links-8 .slide--cat-entry {
    background: #ffffff;
    border-radius: 18px;
    padding: 28px 18px;
    text-align: center;
    transition: all 0.35s ease;
    border: 1px solid #e6eef5;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    height: 100%;
    display: block;
}

#main-links-8 .slide--cat-entry:hover {
    transform: translateY(-8px);
    box-shadow: 0 14px 30px rgba(0,0,0,0.12);
    border-color: #12B3D6;
}
#main-links-8 .slide--cat-entry .bg-cover {
    height: 110px;
    width: 110px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background-size: contain !important;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #f3f8fc;
    padding: 18px;
    transition: all 0.35s ease;
}

#main-links-8 .slide--cat-entry:hover .bg-cover {
    transform: scale(1.08);
    background-color: #e8f7fc;
}

#main-links-8 .slide--cat-entry h4 {
    font-size: 17px;
    font-weight: 700;
    color: #0A1F33;
    margin: 0;
    line-height: 1.5;
}
#main-links-8 .s-slider-nav-arrow {
    background: #0A1F33;
    border-radius: 50%;
    width: 46px;
    height: 46px;
    transition: all 0.3s ease;
}

#main-links-8 .s-slider-nav-arrow svg {
    fill: #ffffff;
}

#main-links-8 .s-slider-nav-arrow:hover {
    background: #12B3D6;
}
@media (max-width: 992px) {
    #main-links-8 .slide--cat-entry {
        padding: 22px 14px;
    }

    #main-links-8 .slide--cat-entry .bg-cover {
        width: 90px;
        height: 90px;
    }

    #main-links-8 .slide--cat-entry h4 {
        font-size: 15px;
    }
}

@media (max-width: 576px) {
    #main-links-8 .s-slider-block__title h2 {
        font-size: 22px;
    }

    #main-links-8 .s-slider-block__title p {
        font-size: 14px;
    }

    #main-links-8 .slide--cat-entry {
        padding: 18px 12px;
    }

    #main-links-8 .slide--cat-entry .bg-cover {
        width: 75px;
        height: 75px;
    }
}
///////////////////////////////
#best-offers-4-slider .s-slider-block__title {
    text-align: center;
    margin-bottom: 30px;
}

#best-offers-4-slider .s-slider-block__title h2 {
    font-size: 30px;
    font-weight: 800;
    color: #0A1F33;
}

#best-offers-4-slider .s-slider-block__display-all {
    font-weight: 600;
    color: #12B3D6;
}
#best-offers-4-slider .s-product-card-entry {
    border-radius: 18px;
    border: 1px solid #e6eef5;
    box-shadow: 0 6px 18px rgba(0,0,0,0.06);
    transition: all 0.35s ease;
    overflow: hidden;
    background: #fff;
}

#best-offers-4-slider .s-product-card-entry:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 35px rgba(0,0,0,0.12);
    border-color: #12B3D6;
}
#best-offers-4-slider .s-product-card-image {
    background: #f8fbfe;
    padding: 18px;
}

#best-offers-4-slider .s-product-card-image img {
    height: 220px;
    object-fit: contain !important;
}
#best-offers-4-slider .s-product-card-content-title a {
    font-size: 16px;
    font-weight: 700;
    color: #0A1F33;
    line-height: 1.6;
}

#best-offers-4-slider .s-product-card-price {
    font-size: 20px;
    font-weight: 800;
    color: #12B3D6;
}
#best-offers-4-slider .s-button-primary-outline {
    border-radius: 10px;
    font-weight: 700;
    transition: all 0.3s ease;
}

#best-offers-4-slider .s-button-primary-outline:hover {
    background: #12B3D6;
    color: #fff !important;
    border-color: #12B3D6;
}
#best-offers-4-slider .s-product-card-wishlist-btn {
    border-radius: 50%;
    backdrop-filter: blur(4px);
}
#best-offers-4-slider .s-slider-nav-arrow {
    background: #0A1F33;
    border-radius: 50%;
    width: 46px;
    height: 46px;
}

#best-offers-4-slider .s-slider-nav-arrow svg {
    fill: #fff;
}

#best-offers-4-slider .s-slider-nav-arrow:hover {
    background: #12B3D6;
}
@media (max-width: 992px) {
    #best-offers-4-slider .s-product-card-image img {
        height: 180px;
    }

    #best-offers-4-slider .s-product-card-content-title a {
        font-size: 14px;
    }

    #best-offers-4-slider .s-product-card-price {
        font-size: 18px;
    }
}

@media (max-width: 576px) {
    #best-offers-4-slider .s-product-card-image img {
        height: 150px;
    }

    #best-offers-4-slider .s-product-card-entry {
        border-radius: 14px;
    }
}
/////////////////////////////////////
/* إطار البنر */
.s-block--fixed-banner .banner--fixed {
    display: block;
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.08);
    transition: all 0.4s ease;
}

/* حركة عند المرور */
.s-block--fixed-banner .banner--fixed:hover {
    transform: translateY(-6px);
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.15);
}
.s-block--fixed-banner .banner--fixed img {
    width: 100%;
    height: auto !important;
    object-fit: contain !important; /* أهم سطر لمنع القص */
    display: block;
}
.s-block--fixed-banner .banner--fixed {
    background: linear-gradient(135deg, #f3f8fc, #eef5fa);
    padding: 10px;
}
@media (max-width: 768px) {
    .s-block--fixed-banner .banner--fixed {
        border-radius: 16px;
        padding: 6px;
    }
}
////////////////////////////////////////////
/* عنوان القسم */
.s-block--special-products .s-block__title h2 {
    font-size: 28px;
    font-weight: 800;
    color: #111;
    margin-bottom: 10px;
}
.s-block--special-products .tab-trigger .s-button-element {
    border-radius: 30px;
    padding: 8px 18px;
    font-weight: 700;
}

.s-block--special-products .tab-trigger.is-active .s-button-element {
    background: linear-gradient(135deg, #0d6efd, #0a58ca);
    color: #fff;
    box-shadow: 0 6px 18px rgba(13,110,253,0.25);
}
.s-product-card-special {
    border-radius: 22px;
    overflow: hidden;
    box-shadow: 0 15px 40px rgba(0,0,0,0.08);
    transition: all 0.4s ease;
}

.s-product-card-special:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

/* صورة المنتج */
 .s-product-card-special .s-product-card-image img {
    object-fit: contain;
    padding: 20px;
} 
.s-product-card-horizontal {
    border-radius: 18px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    transition: all 0.3s ease;
}

.s-product-card-horizontal:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0,0,0,0.12);
}
.s-product-card-price {
    font-size: 20px;
    font-weight: 800;
    color: #0d6efd;
}
.s-product-card-entry .s-button-outline {
    border-radius: 30px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.s-product-card-entry .s-button-outline:hover {
    background: #0d6efd;
    color: #fff;
    border-color: #0d6efd;
}
.s-product-card-promotion-title {
    background: linear-gradient(135deg, #ff7a00, #ffb347);
    color: #fff;
    font-weight: 700;
    border-radius: 0 0 12px 12px;
    padding: 6px 14px;
}
@media (max-width: 768px) {
    .s-block--special-products .grid {
        gap: 20px;
    }

    .s-product-card-special {
        margin-bottom: 10px;
    }

    .s-product-card-price {
        font-size: 18px;
    }
}
///////////////////////////////////////////
.s-block.container > .s-block__title {
    margin-bottom: 25px;
    text-align: center;
}

.s-block.container > .s-block__title h2 {
    font-size: 30px;
    font-weight: 800;
    color: #111;
    position: relative;
    display: inline-block;
}

.s-block.container > .s-block__title h2::after {
    content: "";
    display: block;
    width: 60%;
    height: 3px;
    background: linear-gradient(90deg, #0d6efd, #00c6ff);
    margin: 10px auto 0;
    border-radius: 3px;
}
.s-product-card-entry {
    border-radius: 20px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,0.07);
    transition: all 0.35s ease;
    padding: 12px;
}

.s-product-card-entry:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 45px rgba(0,0,0,0.12);
}
.s-product-card-image {
    background: #f8f9fb;
    border-radius: 16px;
    padding: 18px;
}

.s-product-card-image img {
    object-fit: contain;
    height: 180px;
    width: 100%;
}
.s-product-card-promotion-title {
    background: linear-gradient(135deg, #ff7a00, #ffb347);
    color: #fff;
    font-weight: 700;
    border-radius: 0 0 12px 12px;
    padding: 6px 14px;
    font-size: 13px;
}
.s-product-card-content-title a {
    font-weight: 700;
    color: #222;
    line-height: 1.6;
    min-height: 48px;
    display: block;
}

.s-product-card-content-title a:hover {
    color: #0d6efd;
}
.s-product-card-content-subtitle {
    font-size: 13px;
    color: #666;
    margin-bottom: 6px;
}
.s-product-card-price {
    font-size: 20px;
    font-weight: 800;
    color: #0d6efd;
}
.s-product-card-content-footer .s-button-element {
    border-radius: 30px;
    font-weight: 700;
    transition: all 0.3s ease;
}

.s-product-card-content-footer .s-button-element:hover {
    background: #0d6efd;
    color: #fff;
    border-color: #0d6efd;
}
.s-product-card-wishlist-btn .s-button-element {
    border-radius: 50%;
    backdrop-filter: blur(6px);
}
@media (max-width: 768px) {
    .s-product-card-image img {
        height: 150px;
    }

    .s-product-card-price {
        font-size: 18px;
    }

    .s-product-card-content-title a {
        font-size: 14px;
    }
}
////////////////////////
/* =========================
   شريط إعلان متحرك بدون تأثير على الصفحة
========================= */
/* ====== Seamless Advertisement Loop (Closed Ring) ====== */
salla-advertisement,
salla-advertisement .s-advertisement{
  display:block;
  height:46px !important;
  overflow:hidden !important;
  max-width:100% !important;
}

salla-advertisement .s-advertisement-content{
  height:46px;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden !important;
  max-width:100% !important;
  padding:0 44px 0 12px; /* مساحة زر الإغلاق */
}

/* زر الإغلاق ثابت */
salla-advertisement .s-advertisement-action{
  position:absolute !important;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  z-index:5;
  background:transparent !important;
}

/* حاوية القص */
salla-advertisement .ad-marquee{
  width:100%;
  overflow:hidden;
}

/* المسار (سير) عرضه 200% لأنه يحتوي نسختين متطابقتين */
salla-advertisement .ad-track{
  display:flex;
  width:200%;
  will-change:transform;
  animation: ad-seamless 12s linear infinite; /* غيّر السرعة هنا */
}

/* كل نصف (نسخة) */
salla-advertisement .ad-track-half{
  display:flex;
  align-items:center;
  gap:48px;
  white-space:nowrap;
  width:50%;
}

/* العناصر */
salla-advertisement .ad-item{
  display:flex;
  align-items:center;
  gap:10px;
  white-space:nowrap;
  font-size:14px;
}

salla-advertisement .ad-item,
salla-advertisement .ad-item a{
  color: inherit !important;
  text-decoration:none;
}

salla-advertisement .ad-item i,
salla-advertisement .ad-item svg{
  color: inherit !important;
  fill: currentColor !important;
}

/* الحركة: من 0 إلى -50% = انتقال من نصف إلى نصف (حلقة مغلقة) */
@keyframes ad-seamless{
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

/* إيقاف عند المرور */
salla-advertisement:hover .ad-track{
  animation-play-state: paused;
}

/* تقليل الحركة */
@media (prefers-reduced-motion: reduce){
  salla-advertisement .ad-track{ animation:none !important; }
}