@import url('https://fonts.googleapis.com/css2?family=Noto+Kufi+Arabic:wght@100..900&display=swap');
body {
  font-family: "Noto+Kufi+Arabic", sans-serif;
}

/* ================== Background ================== */
body#app {
  background-color: #F5F5F5;
}

.banner--fixed img {
  background-color: transparent;
}

.lazy__bg.lazy.bg-no-repeat.entered.loaded {
  background-color: #F5F5F5;
}
/* اللون الأساسي */
.main-menu > li > a {
    color: #ffffff !important;
}

/* عند الـ hover */
.main-menu > li > a:hover {
    color: #ffffff !important;
}

/* بعد الضغط (visited) */
.main-menu > li > a:visited {
    color: #ffffff !important;
}

/* عند الضغط اللحظي */
.main-menu > li > a:active {
    color: #ffffff !important;
}

/* ================== Triple Banner ================== */
/* Desktop only */
@media (min-width: 1024px) {
  .triple-image-banner .banner-item {
    height: 380px;
  }
.slide-text-wrapper {
  margin-right: 0%;
}

#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div.lg\:col-span-2.rtl\:lg\:pl-20.ltr\:lg\:pr-20 > div.flex.flex-wrap.gap-4.items-end > img {
    width: 220px;
    height: 220px;
}
.navbar-brand img {
    max-height: 100px !important;
    max-width: 100px !important;
}
#show-long-menu {
    margin-top: -40px;
}
#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(11) {
    margin-top: -183px;
    z-index: 1;
    background-color: transparent;
}
}
.store-header .main-menu .sub-menu {
    color: #2A2E4A;
}
@media (max-width: 767px) {
  .triple-image-banner .banner-item {
    height: 300px;
  }
#app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div.lg\:col-span-2.rtl\:lg\:pl-20.ltr\:lg\:pr-20 > div.flex.flex-wrap.gap-4.items-end > img {
    width: 200px;
}
#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(11) {
    margin-top: -183px;
    z-index: 1;
    background-color: transparent;
}
}
  #app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div > div.lg\:col-span-2.rtl\:lg\:pl-20.ltr\:lg\:pr-20 > div.flex.flex-wrap.gap-4.items-end {
    align-items: center;
}
#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(22) {
    margin-top: 0px;
}
/* ================== Sections Spacing ================== */
#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(14) {
  margin-top: 10px;
}

#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(20) {
  background-color: #222B47;
    margin-top: -1px;
  padding-bottom: 30px;

}

#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(21) {
  background-color: #222B47;
  margin-top: -1px;
  padding-bottom: 40px;
}

/* ================== Section Images ================== */
#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(20) > div > a > img {
  background-color: #222B47;
}


#app > div.app-inner.flex.flex-col.min-h-full > section:nth-child(21) > div > a > img {
  background-color: transparent;
}

/* ================== Grid تعديل الأعمدة ================== */
.md\:grid-cols-3 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}



/* ================== Footer ================== */
footer.store-footer {
  margin-top: -5px;
}

/* ================== Fixed Banner ================== */

section.s-block.s-block--fixed-banner.wide-placeholder {
    background-color: #222B47;
}

/* ================== Slider Text ================== */

.lazy__bg.lazy.bg-no-repeat.entered.loaded {
    background-color: white;
}
.two-row .banner-entry:first-child {
    grid-column: span 1 / span 1; /* امتداد عمود واحد */
    grid-row: span 1 / span 2;    /* امتداد صفين */
}
.s-block__title .right-side:where([dir=rtl],[dir=rtl] *) {
  display: flex;
  justify-content: center; 
  align-items: center;     
  width: 100%;             
  text-align: center; 
}

.s-block__title .right-side:where([dir=rtl],[dir=rtl] *) h2 {
  position: relative;
  display: inline-block;
  font-size: 2rem;
  font-weight: bold;
  color: #222B47; /* لون الهوية */
  text-transform: uppercase;
  letter-spacing: 1px;
}

/* ✨ ديكور تحت العنوان بلون الهوية */
.s-block__title .right-side:where([dir=rtl],[dir=rtl] *) h2::after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 50%;
  transform: translateX(-50%);
  width: 60%;
  height: 3px;
  background: linear-gradient(90deg, transparent, #222B47, transparent);
  border-radius: 2px;
  opacity: 0.8;
}