/* NAJ – Native Luxury Design */

:root {
  --naj-black: #080808;
  --naj-white: #ffffff;
}

/* الهيدر الشفاف */
body.index .store-header {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  z-index: 100;
}

body.index .store-header .top-navbar {
  display: none !important;
}

body.index #mainnav {
  box-shadow: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.28);
  transition: background 0.3s ease;
}

body.index #mainnav:not(.fixed-header) {
  background: transparent !important;
}

body.index #mainnav.fixed-header {
  background: rgba(8, 8, 8, 0.95) !important;
}

body.index #mainnav .container > .flex {
  position: relative;
  min-height: 92px;
  align-items: center;
}

/* الشعار في المنتصف */
body.index #mainnav .navbar-brand {
  position: absolute !important;
  left: 50%;
  top: 50%;
  z-index: 5;
  margin: 0 !important;
  transform: translate(-50%, -50%);
}

body.index #mainnav .navbar-brand img {
  width: auto !important;
  height: 46px !important;
  max-width: 145px !important;
  object-fit: contain;
  filter: grayscale(1) brightness(0) invert(1);
}

/* إخفاء القوائم الكبيرة وإظهار زر القائمة */
body.index #mainnav custom-main-menu {
  display: none !important;
}

body.index #mainnav .mburger {
  display: flex !important;
  align-items: center;
  margin: 0 !important;
}

/* أيقونات الهيدر */
body.index #mainnav:not(.fixed-header) .sicon-menu,
body.index #mainnav:not(.fixed-header) .s-user-menu-login-btn,
body.index #mainnav:not(.fixed-header) .s-cart-summary-wrapper,
body.index #mainnav:not(.fixed-header) .s-cart-summary-icon {
  color: #fff !important;
}

body.index #mainnav .sicon-menu {
  font-size: 27px !important;
}

body.index #mainnav .s-user-menu-login-btn svg,
body.index #mainnav .s-cart-summary-wrapper svg {
  color: currentColor !important;
  width: 27px !important;
  height: 27px !important;
}

body.index #mainnav .s-cart-summary-content {
  display: none !important;
}

body.index #mainnav .s-cart-summary-count {
  min-width: 18px !important;
  height: 18px !important;
  padding: 1px 5px !important;
  background: #fff !important;
  color: #111 !important;
  font-size: 10px !important;
  border-radius: 20px !important;
}

/* البنر الرئيسي */
body.index #main-content > .s-block--fixed-banner.wide-placeholder {
  margin: 0 !important;
  padding: 0 !important;
}

body.index #main-content > .s-block--fixed-banner.wide-placeholder .container {
  width: 100% !important;
  max-width: none !important;
  padding: 0 !important;
}

body.index #main-content > .s-block--fixed-banner .banner {
  position: relative !important;
  display: block !important;
  height: 100svh !important;
  min-height: 680px !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: var(--naj-black) !important;
}

body.index #main-content > .s-block--fixed-banner .banner picture {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
}

body.index #main-content > .s-block--fixed-banner .banner img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: brightness(0.72);
}

/* عنوان البنر */
body.index #main-content > .s-block--fixed-banner .banner::before {
  content: "أناقة تنسجم معك";
  position: absolute;
  top: 47%;
  left: 50%;
  z-index: 4;
  width: 90%;
  color: #fff;
  font-size: clamp(42px, 5vw, 70px);
  font-weight: 400;
  line-height: 1.2;
  text-align: center;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* وصف البنر */
body.index #main-content > .s-block--fixed-banner .banner::after {
  content: "عبايات مصممة بتفاصيل راقية لكل مناسبة";
  position: absolute;
  top: 59%;
  left: 50%;
  z-index: 4;
  width: 85%;
  color: rgba(255, 255, 255, 0.92);
  font-size: 18px;
  font-weight: 300;
  text-align: center;
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* زر تسوقي الآن */
body.index #main-content > .s-block--fixed-banner .banner picture::after {
  content: "تسوقي الآن";
  position: absolute;
  top: 69%;
  left: 50%;
  z-index: 5;
  padding: 12px 32px;
  color: #fff;
  font-size: 15px;
  border: 1px solid rgba(255, 255, 255, 0.9);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

/* أقسام المنتجات */
body.index .s-block:has(salla-products-slider) {
  margin: 0 !important;
  padding: 62px 0 34px !important;
  background: #fff !important;
}

body.index .s-block:has(salla-products-slider)
+ .s-block:has(salla-products-slider) {
  padding-top: 42px !important;
  border-top: 1px solid #eee;
}

body.index .s-block:has(salla-products-slider) .s-slider-block__title,
body.index .s-block:has(salla-products-slider) .s-block__title {
  justify-content: center !important;
  margin-bottom: 30px !important;
  text-align: center !important;
}

