/* edit numbers icon */

section.px-4.s-block.s-block--stats.container.with-animation
  > div
  > div
  > div
  > div {
  width: 4rem !important;
  height: 4rem !important;
}

section.px-4.s-block.s-block--stats.container.with-animation
  > div
  > div
  > div
  > div
  i {
  font-size: 2rem !important;
}

/* sections titles */

section.s-block.s-block--square-links.square-links-2 > div > div > h2,
.s-block--best-offers.container h2,
.s-block--faq p.tracking-tight,
.s-block--blog div.mb-8.home-block-title > h2,
.s-block.s-block--custom-reviews p.tracking-tight,
.product-single__info > h1 {
  text-transform: uppercase;
  background-image: linear-gradient(
    -225deg,
    #c13c3e 0%,
    #872527 29%,
    #843a3b 67%,
    #90181a 100%
  );
  background-size: auto auto;
  background-clip: border-box;
  background-size: 200% auto;
  color: #fff;
  background-clip: text;
  /* text-fill-color: transparent; */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: textclip 5s linear infinite;
  display: inline-block;
  font-weight: 800;
  line-height: 3.5rem;
}
@keyframes textclip {
  to {
    background-position: 200% center;
  }
}

/* img prduct animation  */

@keyframes animate {
  0% {
    transform: translate(0px, 0px);
  }
  25% {
    transform: translate(3px, -3px);
  }
  50% {
    transform: translate(-3px, 3px);
  }
  75% {
    transform: translate(3px, 3px);
  }
  100% {
    transform: translate(0px, 0px);
  }
}

.fit-slider-products
  .s-slider-swiper-wrapper
  .swiper-slide
  custom-salla-product-card:hover
  img {
  animation: animate 0.6s linear !important;
}
/* crd btns  */

.footer-is-custom .store-footer .store-footer__contacts-row,
.store-footer__inner,
section.s-block.s-block--stats.s-block--animate.with-animation
  > div
  > div
  > div
  > div,
.product-single
  .sticky-product-bar
  salla-add-product-button
  salla-button
  .s-button-btn,
.product-card.hover_style_3 .product-card__buttons div button,
.product-single
  .sticky-product-bar
  salla-add-product-button
  salla-button
  .s-button-btn,
.product-card__enhanced-mini-cart button.s-button-element,
.s-infinite-scroll-btn,
.product-card--primary-buttons button {
  background: #8e2223;
  background: linear-gradient(90deg, #b12c2e 0%, #7c1b1d 100%) !important;
}

.product-card.hover_style_3 .product-card__buttons div button i {
  fill: white !important;
  color: white !important;
  font-size: 1.1rem !important;
}

.product-card__normal-cart__btn .s-button-text,
.product-card--primary-buttons button i,
.product-card--primary-buttons salla-button i {
  color: white !important;
}

.product-card--fit-height {
  justify-content: space-between !important;
}

.product-card--primary-buttons button,
.product-card--primary-buttons salla-button {
  border-radius: 1rem !important;
}

#block-blog-12 > div > div.mb-8.home-block-title {
  text-align: center !important;
}

@media (min-width: 1024px) {
  .s-products-list-vertical-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

.s-block.s-block--square-links > div > ul > li > a > h3 {
  color: white !important;
  background: #072c51 !important;
  padding-bottom: 0.5rem !important;
  border-radius: 20px !important;
}

.footer-is-custom .store-footer .store-footer__curve {
  color: var(--footer-bg);
  background: #8e2223;
  background: linear-gradient(90deg, #b12c2e 0%, #7c1b1d 100%);
  color: transparent !important;
  border-radius: 87% 87% 0 0 !important;
}

#app
  > div.app-inner.flex.flex-col.min-h-full.bg-storeBG
  > section.s-block.s-block--enhanced-features.s-block--animate.container
  > div
  > div
  > div.feature-icon.has-image
  > img {
  border-radius: 50% !important;
}

.footer-is-custom .store-footer .footer-rights p {
  color: white !important;
}

.product-card__promotion,
.btn--outline-primary {
  border-radius: 2rem !important;
}

@media (max-width: 677px) {
  .product-card__enhanced-mini-cart button.s-button-element {
    width: 90%;
    margin: auto;
    margin-bottom: 0.5rem;
  }
  .product-card__image img {
    object-fit: contain !important;
    height: auto !important;
  }
}

.product-card__buttons > div {
  display: none;
}

@media (max-width: 767px) {
  .simplified-products
    .s-products-slider-card
    .product-card--simplified
    .product-card__image {
    height: auto;
  }
}

.product-card__image img {
  border-radius: 1rem !important;
}

.product-card__promotion {
  border-radius: 1rem 3px 1rem 3px !important;
  left: 0;
  top: 0;
}

#item-text > p {
  font-weight: 700;
}

div > div > div.flex.items-center.mt-6.-mx-2 > div > p {
  font-weight: 800;
}
.promotion-banner__inner ul li {
    animation-duration: 22s !important;
}
.animated-text__inner ul li {
    animation-duration: 20s !important;
}
/* أنيميشن على زر إضافة للسلة */
.s-button-element.s-button-btn.s-button-outline.s-button-sm.s-button-wide.s-button-primary-outline {
  position: relative;
  overflow: hidden;
  animation: add-to-cart-pulse 2.5s ease-in-out infinite;
}

/* نبضة خفيفة للزر */
@keyframes add-to-cart-pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(139, 32, 34, 0.0);
  }
  50% {
    transform: scale(1.03);
    box-shadow: 0 0 0 6px rgba(139, 32, 34, 0.18); /* عدّل اللون حسب هوية متجرك */
  }
}

