/* =========================================================
   Variables
========================================================= */
:root {
  --main-color: #cda944;
  --white-color: #ffffff;
  --black-color: #000000;
}

/* =========================================================
   Global
========================================================= */
body {
  background-color: var(--white-color);
}

/* =========================================================
   Header / Nav
========================================================= */
/* علشان الـ transform يشتغل صح */
.main-menu li.root-level > a {
  display: inline-block;
}

.main-menu li.root-level > a:hover {
  transform: translateY(-3px);
}

/* أيقونات الهيدر */
.topnav-link-item i,
.sicon-shopping-bag:before,
b.s-cart-summary-total,
i.sicon-search,
button.lg\:hidden.mburger.mburger--collapse {
  color: var(--main-color);
}

/* =========================================================
   Photos Slider (Top Slider)
========================================================= */
section.s-block.s-block--photos-slider {
  margin-top: 0 !important;
}

section.s-block.s-block--photos-slider salla-slider.photos-slider .swiper-slide {
  width: 100% !important;
  padding: 0 !important;
  margin-top: 0 !important;
  border-radius: 0 !important;
}

[dir="rtl"] section.s-block.s-block--photos-slider salla-slider.photos-slider .swiper {
  padding: 0 !important;
}

img.w-full {
  border-radius: 0;
}

/* =========================================================
   Product Cards / Sliders
========================================================= */
.s-product-card-image img.loaded {
  background: #fff;
}

/* اخفاء الأسهم لو متعطلة */
button.s-slider-next.s-slider-nav-arrow.swiper-button-disabled.swiper-button-lock,
button.s-slider-prev.s-slider-nav-arrow.swiper-button-disabled.swiper-button-lock {
  display: none;
}

.s-products-slider-card.swiper-slide {
  margin: 10px 0;
  padding-top: 20px;
  transition: transform 0.3s ease;
}

.s-products-slider-card.swiper-slide:hover {
  transform: translateY(-7px);
}

.s-product-card-entry {
  box-shadow: 0 0 10px 0 #87816e30;
}

.s-product-card-content {
  background: #f5f5f5;
}

/* =========================================================
   Banners
========================================================= */
.banner--fixed img {
  border-radius: 0;
  background-color: transparent;
}

.banner-entry {
  background: #fff;
}

.s-block--fixed-banner.wide-placeholder > .container {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* =========================================================
   Buttons
========================================================= */
button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center {
  color: #fff;
  background: var(--main-color) !important;
  transition: ease-out 0.5s;
  box-shadow: inset 0 0 0 0 #fff;
}

button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center:hover {
  color: var(--main-color) !important;
  box-shadow: inset 0 -100px 0 0 #fff;
}

button.s-button-element.s-button-btn.s-button-outline.s-button-wide.s-button-primary-outline.s-button-loader-center:active {
  transform: scale(0.9);
}

/* =========================================================
   Section Titles
========================================================= */
.s-block__title {
  justify-content: center;
}

.s-slider-block__title-right {
  color: var(--main-color) !important;
}

.s-slider-block__title-right h2 {
  font-size: 24px;
}

/* شكل العنوان زي الصورة (خط تحت + مُعين في النص) */
.s-slider-block__title-right h2 {
  position: relative !important;
  display: inline-block !important;
  padding-bottom: 18px !important; /* مساحة للخط تحت */
}

/* تهيئة pseudo elements */
.s-slider-block__title-right h2::before,
.s-slider-block__title-right h2::after {
  content: "" !important;
  position: absolute !important;
}

/* الخط تحت العنوان */
.s-slider-block__title-right h2::after {
  left: 50% !important;
  bottom: 6px !important;
  transform: translateX(-50%) !important;
  width: 230px !important;
  height: 1px !important;
  background: var(--main-color) !important;
  opacity: 0.9 !important;
}

/* المُعين في المنتصف */
.s-slider-block__title-right h2::before {
  left: 50% !important;
  bottom: 1px !important;
  transform: translateX(-50%) rotate(45deg) !important;
  width: 10px !important;
  height: 10px !important;
  background: var(--main-color) !important;
}

/* =========================================================
   Slider Padding (General)
========================================================= */
salla-slider[type]:not(.hydrated) > div > div,
salla-slider[type]:not(.hydrated) .swiper > div > div > div,
.carousel-slider .swiper-wrapper > div {
  padding-left: 0.625rem;
  padding-right: 0.625rem;
}

/* =========================================================
   Footer
========================================================= */
/* الفوتر: خلي الخلفية بيضاء */
.store-footer {
  background: var(--white-color) !important;
}

.store-footer__inner {
  background: var(--white-color) !important;
  color: var(--black-color) !important;
}

/* لو في عناصر داخلية بتفرض لون مختلف */
.store-footer__inner * {
  color: var(--black-color) !important;
}

/* =========================================================
   Mobile
========================================================= */
@media (max-width: 767px) {
  .main-nav-container {
    min-height: 63px;
  }

  .store-footer__inner * {
    justify-content: center;
    text-align: center;
  }

  /* موبايل: خط أقصر */
  .s-slider-block__title-right h2::after {
    width: 170px !important;
  }
}