:root {
  --main-color: #8932a2;
  --second-color: #000000;
  --third-color: #ffff;
      --forth-color: #c2cfa1;

    --fifth-color: #e6cccb;

 --six-color: #ff9f9f;
  --seven-color: #ff8e8e;
body{  background-image: url(https://f.top4top.io/p_3422qytmv1.png);
background-size: cover;}
}
.s-search-input {
  
    padding-right: 60px;
}
.sicon-menu:before{color:var(--main-color);}
.s-search-icon-wrap {
  background:var(--main-color);
  padding:3px 7px;
  border-radius:10px;
}

.s-search-icon svg {
 
  fill: #fff !important;
}
.header-btn__icon {
  border:none;
  color:white !important;
  background:var(--main-color);
  box-shadow: 1px 1px 5px black;
}

.full-banner-entry {
  
  background-color: transparent;
}
.full-banner-entry::after {
  
  display:none;
}
.inner.bg-inherit {
background:transparent;
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(7px);
}
#mobile-menu {
    background-color: transparent !important;
}


#mainnav{
background-color:transparent !important;
min-height:50px;
    border-radius: 0 !important;
 position: relative;
    z-index: 999;
}
#mainnav .inner.bg-inherit {
    padding:10px;
    min-height: 50px;
}



.banner.banner--fixed img{



background:transparent;
 
	
}
.banner.banner--fixed img:hover{
   
    }
    
a.banner-entry.square-photos  {
    background:transparent;
    transition:0.2s ease-in-out;
    scale:0.9;
    border-radius:30px;
    transform: scale(1);
	animation: pulse 2s infinite;
 
   
    
    }
    a.banner-entry.square-photos:hover  {
   
   scale: 1;
   

    border-radius: 40px;
    
    }
  
    
    
.right-side {
    width: 100%;
    padding-left:0!important;
    
    margin-bottom:20px;
    padding:7px;
    
    margin-top:30px;
 
    
    
}
.right-side h2{
text-align:center;
color:var(--third-color);
font-size:30px;
}
.s-block__title .right-side{
   background: linear-gradient(to left,var(--second-color),var(--main-color));
}
   
.main-content h1{
color:black;}
.text-xl {
color:black!important;
}
.s-slider-block__title-right h2{
color:var(--third-color) !important;
}
.s-breadcrumb-wrapper li{
color:black !important;
}
.s-slider-block__title-left a{
color:color:var(--main-color);
}
body{background-color: white}
body:after {
  content: "";
  width: 100%;
  height: 100%;
  top: 0;
  position: fixed;
  z-index: 999999;
 background:transparent

  url(https://basic-settings.apps.salla.sa/_next/image?url=https%3A%2F%2Fcdn.salla.sa%2FPdbOYW%2Fj2R5tkAIPxiLQ93MQ1vLWy5lELemMzWIhT83RBIh.png&w=128&q=75);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
  left: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 350px;
  animation-name: fade-in;
  animation-duration: 1.5s;
  transform: scale(0);
  border: none;

}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes fade-in {
  0% {
    opacity: 1;
    transform: scale(1);
  }

  75% {
    opacity: 1;
    transform: scale(1);
  }

  100% {
    opacity: 0;
    transform: scale(0.1);
  }
}

/* NavBar start */
.s-menu-topnav-list{color:var(--third-color)}
.s-search-input::placeholder{color:var(--main-color)}
  .s-search-input{  border: 2px solid var(--main-color)!important;
     background: white !important;
box-shadow: 1px 1px 5px;
}

#mainnav {
  background-color: var(--main-color);
  border-radius:50%;
}
#mainnav .inner.bg-inherit {
    border-radius: 35px;
}

#mobile-menu {
  background-color: black;
  color:black !important;
  
}

.text-primary {
  color: var(--third-color);
}
.main-menu a {
  color: black;
  transition:0.2s ease-out ;
}
.main-menu li > a:hover {
  color: var(--six-color);
      transform: translateY(-15%);
  
}

.mm-spn.mm-spn--light {
  color:  var(--third-color) !important;
}

.sicon-user-circle:hover::before {
  color: var(--second-color);
}
.sicon-menu{color:var(--main-color);)
}
.header-btn__icon {
  border: none;
  color: var(--main-color);
}
.header-btn__icon:hover {
  color: var(--second-color);
}

.s-cart-summary-total {
  color: var(--main-color);
}
.main-nav-container {
    min-height: 0px;
}
.s-cart-summary-count{
background-color:red !important;
}

