body {
  color: var(--color-two);
  /* font-weight: 600 !important; */
  background: #ffffff;
}


.typewriter {
  padding: 1rem 0;
  overflow: hidden;
  white-space: nowrap;
  animation: typing 2s steps(14)  alternate,
    blink 0.7s step-end ;
}

@keyframes typing {
  from {
    width: 0;
  }
  to {
    width: 14ch;
  } /* تعداد کاراکترهای متن */
}

@keyframes blink {
  50% {
    border-color: transparent;
  }
}

/* tab */
.tab-content__pane {
  display: none;
}
.tab-content__pane.show {
  display: block;
}

.nav-item a.active {
  background-color: var(--theme-primary-700);
  color: #ffffff;
}

.nav-item a.active img {
  filter: brightness(0) invert(1);
}

/* tab */

.slider_shop_design::after {
  position: absolute;
  inset: 0;
  content: '';
  pointer-events: none;
  opacity: 0.84;
  background: linear-gradient(
    180deg,
    hsla(0, 0%, 100%, 0) 0,
    rgba(5, 20, 34, 0.3) 60%,
    rgba(32, 35, 38, 0.38)
  );
}

.shop_slider.owl-theme .owl-dots .owl-dot span {
  width: 10;
  height: 10px;
  transition: width 0.5s ease-in-out;
  background-color: #ffffff;
}

.shop_slider.owl-theme .owl-dots .owl-dot.active span {
  width: 30px;
  height: 10px;
  transition: width 0.5s ease-in-out;
}

.moving-box {
  
  animation: movePath 20s infinite cubic-bezier(0.42, 0, 0.58, 1); /* ease-in-out نرم‌تر */
}
.-moving-box {
  
  animation: -movePath 25s infinite cubic-bezier(0.42, 0, 0.58, 1); /* ease-in-out نرم‌تر */
}

@keyframes movePath {
  0% {
    transform: translate(0px, 0px);
  }
  25% {
    transform: translate(40px, -20px); /* بالا و راست */
  }
  50% {
    transform: translate(0px, 0px); /* راست پایین‌تر */
  }
  75% {
    transform: translate(40px, 20px); /* پایین و کمی چپ */
  }
  100% {
    transform: translate(0px, 0px); /* برگشت به نقطه اول */
  }
}

@keyframes -movePath {
  0% {
    transform: translate(0px, 0px);
  }
  25% {
    transform: translate(40px, 20px); /* بالا و راست */
  }
  50% {
    transform: translate(0px, 0px); /* راست پایین‌تر */
  }
  75% {
    transform: translate(40px, -20px); /* پایین و کمی چپ */
  }
  100% {
    transform: translate(0px, 0px); /* برگشت به نقطه اول */
  }
}

.comment_body {
  box-shadow: 0px 36px 131px 0px rgba(13, 52.00000000000003, 79, 0.13);
  background-color: #ffffff8a;
}


  .h_faq .h_faq_body {
        box-shadow: none;
        border: none;
        background: transparent;
        border-radius: 0;
        padding: 0;
      }

.h_faq_li.open .h_faq_question_title {
  color: var(--theme-orange-500);
}

.backgroud_design_img {
  background-image: url(../../images/Ecommerce/home5_bg_01.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (min-width: 48rem) {
  .nav-item a.active::after {
    content: '';
    width: 0;
    height: 0;
    border-left: 17px solid rgba(0, 0, 0, 0);
    border-right: 17px solid rgba(0, 0, 0, 0);
    border-top: 18px solid;
    position: absolute;
    top: 100%;
    inset-inline-end: 50%;
    transform: translateX(-50%);
    color: var(--theme-primary-700);
    background-image: none;
  }
}


.shop_slider.owl-carousel .owl-item.center .webdesign_slide {
  transition: background-color 0.75s ease, transform 0.75s ease,
    color 0.75s ease;
  transition-delay: 0.3s;
}

.shop_slider.owl-carousel .owl-item:not(.center) .webdesign_slide {
  transform: scale(0.85);
  transition: transform 0.75s ease;
}

.webdesign_slide_img {
  background-position: top;
  background-repeat: no-repeat;
  transition: background-position 20s ease;
  background-size: cover;
  width: 100%;
  height: 100%;
}



.shop_slider .owl-item.active.center .webdesign_slide_img:hover {
  background-position: bottom;
  transition: background-position 20s ease;
}

.shop_slider.owl-carousel .owl-nav button.owl-next,
.shop_slider.owl-carousel .owl-nav button.owl-prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50);
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 9999px;
  width: 2.5rem;
  height: 2.5rem;
  display: block;
  color: #ffffff;
  font-size: 1rem;
}

.shop_slider.owl-carousel .owl-nav button.owl-next {
  inset-inline-end: -5%;
}
.shop_slider.owl-carousel .owl-nav button.owl-prev {
  inset-inline-start: -5%;
}