/* Loading Screen */

.index:before {
    content: "";
    width: 100%;
    height: 100%;
    background:#f2f2f2 url(https://cdn.salla.sa/form-builder/vuFV2eA7mehkwkwSGtqyeilCuQOuHYNkNpPAdwUg.png) ;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 9 !important;
    background-size: 250px !important;
    background-repeat: no-repeat;
    background-position: center !important;
    animation-name: logobg;
    animation-duration: 3s;
    animation-fill-mode: forwards;
}

@keyframes logobg {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        visibility: hidden;
    }
}

body {
  background-color: #f2f2f2 !important;
}

.top-navbar,
#mainnav,
.inner,
.sub-menu {
  background-color: #e2e0e0 !important;
}

#mainnav i {
  border: unset !important;
}

.sicon-shopping-bag:before {
  content: "\ef39" !important;
}

.sicon-user-circle:before {
  content: "\f078";
}

@media (min-width: 992px) {
  .s-slider-block__title h2,
  h1.s-reviews-header,
  .s-block--features:before,
  h2.faq-h {
    font-size: 48px !important;
  }
  .s-slider-block__display-all {
    font-size: 32px !important;
  }

  /* Features */
  .s-block--features .md\:grid-cols-\[repeat\(3\2c minmax\(0\2c 1fr\)\)\] {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-rows: repeat(2, 1fr);
  }
  .s-block--features__item:nth-of-type(1) {
    grid-row: 1/2;
    grid-column: 1/2;
  }
  .s-block--features__item:nth-of-type(2) {
    grid-row: 2/3;
    grid-column: 2/3;
  }
  .s-block--features__item:nth-of-type(3) {
    grid-row: 1/2;
    grid-column: 3/4;
  }
  .s-block--features__item h2 {
    font-size: 24px !important;
    font-weight: bold !important;
  }
  .s-block--features__item p {
    font-size: 20px !important;
  }
  .s-block--features__item {
    justify-content: center;
    gap: 2rem;
    box-shadow: 0px 4px 4px 0px #00000040;
    max-width: 360px !important;
    height: 360px !important;
    border-radius: 60px !important;
  }
  .s-block--features:before {

    transform: translateY(200px);
 
}
}

.s-block--features__item .feature-icon {
  background-color: transparent;
}

.s-block--features__item .feature-icon i {
  color: #000;
  font-size: 2.875rem;
}

.s-block--features:before {
    content: "مميزات متجرنا";
    text-align: center;
    font-size: 2rem;
    font-weight: 700;
        transform: translateY(-20px);

    width: 100%;
    display: block;
}

/* Carousel */

.s-block:nth-of-type(1) {
  margin-top: 0 !important;
}

.s-block--photos-slider .s-slider-block__title-nav {
  display: none !important;
}

