/* Add custom CSS styles below */ 
b{
color

}

.mm-spn li a span{
color:var(--links);
}

.store-footer h3{
 color:var(--links);
 }

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre {
  margin: 0;
  color: var(--btn);
}

.font-bold {
  font-weight: 700;root
  color: var(--btn);
}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-weight: 600;
  margin-bottom: 0px;
  color: var(--btn);
}

.bg-white{
background:var(--card);
color:(--links);
}

.mm-spn.mm-spn--light {
    color: #fff;
    background: #fff;
    background: var(--header);
    color: var(--links);
  }

body:after {
    content: '';
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    z-index: 999999;
    background: var(--header) url('https://cdn.salla.sa/cdn-cgi/image/fit=scale-down,width=400,height=400,onerror=redirect,format=auto/ydwrEp/auAIG5nTBj4LU9lUrqKQzGyULJE0SCV1W7tfEUyI.png') no-repeat center;
    background-size: 360px;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    animation: fade-in 2.5s forwards;
    border: none;
}

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

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

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











.s-login-modal-input {
color:#000 !important;
}
.s-login-modal-link {
  margin-top: 1.5rem;
  display: block;
  text-align: center;
  font-size: .875rem;
  line-height: 1.25rem;
  color: #414042;
  color: var(--color-primary);
  color: var(--links) !important;
}

.text-primary {
  color: var(--barcolor);
  color: #000;
  color: var(--links)!important;
}
.s-login-modal-label {
  margin-bottom: .5rem;
  display: block;
  font-size: .875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: #374151;
  color: rgba(55,65,81,var(--tw-text-opacity));
  color: var(--links) !important;
}
.s-login-modal .s-modal-padding {
    padding-top: 1.5rem;
    background: var(--header);
    color:#fff;
  }
  
  .s-modal-close:where([dir="rtl"], [dir="rtl"] *) {
  left: 0px;
  background: var(--header);
}
 .s-modal-title{
 color:var(--links);
 }
 
s-login-modal-label{
color:var(--links) !important ;
}
.iti input, .iti input[type="text"], .iti input[type="tel"] {
  position: relative;
  z-index: 0;
  direction: ltr !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-left: 95px !important;
  padding-right: 15px !important;
  margin-left: 0 !important;
  color: #000;
}
.iti--separate-dial-code .iti__selected-dial-code {
  unicode-bidi: -webkit-plaintext;
  unicode-bidi: plaintext;
  direction: ltr;
  letter-spacing: 1px;
  font-family: "Arial", serif;
  font-size: 13px;
  color: #000;
}

.banner-entry {
  position: relative;
  height: 300px;
  overflow: hidden;
  border-radius: 0.375rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 0.75rem;
  text-align: center;
  background-color: var(--body); /* Use CSS variable for background color */
  color: rgba(255, 255, 255, var(--tw-text-opacity, 1)); /* Default text opacity */
}

@media (min-width: 1024px) {
  .banner-entry {
    height: 600px;
  }
}
/* Add custom CSS styles below */ 
/* Add custom CSS styles below */ 
.s-login-modal-link {
  margin-top: 1.5rem;
  display: block;
  text-align: center;
  font-size: .875rem;
  line-height: 1.25rem;
  color: #414042;
  color: var(--color-primary);
  color: var(--links) !important;
}
.s-login-modal-label {
  margin-bottom: .5rem;
  display: block;
  font-size: .875rem;
  line-height: 1.25rem;
  font-weight: 500;
  --tw-text-opacity: 1;
  color: #374151;
  color: rgba(55,65,81,var(--tw-text-opacity));
  color: var(--links) !important;
}
.s-login-modal .s-modal-padding {
    padding-top: 1.5rem;
    background: var(--header);
    color:#fff;
  }
  
  .s-modal-close:where([dir="rtl"], [dir="rtl"] *) {
  left: 0px;
  background: var(--header);
}
 .s-modal-title{
 color:var(--links);
 }
 