@media only screen and (max-width: 1024px) {
  .mm-spn.mm-spn--light {
    color: var(--third-color);
    background: var(--third-color);
  
  }
 
  
}
@media (min-width: 480px) {
    .navbar-brand img {
       max-width:100px;
    }
}
@media only screen and (min-width: 620px) {
.top-navbar{padding:20px;
}
   .navbar-brand img {
       max-width:100px;
    }
  
 .banner--fixed img {
    width: 100%;
    margin: auto;
    
    
    
    }
     a.banner-entry {
     
        
        }
                
}
@media only screen and (min-width: 700px) {
 .store-footer__inner .container.grid.grid-col-1.lg\:grid-cols-6.gap-8.lg\:gap-6{
 display:flex;
 justify-content:space-evenly;
 flex-direction:column;
 padding-bottom:70px;
 padding:30px;
        

 }
 .s-menu-footer-list {
    padding: 10px;
}
 .store-footer__inner .rtl\:lg\:pl-20:where([dir="rtl"], [dir="rtl"] *){
 padding-left:0px;
 }
 
a.banner-entry.square-photos  {
margin-top:100px;
}

   a.banner-entry {
   
        height:350px!important;
        }
                
}@media only screen and (min-width: 1100px) {
 .main-nav-container .container{
         padding: 0px 30px 0px 30px;
         }
         
  .right-side {
   
   
   
    
    
}
a.banner-entry.square-photos  {
   
    scale:1;
    margin-bottom:30px;

 
   
    
    }
    a.banner-entry.square-photos:hover  {
   
    scale:1.1;

 
   
    
    }
                
}

 



@media only screen and (max-width: 700px) {


  .s-product-card-image:hover{
  background:red;}
  
.right-side h2{
font-size:1.125rem;
}

}

/* NavBar End */

/* Sections Strat */
.swiper-pagination {
  display: none;
}

.slide--cat-entry i {
  content: "\ec0b";
  color: var(--main-color);
}

.s-block--categories .swiper-wrapper a {
  background-color: var(--third-color);
}

.slide--cat-entry h4 {
  color: var(--second-color);
}

.s-slider-block__title {
  color: var(--main-color);
}

.s-block__title {
  color: var(--main-color);
}

/* Sections End */

/* Product start */

.s-products-slider-card {
  padding: 0.625rem;
  

}
.s-slider-block__title h2{
color:var(--third-color)
}
.s-slider-block__display-all{
color:var(--third-color)
}
.s-slider-block__title h2::after {
  content: "";
  width: 100%;
  height: 5px;
  background-color: var(--third-color);
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
}

.s-product-card-entry:hover {


}


.s-product-card-image img {

  
  }
  
.s-product-card-image {
  position: relative;
  overflow: hidden;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;



}
.s-products-slider-slider{
margin-bottom:50px;
margin-top:10px;}


.s-product-card-entry {
    background: transparent;
  
  border-radius: 20px;
  transition:0.2s ease-out;
   box-shadow: 3px 0 8px -2px ;
   margin-bottom:0px;
   
  
}

.s-product-card-vertical .s-product-card-wishlist-btn button {
  background-color: rgba(11, 22, 73, 0.5) !important;
  color: var(--third-color);
}

.s-product-card-vertical .s-product-card-image {
  
position: relative;
  overflow: hidden;

}

.s-product-card-content-main {
  text-align: center;
}
.s-product-card-content {
    background: transparent;

border-radius: 20px;

}

.s-product-card-content-title a {
  color: black;
}
.s-product-card-price{
    color: black;
    }
.s-product-card-content-title a:hover {
  color: black;
}

