/* Add custom CSS styles below */ 
body::before {
    content: " ";
    background-color: #FFFFF;
    position: fixed;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    z-index: 9998;
    opacity: 0;
    animation: intro 2s;
}

body:after {
    z-index: 9999;
    position: fixed;
    content: "";
    background-image: url('https://cdn.salla.sa/cdn-cgi/image/fit=scale-down,width=400,height=400,onerror=redirect,format=auto/lGReBg/zCoofGGjDXbbMdMPDGRHyaaXohCx1JWcBvkorLBK.png') !important;
    background-position: center;
    background-size: 50px;
    background-repeat: no-repeat;
    width: 0px;
    transform: translate(50px, -50px) scale(2); /* تم إزالة التدوير */
    height: 100px;
    right: 50%;
    top: 50%;
    opacity: 0;
    visibility: visible !important;
    background-color: transparent !important;
    animation: intro_logo 1.5s;
}

@keyframes intro {
    0% {
        width: 100%;
        opacity: 1;
    }

    40% {
        opacity: 1;
    }

    80% {
        opacity: 1;
    }
    99% {
        width: 100%;
    }

    100% {
        width: 0;
        opacity: 0;
        display: none;
    }
}

@keyframes intro_logo {
    0% {
        width: 100px;
        opacity: 0.8;
        transform: translate(50px, -50px) scale(2); 
    }

    50% {
        opacity: 0.9;
    }

    70% {
        opacity: 1;
    }

    80% {
        opacity: 1;
    }
    99% {
        width: 100px;
    }

    100% {
        width: 0;
        opacity: 0;
        display: none;
        transform: translate(50px, -50px) scale(2); 
    }
}
#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 > a{
    display: flex;
    flex-direction: column;
     align-items: center;

}
#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 > p{
text-align: center;
}
.store-footer h3 {
    text-align: center;
    }
    .s-menu-footer-list{
    text-align: center;
    }
    #app > div.app-inner.flex.flex-col.min-h-full > footer > div.store-footer__inner > div{
        display: grid;
    justify-items: center;
}
.footer-is-light .store-footer .store-footer__inner {
    border-radius: 50px 50px 10px 10px;
    --tw-border-opacity: 1;
    border-bottom-color: #e5e7eb;
    border-bottom-color: rgba(229, 231, 235, var(--tw-border-opacity));
    --tw-bg-opacity: 1;
    background-color: #f3f4f6;
    background-color: rgb(249 154 56);
}
.footer-is-light .store-footer {
    padding-top: 13px;
    /* margin-top: 13px; */
    border-radius: 50px 50px 0px 0px;
    --tw-bg-opacity: 1;
    background-color: #115177;
    background-color: rgb(17 81 119);
    --tw-text-opacity: 1;
    color: #374151;
    color: rgba(55, 65, 81, var(--tw-text-opacity));
}
div#mainnav{
    --tw-bg-opacity: 1;
    background-color: #fff;
    background-color: rgb(17 81 119);
    border-radius: 0px 0px 20px 20px;
}
.inner.bg-inherit {
    background-color: rgb(249 154 56)!important;
    border-radius: 0px 0px 30px 30px;
}
.top-navbar {
    background-color: #f99a38;
    display: flex;
    min-height: 48px;
    padding-top: .5rem;
    padding-bottom: .5rem;
}
#app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--banners.container > div{
display: grid;
    grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 640px) {
    .two-row .banner-entry:first-child {
        grid-column: span 1 / span 1;
        grid-row: span 1 / span 1;
    }
}
#\31 362059597 > div.s-product-card-content > div.s-product-card-content-footer.gap-2 > salla-add-product-button > salla-button > button > span > span{
disply:none;
}
.s-product-card-content-footer .s-button-wrap {
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background-color:#ffff;
  border: none;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 0px 0px 4px rgba(249, 154, 56, 1);
  cursor: pointer;
  transition-duration: 0.3s;
  overflow: hidden;
  position: relative;
}

.s-product-card-content-footer .s-button-wrap .svgIcon {
  width: 12px;
  transition-duration: 0.3s;
}

.s-product-card-content-footer .s-button-wrap .svgIcon path {
  fill: white;
}

.s-product-card-content-footer .s-button-wrap:hover {
  width: 140px;
  border-radius: 50px;
  transition-duration: 0.3s;
  background-color: #ffff;
  align-items: center;
}

.s-product-card-content-footer .s-button-wrap:hover .svgIcon {
  transition-duration: 0.3s;
  transform: translateY(-200%);
}

