/* AXIOS — تنسيق الهيدر | المرحلة الأولى */

.store-header {
  background-color: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid #eeeeee !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* مساحة متوازنة حول محتوى الهيدر */
.store-header .container {
  padding-top: 12px;
  padding-bottom: 12px;
}

/* روابط قائمة التنقل فقط */
.store-header nav a {
  color: #1a1a1a !important;
  font-weight: 500;
  text-decoration: none;
  transition: color 180ms ease;
}

.store-header nav a:hover,
.store-header nav a:focus-visible {
  color: #777777 !important;
}

@media (max-width: 767px) {
  .store-header .container {
    padding-top: 8px;
    padding-bottom: 8px;
  }
}

 /* ==================================
   AXIOS — تنسيق الفوتر الكامل
   ================================== */

.store-footer {
  --axios-description-size: 14px;
  background: #1a1a1a !important;
  color: #d6d6d6 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* الجزء العلوي */
.store-footer .store-footer__inner {
  background: #1a1a1a !important;
  padding-top: 40px !important;
  padding-bottom: 24px !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* العناوين */
.store-footer h2,
.store-footer h3 {
  color: #ffffff !important;
  font-weight: 600 !important;
  line-height: 1.6;
  margin-bottom: 16px !important;
}

/* النبذة فقط داخل الجزء العلوي */
.store-footer .store-footer__inner p {
  color: #c8c8c8 !important;
  font-size: var(--axios-description-size) !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  width: 100% !important;
  max-width: none !important;
}

.store-footer .store-footer__inner p strong,
.store-footer .store-footer__inner p b {
  color: inherit !important;
  font-size: inherit !important;
  font-weight: 400 !important;
}

/* الروابط */
.store-footer a {
  color: #dedede !important;
  text-decoration: none;
  transition: color 180ms ease;
}

.store-footer a:hover {
  color: #ffffff !important;
}

.store-footer a:focus-visible {
  outline: 2px solid #ffffff;
  outline-offset: 4px;
}

/* التواصل والسجل */
.store-footer salla-contacts,
.store-footer salla-contacts a,
.store-footer .store-footer__inner span {
  color: #d6d6d6 !important;
}

/* شريط الحقوق ووسائل الدفع */
.store-footer > .container {
  background: #1a1a1a !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
  margin-top: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  row-gap: 12px !important;
  border-top: 1px solid #353535 !important;
}

/* إزالة تضييق فقرة الحقوق */
.store-footer .copyright-text,
.store-footer .copyright-text p {
  color: #b5b5b5 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  width: auto !important;
  max-width: none !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  white-space: normal !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
}

.store-footer .copyright-text p {
  display: block !important;
}

/* إبقاء اسم المتجر العربي والإنجليزي معًا */
.store-footer .copyright-text a {
  display: inline-block !important;
  width: auto !important;
  max-width: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
  word-break: normal !important;
}

/* ==================================
   الجوال
   ================================== */

@media (max-width: 767px) {

  .store-footer,
  .store-footer .container,
  .store-footer .store-footer__inner {
    text-align: center !important;
  }

  .store-footer .store-footer__inner {
    padding-top: 32px !important;
  }

  /* توسيع الجوانب للنبذة */
  .store-footer .store-footer__inner .container {
    padding-inline: 16px !important;
  }

  .store-footer .store-footer__inner p {
    margin-inline: auto !important;
    padding-inline: 0 !important;
    line-height: 1.85 !important;
    text-align: center !important;
  }

  .store-footer h2,
  .store-footer h3,
  .store-footer ul,
  .store-footer li {
    text-align: center !important;
  }

  .store-footer h2,
  .store-footer h3 {
    font-size: 18px !important;
    margin-bottom: 14px !important;
  }

  /* توسيط صفوف التواصل والسجل والدفع */
  .store-footer .flex,
  .store-footer .s-contacts-item,
  .store-footer .s-social-list,
  .store-footer .s-payments-list {
    justify-content: center !important;
  }

  .store-footer salla-contacts,
  .store-footer salla-social,
  .store-footer salla-payments {
    display: block;
    margin-inline: auto !important;
    text-align: center !important;
  }

  .store-footer salla-contacts a {
    justify-content: center !important;
  }

  /* تقليل المسافة بين الخط والحقوق */
  .store-footer > .container {
    padding: 12px 16px 16px !important;
    gap: 12px !important;
    justify-content: center !important;
    align-items: center !important;
  }

  .store-footer .copyright-text {
    flex: 0 1 auto !important;
    width: 100% !important;
    text-align: center !important;
  }

  .store-footer .copyright-text p {
    text-align: center !important;
  }
}


/* تقليل الفراغ بين التواصل وحقوق النشر */
@media (max-width: 767px) {

  .store-footer .store-footer__inner {
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 16px !important;
  }

  .store-footer .store-footer__inner > .container {
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
    row-gap: 24px !important;
  }
}

/* ==================================
   AXIOS — هيدر رائد
   ================================== */
/* AXIOS — تعديل توازن هيدر الجوال */
@media (max-width: 1023px) {

  /* الصف الرئيسي */
  .store-header #mainnav > .inner > .container {
    padding-inline: 14px !important;
  }

  .store-header #mainnav > .inner > .container > .flex {
    position: relative !important;
    min-height: 72px !important;
    align-items: center !important;
  }

  /* الشعار في منتصف عرض الهيدر */
  .store-header #mainnav .navbar-brand {
    position: absolute !important;
    inset-inline-start: 50% !important;
    top: 50% !important;
    transform: translate(50%, -50%) !important;
    margin: 0 !important;
    width: 116px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* دعم اتجاه الصفحة الإنجليزي */
  html[dir="ltr"] .store-header #mainnav .navbar-brand {
    transform: translate(-50%, -50%) !important;
  }

  .store-header #mainnav .navbar-brand img {
    display: block !important;
    width: 116px !important;
    max-width: 116px !important;
    height: auto !important;
    max-height: 46px !important;
    object-fit: contain !important;
  }

  /* القائمة */
  .store-header #mainnav .mburger {
    width: 44px !important;
    min-width: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .store-header #mainnav .sicon-menu {
    font-size: 22px !important;
    color: #1a1a1a !important;
  }

  /* الحقيبة */
  .store-header #mainnav .header-btn__icon {
    width: 40px !important;
    height: 44px !important;
    font-size: 21px !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .store-header #mainnav salla-cart-summary {
    min-width: 40px !important;
    margin-inline: 0 !important;
  }

  .store-header #mainnav .s-cart-summary-count {
    min-width: 15px !important;
    height: 15px !important;
    padding: 0 3px !important;
    font-size: 9px !important;
    line-height: 15px !important;
    background: #1a1a1a !important;
    color: #fff !important;
  }

  /* البحث: خلفية خفيفة وخط سفلي */
  .store-header > .top-navbar {
    padding: 0 0 10px !important;
  }

  .store-header > .top-navbar > .container {
    padding-inline: 18px !important;
  }

  .store-header .header-search .s-search-input {
    height: 38px !important;
    min-height: 38px !important;
    border: 0 !important;
    border-bottom: 1px solid #dedede !important;
    border-radius: 0 !important;
    background: #f8f8f8 !important;
    color: #1a1a1a !important;
    font-size: 13px !important;
    box-shadow: none !important;
  }

  .store-header .header-search .s-search-input::placeholder {
    color: #777 !important;
  }
}

