/* Add custom CSS styles below */

.w-full salla-button.s-button-wrap button {
  /* Existing styles */
  background-color: rgb(32, 175, 231) !important;
  border-color: rgb(32, 175, 231) !important;
  color: white !important;
  /* Add a transition for smoothness */
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

.w-full salla-button.s-button-wrap button:hover {
  background-color: rgb(2, 145, 201) !important; /* Darker shade on hover */
  border-color: rgb(2, 145, 201) !important; /* Match border color */
  /* color: white !important; */ /* Optional: change text color on hover */
  cursor: pointer; /* Indicate it's clickable */
}
.s-products-slider-card.swiper-slide {
  padding: 0px 3px !important; /* You might need !important depending on specificity */
}

.s-block--store-features-icon.flex.items-center.justify-center.w-12.h-12.mb-4.ltr\:mr-2.rtl\:ml-2.rounded-full.bg-primary.lg\:mb-0 {
  background-color: rgb(255, 255, 255);
}
.s-block--store-features i[class*="sicon-"],
.s-block--store-features .icon {
  font-size: 64px !important; /* Or your desired size */
  width: auto !important;
  height: auto !important;
  height: auto !important;
  color: rgb(32,175,231) !important;
}
.s-block.s-block--store-features .container div.relative.anime-item {
  border-radius: 12px;
}
.s-block--enhanced-features .s-block--enhanced-features__item {
  border-radius: 12px;
}