.s-product-card-content-sub {
  justify-content: center;
}
h4 {
  color: var(--third-color);
}
h4:hover {
  color: var(--second-color);
}
.s-product-card-content {
  padding: 0.75rem 0.75rem;
  justify-content: center;
  align-items: center;
}
.banner--fixed img{
background-color:var(--third-color);
    background-image: url(https://f.top4top.io/p_3074bje9i1.png);
}



.s-button-outline {
  border-radius: 50px;
  border-color: var(--third-color);
}

.s-product-card-entry {
  background-color: var(--third-color);
}

.s-button-primary-outline {
  color: var(--third-color);
  background-color: black;
}

.s-button-primary-outline:hover {
  background-color: var(--third-color);
  color: black;
  border-color:var(--third-color);
}
.s-block--features__item {
    background:transparent;
     transition:0.5s 
     
     
;
}
.s-block--features__item:hover{
 box-shadow: 1px 3px 8px;
}
.s-block--features__item .feature-icon {
  background-color: var(--third-color);
}
.s-block--features__item h2 {
  color: var(--main-color);
}

.s-block--features__item p {
  color: var(--main-color);
}

.s-block--features__item .feature-icon i {
  color: var(--third-color) !important;
}
.md\:text-2xl {
  font-size: 1.5rem;
  line-height: 2rem;
  color: var(--main-color);
}
.pb-1 p {
  padding-bottom: 0.25rem;
  color: #000;
}
.s-breadcrumb-item {
  color: var(--main-color);
}
.text-xl{ color: var(--main-color);}


/* Product End */

/* General styling for the footer */
/* Footer General Styles */
.store-footer {

   background: linear-gradient(to top,var(--forth-color),var(--main-color));
    padding: 30px;
    font-size: 14px;
  
    text-align: center;
    transition: background 0.3s, transform 0.3s, box-shadow 0.3s;
    box-shadow: 0 3px 6px 0 rgba(102, 15, 86, 0.333), 0 6px 20px 0 rgba(190, 78, 169, 0.262);



}




.footer-is-light .store-footer .store-footer__inner {
    background_color: transparent;
    font-size: 18 px !important;
}



.store-footer__inner {
    background-color: transparent !important;
    color: white!important;
    border-bottom: solid var(--third-color) 2px !important;
   
    


}

.store-footer__inner .flex {

    justify-content: center;
}

.store-footer__inner .max-w-sm {
    margin: auto;
}

.store-footer h3 {
    color: white!important;
    font-size: 1.3rem;
    text-align:center;
    margin: auto;
    width:90%;
    font-size: 1.3rem;
  
 
    margin-bottom: auto;
  padding: 10px;
  
  background: rgb(24, 22, 22);
  border-radius: 25px;
  padding: 0px;
  margin-bottom: 30px;
}
.flex.items-center.m-0 h3{
width:90%;
  
 
}



.footer-list {
    color: white!important;
}

.store-footer__inner .max-w-sm {
    color: white!important;
    ;
}

.store-footer a {
    color: white!important;
    ;
}

.store-footer a:hover {
    color: white;
}

.s-contacts-header {
    display: none;
}

.s-contacts-list.s-contacts-list-vertical {
    align-items: center;
}

.store-footer i {
    color: white!important;
    border-color: transparent !important;
}

.store-footer .contact-social {
    border: none;
}

.store-footer__inner {
    text-align: center;
   
}
.store-footer__inner h3 {
   
}
.store-footer__inner h3:hover {
    color: white !important;
}

.s-breadcrumb-wrapper {
    color: 


 !important;
}

.s-block--features__item .feature-icon {
   background: linear-gradient(to bottom,var(--second-color),var(--main-color));
    font-size: 30px !important;
    color: var(--third-color);

}



.s-block--features__item:hover {
    scale: 1.08;
    box-shadow: 0 3px 6px 0 rgba(102, 15, 86, 0.333), 0 6px 20px 0 rgba(190, 78, 169, 0.262);

    border-radius: 30px;
}

@media only screen and (max-width: 600px) {
body:after {
background-size:160px;
}
    .store-footer h3 {
        font-size: 15px !important;

    }

    .gap-4 {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .s-menu-topnav-list {
        padding: 0;
        box-shadow: none;
    }
    
    .full-banner-entry {
  
  background-color: transparent;
background-size: contain;
  background-repeat:no-repeat;
  height:200px;
}
.right-side {
    width: 90%;
  
  
    
}
.s-block__title {

  justify-content: center;
}
.banner.banner--fixed img{

scale:1;

}.banner.banner--fixed img:hover{

scale:1;

}
a.banner-entry.square-photos  {
   gap:0;
   scale:0.95;
 
   
    
    }a.banner-entry.square-photos:hover  {
  
   scale:1;
 
   
    
    }
}

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

.store-footer::after {
    animation: shake 3s;

  animation-iteration-count: infinite;
    
    top: 0px;
    font-size: 16px;
    opacity: 0.8;
    text-align: center;
    font-weight: bold;
    display: inline-block;
    color: var(--main-color) !important;
    padding: 10px;
    background-color: var(--third-color);
    border-top-right-radius: 15px;
    border-top-left-radius: 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
}



























  .lazy__bg.lazy.entered.loaded {
    background-size:contain;
    background-repeat: no-repeat;
    
}
.s-block--fixed-banner a{
scale: 1.08;
    box-shadow: 0 3px 6px 0 rgba(102, 15, 86, 0.333), 0 6px 20px 0 rgba(190, 78, 169, 0.262);

    border-radius: 30px;scale: 1.08;
    }
    salla-social.s-social-list.hydrated {
    display: flex;
    align-items: center;
    justify-content: center;
}
@keyframes pulse {
	0% {
		transform: scale(0.95);
		
	}

	70% {
		transform: scale(1);
		
	}

	100% {
		transform: scale(0.95);
		
	}
}
@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
a.s-menu-topnav-item.topnav-link-item.right-side{
color:black;}
.s-user-menu-dropdown {bottom:auto;}

#best-offers-2-slider {
  opacity: 0 ;
  transform: translateX(100%) ; /* يمكن تغيير القيمة لـ translateX(-100%) إذا كنت تريد التحرك من اليسار */
  transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}

.s-products-slider-card {
  position: relative;
  overflow: hidden;
}

.s-product-card-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  transform: translateY(100%); /* إخفاء المحتوى تحت البطاقة */
  transition: transform 0.5s ease-in-out; /* التأثير الناعم */
  background-color: rgba(255, 255, 255, 0.8); /* الخلفية البيضاء */
  padding: 10px;
  opacity:0;
  transition:0.6s;
}