s-login-modal-label{
color:var(--links) !important ;
}
.iti input, .iti input[type="text"], .iti input[type="tel"] {
  position: relative;
  z-index: 0;
  direction: ltr !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-left: 95px !important;
  padding-right: 15px !important;
  margin-left: 0 !important;
  color: #000;
}
.iti--separate-dial-code .iti__selected-dial-code {
  unicode-bidi: -webkit-plaintext;
  unicode-bidi: plaintext;
  direction: ltr;
  letter-spacing: 1px;
  font-family: "Arial", serif;
  font-size: 13px;
  color: #000;
}


:root{
--header: #fff;
--footerlinks:#fff;
--card:none;
--body:#fff;
--links:#000;
--barcolor:#b6a593;
--cardtitle:#1a232d;
--btn: #1a232d;
}
#mainnav{
background:var(--header);
}
.navbar-brand img {
  max-height: 4rem; /* Set maximum height */
  width: auto; /* Maintain aspect ratio */
  max-width: 100px; /* Set maximum width */
  animation: scaleAndShadow 2s ease-in-out infinite; /* Apply animation */
}

/* Define the keyframes for scaling and shadow effect */
@keyframes scaleAndShadow {
    0%, 100% {
        transform: scale(0.8); /* Scale down to 50% */
         /* Shadow for scale 0.5 */
    }
    50% {
        transform: scale(1.5); /* Scale up to 100% (original size) */
         /* Shadow for scale 1 */
    }
}
.s-cart-summary-content b{
color:var(--links);

}
.header-btn__icon{
color:var(--links);

}


.text-primary {
  

color:var(--barcolor);
}
body{
background:var(--body);
}
.banner--fixed img{
background:var(--body)
}
header{
background:var(--header);

}
.inner {
  backdrop-filter: blur(10px); /* Apply the blur effect */
  background-color: transparent; /* Set the background to be transparent */
  border-bottom-left-radius: 50px; /* Round the bottom-left corner */
  border-bottom-right-radius: 50px; /* Round the bottom-right corner */
  padding: 0px 20px; /* Add padding with 0px for top/bottom and 20px for left/right */
}

.main-menu li.root-level > a {
  color: var(--links);
}

.main-menu li.root-level > a:hover{
 color:#fff;
 background:var(--btn);
 border-radius: 10px; 
}

.top-navbar .s-search-input {
  border-style: none;
  background-color: rgba(229, 231, 235, 0.5);
  width: 75%;
}
.container {
    max-width: 1280px;
    width: 100%;
    
  }
.s-products-slider-card{
background:var(--card);
margin-left:5px;
padding:10px 0px;
border-radius:10px;

}
.s-product-card-content {
    background:var(--card);
  }
.s-button-btn, .s-price-range-number-input {
  border-radius: .75rem;
  background: var(--btn); /* أو أي لون تريده */
  color: #fff;
  
  border-top-left-radius: 50px;   /* Top-left corner */
  border-bottom-right-radius: 50px;/* تصحيح من bordr إلى border و slid إلى solid */
  box-shadow: 0px 10px 10px  var(--btn);
}

.s-button-btn:hover, .s-price-range-number-input:hover {
  border-radius: .75rem;
  background: #1a232d;
  color: #fff;
  border: none; /* تصحيح من bordr إلى border */
  border-top-left-radius: 50px;   /* Top-left corner */
  border-bottom-right-radius: 50px;
  box-shadow: 0px 20px 20px  var(--btn);
  
}
.s-product-card-content-title a {
  display: block;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: var(--cardtitle);
  white-space: nowrap;
  overflow:hidden;
}
element {
}
.s-product-card-price {
  font-size: 0.875rem !important;
  line-height: 1.25rem !important;
  font-weight: 700 !important;
  color: var(--cardtitle)!important;
}

