/* Add custom CSS styles below */ 
.bg-storeBG {
    background-color: #fffaf4;
}
.mm-spn.mm-spn--navbar:after, .mm-spn.mm-spn--navbar:before {
    background-color: #48271e;
  color: #ffffff;
}
.py-4 {
    background-color: #ffffff;
}
div.product-card__content > div.product-card__mini-cart.mt-2 > salla-add-product-button > div > salla-button > button{
  
    background: linear-gradient(-45deg, #48271e, #a67c52, #48271e, #a67c52);
    background-size: 300% 300%;
    animation: gradientAnimation 5s ease infinite;
    color: #ffffff !important;
    border: none;
    transition: all 0.3s ease-in-out;
}

@keyframes gradientAnimation {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}
.navbar-brand img {
    animation: logoFloat 3s ease-in-out infinite;
    transition: all 0.4s ease;
}

/* Smooth floating + slight scale */
@keyframes logoFloat {
    0% {
        transform: translateY(0px) scale(1);
    }
    50% {
        transform: translateY(-6px) scale(1.05);
    }
    100% {
        transform: translateY(0px) scale(1);
    }
}

.navbar-brand img {
    animation: logoFloat 3s ease-in-out infinite;
    transition: all 0.4s ease;
}

/* Smooth floating + slight scale */
@keyframes logoFloat {
    0% {
        transform: translateY(0px) scale(1);
    }
    50% {
        transform: translateY(-6px) scale(1.05);
    }
    100% {
        transform: translateY(0px) scale(1);
    }
}
.rounded-md {
  animation: floatBanner 5s ease-in-out infinite;
}
/* تعريف الحركة */
@keyframes floatBanner {
  0% { transform: translateY(0px); }
  50% { transform: translateY(-10px); } /* يرتفع 10 بكسل */
  100% { transform: translateY(0px); }
}
.mm-spn ul.mm-spn--open, .mm-spn>ul{
    background-color: #fffaf4;
}