/* Add custom CSS styles below */  
/* .banner-square .box-img {
  position: relative;
  border-radius: 12px;
  padding: 3px;
  z-index: 1;
 
  background: linear-gradient(
    60deg, 
    #74070e, 
    rgba(116, 7, 14, 0.1), 
    #74070e, 
    rgba(116, 7, 14, 0.1), 
    #74070e
  );
  background-size: 300% 300%;
  animation: elegant-glow 4s ease-in-out infinite; 
} */


/* .banner-square .box-img::after {
  content: "";
  position: absolute;
  top: 3px; 
  right: 3px; 
  bottom: 3px; 
  left: 3px;
  background-color: #FFFFFF;
  border-radius: 9px;
  z-index: -1;
} */


/* @keyframes elegant-glow {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}  */
/* ============= Header Colors ============== */
.store-header .da-tm {
  color: var(--data-menu-color) !important; /* قبل الاسكرول */
}

.store-header.scrolled .da-tm {
  color: var(--data-menu-color) !important; /* بعد الاسكرول */
}
.angel-ad{
  background-color:var(--data-menu-color) !important;
}
/* ============= Menu Icon ============= */
.store-header .sicon-menu {
  color: var(--data-menu-color) !important; /* قبل الاسكرول */
}

/* ============= Footer Colors ============= */
.store-footer,
.store-footer * {
  color: white !important;
}

footer.store-footer {
  color: white;
}

footer.store-footer a,
footer.store-footer p,
footer.store-footer h2,
footer.store-footer h3,
footer.store-footer span,
footer.store-footer .social-label,
footer.store-footer .copyrights p {
  color: white !important;
}
footer.store-footer .s-contacts-icon svg,footer.store-footer .s-social-link a svg {

    fill: var(--data-menu-color) !important;
}


/* ============ Scroll Animation ============ */
@keyframes zoomInFade {
  0% {
    opacity: 0;
    transform: scale(0.9);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}

/* ============== Banner Card ============== */
.banner-square {
  opacity: 0;
  transform: scale(0.9);
  transition: transform 0.4s ease, box-shadow 0.4s ease;
  position: relative;
  overflow: hidden;
  padding: 2px;
  border-radius: 12px;
  background: linear-gradient(135deg, #e33d43, #6c2e2a, #ff0000, #f0c987);

  background-size: 300% 300%;
  animation: borderRotate 6s linear infinite;
}

/* الصورة داخل الكارت */
.banner-square .box-img {
  border-radius: 10px;
  background: #fff;
  overflow: hidden;
}

/* تظهر عند دخول العنصر للشاشة */
.banner-square {
  animation: zoomInFade 0.6s ease-out forwards;
}

/* Hover تأثير */
.banner-square:hover {
  transform: scale(1.2) translateY(-5px);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.25);
  z-index: 3;
}

/* Animation للبوردر (Linear Gradient) */
@keyframes borderRotate {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

/* Animation للبوردر (Conic Gradient دائري) */
.banner-square::before {
  content: '';
  position: absolute;
  top: -2px;
  left: -2px;
  right: -2px;
  bottom: -2px;
  z-index: -1;
  background: conic-gradient(from 0deg, #e12930, #f1a090, #c99999, #f1b0b0);
  animation: rotateBorder 3s linear infinite;
  border-radius: 14px;
}

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

.banner-square .text-center{
  display:none !important;
}
/* ============ Categories Card ============ */
.main-categories .banner-square {
    margin: 1px 10px;
    padding: 2px !important;
}
.main-categories .banner-square{
  margin: 1px 10px;
  padding: 2px !important;
}


/* ===== Scroll Animation CSS ===== */
.title-wrapper p{
  display: none;
}
.btn {
    color:black;
}
[type=submit].s-button-primary{
  background: #050505;
}
.bottom-header.opacity-90.bg-white.da-bgm {
   border-radius: 0;
    border-top-left-radius: .375rem;
    border-top-right-radius: 0.375rem;
  margin: 0;
}
.angel-products-container .title-wrapper .flex.flex-col.w-full {
    border-right: 6px solid #6c0407;
    padding-right: 7px;
}