.s-product-card-wishlist-btn {
  background: red !important;
}

.s-product-card-vertical .s-product-card-wishlist-btn button {
  --tw-bg-opacity: 1 !important;
  background: red !important;
  background-color: red !important;
  
}
/* Define the keyframes for moving up and down */
@keyframes moveUpDown {
  0%, 100% {
    transform: translateY(0); /* Start and end at original position */
  }
  50% {
    transform: translateY(-10px); /* Move up by 10px */
  }
}

/* Style for the product card */
.s-product-card-vertical {
  border: 1px solid var(--btn); /* Border color from CSS variable */
  box-shadow: 0px 0px 20px var(--btn); /* Shadow color from CSS variable */

  background-color: #fff; /* Example background color */
   /* Optional: rounded corners */
  animation: moveUpDown 2s ease-in-out infinite; /* Apply animation */
}

.s-product-card-vertical:hover{
border: 1px solid var(--btn);
box-shadow:0px 0px 40px var(--btn);
}
.footer-is-light .store-footer {
  border-top-left-radius:100px;
  border-top-right-radius:100px ;
  
  background: var(--btn);
  color:#fff !important;
}
.footer-is-light .store-footer .store-footer__inner {
  
  background: var(--header);
  color:#fff;
  border:2px dashed var(--btn);
  border-top-right-radius: 100px;
  border-top-left-radius: 100px;
  
  
}
.store-footer a {
  transition-property: opacity;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms;
  color: var(--links) !important;
}
.m-0 {
  margin-bottom: 1.25rem;
  font-size: 0; /* إذا كان الهدف هو إخفاء النص */

  background: url('https://cdn.salla.sa/cdn-cgi/image/fit=scale-down,width=400,height=400,onerror=redirect,format=auto/ydwrEp/auAIG5nTBj4LU9lUrqKQzGyULJE0SCV1W7tfEUyI.png') no-repeat center center;
  background-size: cover;
  width: 100px;
  height: 100px; /* إصلاح الخطأ الإملائي */
}
.m-0 h3{
font-size: 0;
}

.xs\:p-7 {
    padding: 1.75rem;
    background: var(--header);
    color: #fff;
  }
  .text-base {
  color:#fff;
}
.s-contacts-topnav-link{
color:#fff;
}
.s-menu-topnav-item{
color:var(--links);
}
.s-quantity-input-input {
  width: 3rem;
  border-width: 1px;
    border-top-width: 1px;
    border-bottom-width: 1px;
  border-top-width: 0px;
  border-bottom-width: 0px;
  --tw-border-opacity: 1;
  border-color: rgba(229, 231, 235, 1);
  border-color: rgba(229, 231, 235, var(--tw-border-opacity));
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  text-align: center;
  font-weight: 700;
  --tw-shadow: 0 0 rgba(0,0,0,0);
  --tw-shadow-colored: 0 0 rgba(0,0,0,0);
  box-shadow: 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0), 0 0 rgba(0,0,0,0);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 rgba(0,0,0,0)), var(--tw-ring-shadow, 0 0 rgba(0,0,0,0)), var(--tw-shadow);
  color: #000;
}


 



.


.form-input {
  -moz-appearance: none;
  appearance: none;
  -webkit-appearance: none;
  color: #000 !important;
}
.text-center::before {
    content: "برمجه وتطوير ADFAZ";
    display: block;
    text-align: center;

    padding: 10px;
    color: var(--footerlinks);
}
.text-gray-400{
color:var(--footerlinks)!important;

}
.text-gray-400 a{
color:var(--footerlinks)!important;

}


.s-block--features__item .feature-icon{

background:var(--header);
color:#fff;
}
.s-block--features__item .feature-icon i{


color:#fff;
}

salla-slider .swiper-pagination-bullet-active {
  opacity: 1;
  background-color: #414042;
  background-color: var(--color-primary);
  background: var(--btn);
}