/* ==========================================
   AXIOS | 03 — أيقونات الهيدر
   الوظيفة: تغيير شكل الحقيبة والحساب
   النطاق: رأس الصفحة فقط
   ========================================== */

/* 03.1 — تعريف رسومات الأيقونات */
.store-header #mainnav {
  --axios-bag-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1A1A' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 7.5h14l1 13H4l1-13Z'/%3E%3Cpath d='M8.5 9V6a3.5 3.5 0 0 1 7 0v3'/%3E%3C/svg%3E");

  --axios-user-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1A1A' stroke-width='1.35' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7.5' r='3.5'/%3E%3Cpath d='M4.5 21v-2a7.5 7.5 0 0 1 15 0v2'/%3E%3C/svg%3E");
}

/* ------------------------------------------
   03.2 — استبدال رسم الحقيبة
   ------------------------------------------ */

.store-header #mainnav salla-cart-summary .header-btn__icon {
  background-color: transparent !important;
  background-image: var(--axios-bag-icon) !important;
  background-position: center !important;
  background-size: 24px 24px !important;
  background-repeat: no-repeat !important;
  border: 0 !important;
  box-shadow: none !important;
}

.store-header #mainnav salla-cart-summary .header-btn__icon::before {
  content: none !important;
}

/* ------------------------------------------
   03.3 — إزالة إطار زر الحساب
   ------------------------------------------ */