body.index .s-block:has(salla-products-slider) .s-slider-block__title-right {
  width: 100% !important;
  text-align: center !important;
}

body.index .s-block:has(salla-products-slider) h2 {
  margin: 0 !important;
  color: #151515 !important;
  font-size: 20px !important;
  font-weight: 400 !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase;
}

body.index .s-block:has(salla-products-slider) .s-block__display-all,
body.index .s-block:has(salla-products-slider) .s-product-card-wishlist-btn,
body.index .s-block:has(salla-products-slider) .s-product-card-content-footer {
  display: none !important;
}

body.index .s-block:has(salla-products-slider) .s-product-card-entry {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

body.index .s-block:has(salla-products-slider) .s-product-card-image {
  height: auto !important;
  aspect-ratio: 3 / 4 !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  background: #f3f3f1 !important;
}

body.index .s-block:has(salla-products-slider) .s-product-card-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0 !important;
}

body.index .s-block:has(salla-products-slider) .s-product-card-content {
  min-height: 0 !important;
  padding: 13px 0 0 !important;
}

body.index .s-block:has(salla-products-slider) .s-product-card-content-title {
  margin: 0 0 5px !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}

body.index .s-block:has(salla-products-slider) .s-product-card-price {
  color: #202020 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

@media (min-width: 1024px) {
  body.index .s-block:has(salla-products-slider) .swiper-slide {
    width: calc(25% - 18px) !important;
  }
}

@media (max-width: 767px) {
  body.index #mainnav .container {
    padding-right: 17px !important;
    padding-left: 17px !important;
  }

  body.index #mainnav .container > .flex {
    min-height: 82px !important;
  }

  body.index #mainnav .navbar-brand img {
    height: 38px !important;
    max-width: 118px !important;
  }

  body.index #main-content > .s-block--fixed-banner .banner {
    min-height: 700px !important;
  }

  body.index #main-content > .s-block--fixed-banner .banner::before {
    top: 44%;
    width: 88%;
    font-size: 37px;
    line-height: 1.25;
  }

  body.index #main-content > .s-block--fixed-banner .banner::after {
    top: 57%;
    width: 82%;
    font-size: 15px;
    line-height: 1.7;
  }

  body.index #main-content > .s-block--fixed-banner .banner picture::after {
    top: 67%;
    padding: 10px 25px;
    font-size: 14px;
  }

  body.index .s-block:has(salla-products-slider) {
    padding: 45px 0 24px !important;
  }

  body.index .s-block:has(salla-products-slider) .container {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }

  body.index .s-block:has(salla-products-slider) h2 {
    font-size: 17px !important;
    letter-spacing: 0.11em !important;
  }

  body.index .s-block:has(salla-products-slider) .swiper-slide {
    width: calc(50% - 7px) !important;
  }

  body.index .s-block:has(salla-products-slider) .s-slider-nav-arrow {
    display: none !important;
  }

  body.index .s-block:has(salla-products-slider) .s-product-card-content-title {
    font-size: 12.5px !important;
  }

  body.index .s-block:has(salla-products-slider) .s-product-card-price {
    font-size: 12px !important;
  }
}

/* English hero text – Rianesa style */

body.index #main-content > .s-block--fixed-banner .banner::before {
  content: "Luxury in Every Detail";
  width: 90%;
  max-width: 800px;
  font-family: PingARLT, -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 60px;
  font-weight: 700;
  line-height: 1;
  direction: ltr;
}

body.index #main-content > .s-block--fixed-banner .banner::after {
  content: "Elevate Your Wardrobe with Elegant Abayas Made for Every Occasion";
  width: 85%;
  max-width: 650px;
  font-family: PingARLT, -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 20px;
  font-weight: 400;
  line-height: 1.4;
  direction: ltr;
}

body.index #main-content > .s-block--fixed-banner .banner picture::after {
  content: "SHOP NOW";
  font-family: PingARLT, -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: 15px;
  font-weight: 400;
  direction: ltr;
}

@media (max-width: 767px) {
  body.index #main-content > .s-block--fixed-banner .banner::before {
    width: 88%;
    font-size: 42px;
    line-height: 1.08;
  }

  body.index #main-content > .s-block--fixed-banner .banner::after {
    width: 82%;
    font-size: 17px;
    line-height: 1.5;
  }
}

/* NAJ - White header icons */
body.index #mainnav .s-user-menu-login-btn,
body.index #mainnav .s-cart-summary-wrapper,
body.index #mainnav .header-btn__icon,
body.index #mainnav .s-cart-summary-icon,
body.index #mainnav .sicon-menu {
  color: #fff !important;
}

body.index #mainnav .s-user-menu-login-btn svg path,
body.index #mainnav .s-cart-summary-icon svg path {
  fill: #fff !important;
}