/* حركة على الأيقونة (علامة +) داخل الزر */
.product-card__enhanced-mini-cart__btn--inner .enhanced-icon {
  display: inline-block;
  animation: add-icon-wiggle 1.8s ease-in-out infinite;
}

@keyframes add-icon-wiggle {
  0%, 100% {
    transform: translateY(0);
  }
  25% {
    transform: translateY(-2px);
  }
  50% {
    transform: translateY(1px);
  }
  75% {
    transform: translateY(-1px);
  }
}
/* موجات مستمرة في اتجاه واحد */
#wa-selia {
    animation: continuous-wave-one-way 4s linear infinite;
}

@keyframes continuous-wave-one-way {
    0% {
        box-shadow: 
            0 0 0 0 rgba(34, 197, 94, 0.6),
            0 0 0 0 rgba(34, 197, 94, 0.4),
            0 0 0 0 rgba(34, 197, 94, 0.2);
    }
    
    25% {
        box-shadow: 
            0 0 0 8px rgba(34, 197, 94, 0.3),
            0 0 0 0 rgba(34, 197, 94, 0.6),
            0 0 0 0 rgba(34, 197, 94, 0.4);
    }
    
    50% {
        box-shadow: 
            0 0 0 16px rgba(34, 197, 94, 0.1),
            0 0 0 8px rgba(34, 197, 94, 0.3),
            0 0 0 0 rgba(34, 197, 94, 0.6);
    }
    
    75% {
        box-shadow: 
            0 0 0 24px rgba(34, 197, 94, 0),
            0 0 0 16px rgba(34, 197, 94, 0.1),
            0 0 0 8px rgba(34, 197, 94, 0.3);
    }
    
    100% {
        box-shadow: 
            0 0 0 32px rgba(34, 197, 94, 0),
            0 0 0 24px rgba(34, 197, 94, 0),
            0 0 0 16px rgba(34, 197, 94, 0);
    }
}

/* أنيميشن للعنصر الترويجي - متبادل بسلاسة */
.product-card__promotion {
    background-color: #8b2022 !important; /* تجاوز inline style */
    color: #ffffff;
    animation: promo-pulse 3s ease-in-out infinite;
}

@keyframes promo-pulse {
    0%, 100% {
        background-color: #8b2022;
        color: #ffffff;
    }
    
    50% {
        background-color: #eeeaeb;
        color: #8b2022;
    }
}
/* أنيميشن للعنصر الترويجي - متبادل بسلاسة */
.product-card__promotion {
    background-color: #8b2022 !important; /* تجاوز inline style */
    color: #ffffff;
    animation: promo-pulse 3s ease-in-out infinite;
}

@keyframes promo-pulse {
    0%, 100% {
        background-color: #8b2022;
        color: #ffffff;
    }
    
    50% {
        background-color: #eeeaeb;
        color: #8b2022;
    }
}
/* أنيميشن زر اشتري الآن - مصحح */
.s-fast-checkout-button.outline {
  position: relative;
  overflow: hidden;
  animation: buy-now-glow 2.8s ease-in-out infinite;
}

.s-fast-checkout-button.outline:hover {
  transform: scale(1.05);
}

/* تأثير التوهج */
@keyframes buy-now-glow {
  0%, 100% {
    box-shadow: 
      0 0 5px rgba(139, 32, 34, 0.3),
      inset 0 0 5px rgba(255, 255, 255, 0.1);
  }
  50% {
    box-shadow: 
      0 0 25px rgba(139, 32, 34, 0.8),
      inset 0 0 15px rgba(255, 255, 255, 0.3);
  }
}

/* حركة الـ SVG */
.s-fast-checkout-button.outline svg {
  animation: svg-pulse 2s ease-in-out infinite;
}

@keyframes svg-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.08);
  }
}