body{
    overflow-x: hidden;
}
header{
    /* background-color: #2b0394; */
    /* background: linear-gradient(to to right, #d0ac31, #f1d87a); */
    /* background: linear-gradient(to top, #fff700, #ffbc00); */

 box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);

}
header i{
    color: #2b0394;
}
header p {
    color: #2b0394;
}
/* Custom slower bounce-in-up */
  @keyframes customBounceInUp {
    0% {
      opacity: 0;
      transform: translateY(50px);
    }
    60% {
      opacity: 1;
      transform: translateY(-10px);
    }
    80% {
      transform: translateY(5px);
    }
    100% {
      transform: translateY(0);
    }
  }

  /* Custom slower bounce-out-down */
  @keyframes customBounceOutDown {
    0% {
      opacity: 1;
      transform: translateY(0);
    }
    20% {
      transform: translateY(5px);
    }
    100% {
      opacity: 0;
      transform: translateY(50px);
    }
  }

  .animate__customBounceInUp {
    animation: customBounceInUp 0.8s ease;
  }
  .animate__customBounceOutDown {
    animation: customBounceOutDown 0.6s ease;
  }
  .card-product-v2 span.text-decoration-line-through.text-muted{
    font-size: 13px;
  }
  /* Bottom Navigation */
    .bottom-nav {
      position: fixed;
      bottom: 0;
      left: 0;
      width: 100%;
      background: linear-gradient(135deg, #ff9c00, #ffcc00);
      display: flex;
      justify-content: space-around;
      align-items: center;
      padding: 10px 0;
      border-radius: 20px 20px 0 0;
      box-shadow: 0 -2px 15px rgba(0,0,0,0.3);
      z-index: 99999;
    }

    .bottom-nav a {
      color: #fff;
      text-decoration: none;
      font-size: 14px;
      text-align: center;
      transition: 0.3s;
    }

    .bottom-nav a i {
      display: block;
      font-size: 22px;
      margin-bottom: 3px;
    }

    .bottom-nav a.active, 
    .bottom-nav a:hover {
      color: #000;
      transform: translateY(-3px);
    }

   
  /* Mobile Devices (Portrait) */
@media (max-width: 768px) {
  html{
    margin-top: -18px;
    /* margin-right: -18px; */
    overflow-x: hidden;
  }
  img.img.img-fluid.w-75 {
    width: 150px !important;
}
.carousel-inner {
    height: 100px !important;
}
.carousel-item{
  height: 100px !important;
}
a.text-inherit {
    font-size: 15px;
}
.m-button{
  display: none !important;
}
}

/* SweetAlert2 Custom Ewallet Theme */
.swal2-popup {
    border-radius: 20px !important;
    padding: 25px !important;
    background: #fff;
    box-shadow: 0px 5px 25px rgba(0, 0, 0, 0.2);
    font-family: 'Poppins', sans-serif;
}

.swal2-title {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #deb729 !important;
}

.swal2-html-container {
    font-size: 15px !important;
    color: #deb729 !important;
}

.swal2-confirm {
    background-color: #2b0394 !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 10px 25px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border: none !important;
    transition: background 0.3s ease;
}

.swal2-confirm:hover {
    background-color: #3702bd !important;
}

.swal2-cancel {
    background-color: #deb729 !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 10px 25px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    border: none !important;
    transition: background 0.3s ease;
}

.swal2-cancel:hover {
    background-color: #deb729 !important;
}

.swal2-icon {
    border-width: 3px !important;
}

.swal2-icon.swal2-error {
    border-color: #ff4d4d !important;
    color: #ff4d4d !important;
}

.swal2-icon.swal2-success {
    border-color: #00c851 !important;
    color: #00c851 !important;
}

.swal2-icon.swal2-warning {
    border-color: #ffbb33 !important;
    color: #ffbb33 !important;
}

.swal2-icon.swal2-info {
    border-color: #2b0394 !important;
    color: #2b0394 !important;
}
.scrolling-wrapper {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.scrolling-wrapper::-webkit-scrollbar {
  display: none;
}

.category-card {
  /* min-width: 120px; */
  flex: 0 0 auto;
}

.cat-scroll-btn {
  background: #fff;
  border: 1px solid #ddd;
  padding: 0.5rem 0.75rem;
  font-size: 1.5rem;
  z-index: 10;
  opacity: 0.7;
  transition: opacity 0.2s ease;
}
.cat-scroll-btn:hover {
  opacity: 1;
}
@media only screen and (max-width: 600px) {
  body{
    padding-bottom: 70px !important;
  }
}
   .nav-category .nav.flex-column .category-active {
      color: #2b0394 !important;
   }
   @media (min-width: 992px) {
 .offcanvas-start {
  visibility: hidden;
  transform: translateX(-100%);
  width: 30% !important;
  transition: transform 0.3s ease-in-out, visibility 0.3s ease-in-out; /* Smooth slide */
}

.offcanvas-start.show {
  visibility: visible;
  transform: translateX(0); /* Slide in */
}

}