.s-products-slider-card:hover .s-product-card-content {
  transform: translateY(0); /* عند الـ hover نرفع المحتوى لأعلى */
  opacity:1;
}
.s-product-card-entry.a:hover .s-product-card-content{
transform: translateY(0); /* عند الـ hover نرفع المحتوى لأعلى */
  opacity:1;
  }
#best-offers-2-slider.s-products-slider-wrapper {
  opacity: 0 ;
  transform: translateX(100%) 
;
}
.s-product-card-content {
  will-change: transform;
}
.store-footer {
background: rgb(36, 36, 35 ,0.9) !important;


  position: fixed;
  height:100%;
  bottom: 0;
  left: 0;
  width: 100%; 
padding:0 !important;
  transform: translateY(100%); 
  transition: transform 0.3s ease; 
  z-index: 1000; 
  opacity: 1;
}

.store-footer.visible {
  transform: translateY(0); 
}

.more-button {
margin-top:20px;
  position: fixed;
  bottom: 0px; 
  left: 50%; 
  transform: translateX(-50%); 
width:25%;
    border-top-left-radius: 20px;
        border-top-right-radius: 20px;

background: linear-gradient(to left,var(--main-color),var(--second-color));
  color: var(--third-color); 
  border: none; 
  cursor: pointer; 
  z-index: 100199999999999999999999999; 
      box-shadow: 2px 2px 6px black;
}
.s-products-list-vertical-cards{
    gap: 1.625rem;
    padding: 15px;}
    .s-products-list{
overflow:visible;}
.s-product-card-vertical:hover .s-product-card-content{
transform: translateY(0); /* عند الـ hover نرفع المحتوى لأعلى */
  opacity:1;}
      .s-block {
       margin-top: 0;
    }
    .container {
   
   padding-right:0; 
     padding-left: 0;
}
.banner--fixed img {
   
   border-radius: 0; 
    
   
}
.s-block--features + .s-block--features, .s-block--fixed-banner + .s-block--fixed-banner, .s-block--banners + .s-block--banners {
   

margin-top:0;!important}
.s-slider-block__title{
padding-right:10px;}
@media (min-width: 1280px) {
    .container {
         max-width: none ; 
    }
}
salla-mini-checkout-modal#salla-modal {
    z-index: 9999999999999999999999999999;
}
.s-modal-container{z-index:9999999999999999999999999999}

/*whatsaap-icon*/
.whatsapp-icon {
  width: 100px;         /* حجم العرض */
  height: 100px;        /* حجم الطول */
  padding: 10px;       
  border-radius: 50%;  /* شكل دائري */
/*  box-shadow: 0 4px 4px rgba(0, 0, 0, 0.2);*/
  transition: transform 0.3s ease;
}

/* تأثير عند المرور بالماوس */
.whatsapp-icon:hover {
  transform: scale(1.1);  /* تكبير بسيط عند الهوفر */
}