.s-block--photos-slider * {
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

.s-block--photos-slider .swiper-slide {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

/* Products */
 .s-product-card-entry {
  background-color: #fff!important;
}

.s-product-card-image {
  background-color: #fff !important;
}

.s-product-card-entry:hover img {
  scale: 1.2;
}

.s-product-card-entry img {
  transition: all 0.3s;
}

.slider-bannars-moving h2,
.s-product-card-content-title {
  text-align: center !important;
}

.s-product-card-content-sub {
  justify-content: center;
}

.s-product-card-content-title a {
  color: #000 !important;
}
@media(min-width:992px){
.s-product-card-content {
  flex-direction: row;
  flex-wrap: wrap;
}

.s-product-card-content-main {
  width: 100% !important;
}

.s-product-card-content-footer {
  width: 65% !important;
}

.s-product-card-content-sub {
  width: 30% !important;
  order: 3;
}
.s-product-card-content-sub {
  margin-bottom: 0;
}
}
@media (min-width: 768px) {
  .s-product-card-vertical
    .s-product-card-wishlist-btn:where([dir="rtl"], [dir="rtl"] *) {
    right: 0.5rem;
    left: auto !important;
  }
}

body:not(body.product-single)
  .s-button-element:not(.s-product-card-wishlist-btn) {
  background: var(--color-primary);
  color: #fff !important;
  border-radius: 3rem;
  width: 100% !important;
}

.s-product-card-vertical .s-product-card-wishlist-btn button {
  background-color: var(--color-primary) !important;
}

.s-product-card-vertical .s-product-card-wishlist-btn button .sicon-heart {
  color: #fff !important;
}

@media (max-width: 600px) {
  .s-products-slider-card {
    width: 55%;
  }
}

/* Transparent Banner */
.banner-entry,
.banner--fixed img {
  background-color: transparent !important;
}

/* Reviews */

.s-reviews-container .swiper-slide-active .s-reviews-testimonial__inner,
.s-reviews-testimonial__name_wrapper {
  flex-direction: column;
  gap: 1rem !important;
  justify-content: center;
  align-items: center;
}
.s-reviews-testimonial__text {
  flex-direction: column-reverse;
  display: flex;
}

.s-reviews-header {
    font-size: 2.125rem;
}

.s-reviews-testimonial__info h2 {
  font-size: 1.5rem;
  line-height: 1.5rem;
}

h1.s-reviews-header:after {
  content: "افضل متجر في السعودية";
  display: block;
  margin-top: 1.25rem;
  font-size: 20px;
  text-align: center;
}

.s-reviews-header-wrapper {
  display: flex;
  justify-content: center;
  margin-bottom: 2rem;
}

.store-footer,
.store-footer__inner {
  background-color: #101010 !important;
}

.store-footer__inner {
  background-image: url(https://cdn.salla.sa/form-builder/BAFWO0AyC7tY5a8IhPQVUlkv3Shdqq0KAytUS1y6.png);
  background-position: top left;
  background-repeat: no-repeat;
}

@media (max-width: 768px) {
  .store-footer__inner {
    background-size: 200px;
    background-position: left bottom;
  }
}

.copyright-text p {
  color: #fff !important;
}

section.s-block.s-block--testimonials.s-block--custom-testimonials.container.overflow-hidden:before {
    content: "";
    display: block;
    width: 100%;
    height: 151px;
    background-image: url(https://i.ibb.co/TMT41CV6/Group-1618875225.png);
    background-size: 100% 100%;
    background-repeat: no-repeat;
}

/* FAQ */
.faq-section{
margin-block:2rem
}


.faq {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  direction: rtl; /* Arabic alignment */
}

.faq-item {
  background: #f7f7f7;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.faq-question h3:before{
content: url(https://i.ibb.co/hRw0b1pN/image-1-1.png)
}

p.faq-p,
h2.faq-h {
    text-align: center;
    font-weight:700;
    line-height:1.5
}

p.faq-p{
margin-bottom:2rem;
font-size:1.5rem
}
h2.faq-h{
font-size:2rem

}

.faq-question h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
}

.faq-answer {
  margin-top: 10px;
}



.faq-answer p {
  margin: 0;
  font-size: 15px;
  color: #444;
  line-height: 1.6;
}



.faq-item {
  background: #f7f7f7;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  overflow: hidden;
  transition: all 0.3s ease;
}



.faq-question .icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background: #000;
  color: #fff;
  font-weight: bold;
  border-radius: 50%;
  font-size: 28px;
  flex-shrink: 0;
}

.faq-question h3 {
  margin: 0;
  font-size: 18px;
  font-weight: 600;
  display: flex;
  gap: 1rem;
  align-items: center;
}

.faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease, opacity 0.4s ease;
  opacity: 0;
}

.faq-answer p {
  margin: 10px 0 0;
  font-size: 15px;
  color: #444;
  line-height: 1.6;
}

.faq-item.active .faq-answer {
  max-height: 300px;
  opacity: 1;
}

@media(max-width:768px){

.faq {
    grid-template-columns: repeat(1, 1fr);
}

}

.logo-slider:before {
  content: "يوجد لدينا وسائل دفع متعددة";
  text-align: center;
  font-size: 1.5rem;
  font-weight: 900;
  width: 100%;
  display: block;
  margin-bottom: 3rem;
}

.logo-slider {
  margin-block: 4rem;
  overflow: hidden;
  width: 100%;
  padding: 10px 0;
}

.logo-track {
  display: flex;
  width: max-content;
  animation: scroll 20s linear infinite; /* add duration */
}

.logo-track img {
  height: 60px;
  margin: 0 20px; /* adjust spacing */
  flex-shrink: 0;
}

@keyframes scroll {
  from {
    transform: translateX(1000px);
  }
  to {
    transform: translateX(0px);
  }
}