.store-header #mainnav salla-user-menu .s-user-menu-trigger {
  position: relative !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ------------------------------------------
   03.4 — استبدال رسم الحساب
   ------------------------------------------ */

.store-header #mainnav salla-user-menu .s-user-menu-trigger > * {
  visibility: hidden !important;
}

.store-header #mainnav salla-user-menu .s-user-menu-trigger::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: var(--axios-user-icon) center / 24px 24px no-repeat !important;
  border: 0 !important;
  pointer-events: none !important;
}

/* ------------------------------------------
   03.5 — توضيح التركيز بلوحة المفاتيح
   ------------------------------------------ */

.store-header #mainnav salla-user-menu .s-user-menu-trigger:focus-visible {
  outline: 2px solid #1a1a1a !important;
  outline-offset: 2px !important;
}

/* ==========================================
   نهاية AXIOS | 03 — أيقونات الهيدر
   ========================================== */

/* ==========================================
   AXIOS | 04 — عناوين أقسام الرئيسية
   الوظيفة: توسيط اسم القسم وإضافة خطوط جانبية
   وعبارة تعريفية وإخفاء رابط عرض الكل
   ========================================== */

/* 04.1 — ترتيب مساحة العنوان */
salla-products-slider.axios-brand-section .s-slider-block__title {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0 !important;
  width: 100% !important;
  margin: 0 0 26px !important;
  padding: 12px 0 0 !important;
  text-align: center !important;
}

salla-products-slider.axios-brand-section .s-slider-block__title-right {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  text-align: center !important;
}

/* ------------------------------------------
   04.2 — اسم الماركة والخطان الجانبيان
   ------------------------------------------ */

salla-products-slider.axios-brand-section .s-slider-block__title h2 {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 18px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #1a1a1a !important;
  font-size: 23px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  text-align: center !important;
}

salla-products-slider.axios-brand-section .s-slider-block__title h2::before,
salla-products-slider.axios-brand-section .s-slider-block__title h2::after {
  content: "";
  flex: 0 1 70px;
  height: 1px;
  background: #d4d4d4;
}

/* ------------------------------------------
   04.3 — العبارة أسفل اسم الماركة
   ------------------------------------------ */

salla-products-slider.axios-brand-section .axios-brand-caption {
  display: block !important;
  max-width: 340px;
  margin: 8px auto 0 !important;
  padding: 0 16px !important;
  color: #777 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.9 !important;
  text-align: center !important;
}

/* ------------------------------------------
   04.4 — إخفاء عرض الكل والوصف السابق
   ------------------------------------------ */

salla-products-slider.axios-brand-section .s-slider-block__display-all,
salla-products-slider.axios-brand-section .s-slider-block__title p:not(.axios-brand-caption) {
  display: none !important;
}

