/* Add custom CSS styles below */ 

.topnav-is-dark .top-navbar .s-search-input {
    color: #000;
    background: #fff;
}

.main-nav-container , .topnav-is-dark .top-navbar , .store-footer__inner{
 color: #fff;
    background: #000;
}
.s-cart-summary-total{
 color: #fff;
}
.header-btn__icon{
border:none;
color:#fff ;
}

.s-cart-summary-count {
    background-color: #f4c033;
}

/************************/
.banner-entry {
    height: 500px;
    background: #f9fafb;
    }
    
   #app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--banners.container > div{
    gap:10px;
    }
    
   .store-footer  .md\:flex {
     background: #000;
}
    /**********animation*********/
    /* خلفية اللودينج */
/* شاشة اللودينج عبر ::after */
body::after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #000 url("https://i.postimg.cc/Dy7CQ2zt/37.png") no-repeat center center;
  background-size: 120px; /* حجم الشعار */
  z-index: 999999;
  animation: fadeOutLoader 1s ease 2.5s forwards, pulseLogo 2s ease-in-out infinite;
  pointer-events: all;
}

/* تأثير اختفاء شاشة اللودينج */
@keyframes fadeOutLoader {
  to {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }
}

/* نبض خفيف للشعار */
@keyframes pulseLogo {
  0%, 100% {
    background-size: 120px;
  }
  50% {
    background-size: 135px;
  }
}

    
    /**************media**********/
    
    @media(max-width:768px){
    #app > div.app-inner.flex.flex-col.min-h-full > section.s-block.s-block--banners.container > div{
    grid-template-columns: repeat(3,1fr) !important;
    }
    
    .banner-entry {
    height: 200px !important;
    background: #f9fafb;
}
    
    }