.s-product-card-content-footer .s-button-wrap::before {
  position: absolute;
  bottom: -20px;
  content: "";
  color: white;
  font-size: 0px;
}
.s-button-outline {
    border-width: 0px;
    border-color: currentColor;
}
.s-product-card-content-footer .s-button-wrap:hover::before {
  font-size: 13px;
  opacity: 1;
  bottom: unset;
  transition-duration: 0.3s;
}
.s-button-primary-outline {   
    fill: #ffffff!important;
    color: #414042;    
}
.s-button-primary-outline:hover {
    background-color: #414042;
    background-color: #ffffff00;
    fill: #ff6767;
    fill: #000000;
    color: #ff6767;
    color: #000000;
}

.banner-entry {
    position: relative;
    height: 100px;
    }
    @media (min-width: 800px){
    .banner-entry {
    position: relative;
    height: 350px;
    }
     }
     .copyright-text p {
    --tw-text-opacity: 1;
    color: #374151;
    color: rgb(255 255 255);
}
.mm-spn>ul {
    display: flex;
    flex-direction: column;
    align-items: center;
}
@media only screen and (max-width: 1024px) {
    .mm-spn.mm-spn--navbar.mm-spn--main:where([dir=rtl],[dir=rtl] *):after {
        padding-right: .75rem;
        text-align: center;
    }
}
@media only screen and (max-width: 1024px) {
    .mm-spn.mm-spn--light {
        color: #000;
        background: #f99a38;
    }
}
@media only screen and (max-width: 1024px) {
    .mm-spn.mm-spn--light {
        color: #000;
        background: #f99a38;
        border-radius: 118px 0px 0px 118px;
    }
}
.mm-ocd__content {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: calc(100% - 51px);
    width: var(--mm-ocd-width);
    min-width: 200px;
    min-width: var(--mm-ocd-min-width);
    max-width: 440px;
    max-width: var(--mm-ocd-max-width);
    background: #fff0;
    transition-property: transform;
    transition-duration: .3s;
    transition-timing-function: ease;
}
.s-product-card-content-title a {
    text-align: center;
    display: block;
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 700;
    --tw-text-opacity: 1;
    color: #1f2937;
    color: rgb(39 126 154);
}
.s-product-card-content-sub {
    text-align: center;
    margin-bottom: 1.25rem;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    color: #f99a38;
}
 div.s-product-card-content > div.s-product-card-content-footer.gap-2 > salla-add-product-button > salla-button > button > span > i{
color: #2f7e9d;
}

.s-product-card-promotion-title {
    --tw-bg-opacity: 1;
    background-color: rgb(249 154 56);
    --tw-text-opacity: 1;
    color: #fff;
    color: rgb(37 118 148);
    margin-top: -24px;
}
.s-product-card-image {
    position: relative;
    height: 100%;
    width: 100%;
    flex-shrink: 0;
    overflow: hidden;
    --tw-bg-opacity: 1;
    background-color: #f3f4f6;
    background-color: rgb(243 244 246 / 0%);
}
.s-product-card-entry {
    position: relative;
    display: flex;
    height: 100%;
    justify-content: space-between;
    border-radius: .75rem;
    --tw-bg-opacity: 1;
    background-color: #fff;
    background-color: rgb(255 255 255 / 0%);
    transition-property: box-shadow;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 300ms;
}
.s-product-card-content {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: .75rem;
    background-color: #fff;
    border-radius: 20px 20px 0px 0px;
    margin-top: -26px;
    padding-top: 45px;
     box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* Adjust the values as needed */

}
.s-product-card-image img.loaded {
    padding-top: 10px;
    z-index: 1;
    position: sticky;
    opacity: 1;
}
.text-gray-800 {
    --tw-text-opacity: 1;
    color: #1f2937;
    color: rgb(34 115 145);
    text-align: center;
}
flex whitespace-nowrap gap-4 items-center{
    display: flex;
    justify-content: center;
}
h2.font-bold.text-xl.inline-block {
    color: #dd9215;
}
.promotion-title {
    position: absolute;
    top: 1rem;
    z-index: 10;
    --tw-bg-opacity: 1;
    background-color: #991b1b;
    background-color: rgb(220 144 17);
    font-size: .875rem;
    line-height: 1.25rem;
    font-weight: 700;
    --tw-text-opacity: 1;
    color: #fff;
    color: rgb(22 103 133);
}
.gap-4.flex {
display: flex;
    justify-content: center;
}
.s-social-share-btn s-button-element s-button-icon s-button-outline s-button-light-outline s-button-loader-center{
display: block!important;
}