/* ------------------------------------------
   04.5 — ضبط المقاسات على الجوال
   ------------------------------------------ */

@media (max-width: 767px) {
  salla-products-slider.axios-brand-section .s-slider-block__title {
    margin-bottom: 20px !important;
  }

  salla-products-slider.axios-brand-section .s-slider-block__title h2 {
    gap: 12px !important;
    font-size: 19px !important;
  }

  salla-products-slider.axios-brand-section .s-slider-block__title h2::before,
  salla-products-slider.axios-brand-section .s-slider-block__title h2::after {
    flex-basis: 38px;
  }

  salla-products-slider.axios-brand-section .axios-brand-caption {
    font-size: 12px !important;
    margin-top: 6px !important;
  }
}

/* ==========================================
   نهاية AXIOS | 04 — عناوين أقسام الرئيسية
   ========================================== */

/* ==========================================
   AXIOS | 05 — مميزات المتجر
   الوظيفة: إزالة البطاقات والدوائر الكبيرة
   وعرض المميزات بتنسيق بسيط ومتناسق
   ========================================== */

/* 05.1 — المساحة الخارجية */
.s-block--features {
  padding-top: 28px !important;
  padding-bottom: 28px !important;
}

/* ------------------------------------------
   05.2 — توزيع المميزات
   ------------------------------------------ */

.s-block--features > .grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding-block: 24px !important;
  background: transparent !important;
  border-top: 1px solid #dedede !important;
  border-bottom: 1px solid #dedede !important;
}

/* ------------------------------------------
   05.3 — إلغاء شكل البطاقات
   ------------------------------------------ */

.s-block--features .s-block--features__item {
  display: grid !important;
  grid-template-columns: 36px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  column-gap: 14px !important;
  row-gap: 5px !important;
  align-content: center !important;
  align-items: center !important;
  grid-column: auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 12px 24px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-align: start !important;
}

.s-block--features .s-block--features__item
+ .s-block--features__item {
  border-inline-start: 1px solid #dedede !important;
}

/* ------------------------------------------
   05.4 — أيقونات صغيرة بدون دوائر
   ------------------------------------------ */

.s-block--features .feature-icon {
  grid-column: 1 !important;
  grid-row: 1 / 3 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  color: #1a1a1a !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.s-block--features .feature-icon i {
  color: #1a1a1a !important;
  font-size: 28px !important;
  line-height: 1 !important;
}

/* ------------------------------------------
   05.5 — العناوين والأوصاف
   ------------------------------------------ */

.s-block--features .s-block--features__item h2 {
  grid-column: 2 !important;
  grid-row: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #1a1a1a !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  line-height: 1.6 !important;
  text-align: start !important;
}

.s-block--features .s-block--features__item p {
  grid-column: 2 !important;
  grid-row: 2 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #777 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
  text-align: start !important;
}

/* ------------------------------------------
   05.6 — الجوال: صفوف وفواصل أفقية
   ------------------------------------------ */

@media (max-width: 767px) {
  .s-block--features {
    padding-top: 20px !important;
    padding-bottom: 20px !important;
  }

  .s-block--features > .grid {
    grid-template-columns: minmax(0, 1fr) !important;
    padding-block: 0 !important;
  }

  .s-block--features .s-block--features__item {
    padding: 20px 12px !important;
    column-gap: 16px !important;
  }

  .s-block--features .s-block--features__item
  + .s-block--features__item {
    border-inline-start: 0 !important;
    border-top: 1px solid #e5e5e5 !important;
  }
}

/* ==========================================
   نهاية AXIOS | 05 — مميزات المتجر
   ========================================== */

/* BEGIN AXIOS-BANNER-RATIO-20261019 */
@media (max-width: 1023px) {
  body.index .s-block--fixed-banner[component-id="507738358"] img {
    aspect-ratio: 3 / 1;
    height: auto;
  }
}
/* END AXIOS-BANNER-RATIO-20261019 */