/* Scrollbar width */
::-webkit-scrollbar {
  width: 10px;
}

/* Scrollbar track (background) */
::-webkit-scrollbar-track {
  background: #1a1a1a; /* dark track */
  border-radius: 10px;
}

/* Scrollbar thumb (the draggable part) */
::-webkit-scrollbar-thumb {
    background: linear-gradient(45deg, #ff00cc, #00e5ff);

  border-radius: 10px;
}

/* On hover effect */
::-webkit-scrollbar-thumb:hover {
      background: linear-gradient(45deg, #00e5ff, #ff00cc);

}



    .maincon {
      margin: 0;
      font-family: Helvetica, Arial, sans-serif;
      color: #fff;
    }

    .ekart-container {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 50px;
      gap: 30px;
      flex-wrap: wrap;
    }

    .ekart-content {
      flex: 1 1 300px;
      max-width: 500px;
      padding-left: 90px;
    }
    @media (max-width: 768px) {
      .ekart-content {
        padding-left: 0;
      }
       .ekart-container {
        padding: 0px 20px;

        
       }
    }

    .ekart-content h1 {
      font-size: 2.5rem;
      margin-bottom: 20px;
      background: linear-gradient(45deg, #00e5ff, #ff00cc);
      -webkit-background-clip: text;
      color: transparent;
    }

    .ekart-content p {
      font-size: 1.1rem;
      line-height: 1.6;
      margin-bottom: 20px;
    }

    .ekart-button {
      padding: 12px 25px;
      font-size: 1rem;
      background: linear-gradient(45deg, #00e5ff, #ff00cc);
      border: none;
      border-radius: 8px;
      color: #fff;
      cursor: pointer;
      transition: 0.3s;
    }

    .ekart-button:hover {
      background: linear-gradient(45deg, #ff00cc, #00e5ff);
    }

    .ekart-swiper {
      flex: 1 1 300px;
      max-width: 400px;
      height: 300px;
      transform-style: preserve-3d;
    }

    .ekart-slide {
      background-position: center;
      background-size: cover;
      width: 100%;
      height: 100%;
    }

    .ekart-slide img {
      display: block;
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    /* Responsive */
    @media (max-width: 768px) {
      .ekart-container {
        flex-direction: column-reverse;
        align-items: center;
      }

    .ekart-slide img {
     margin-top: 40px;
    }
      .ekart-content,
      .ekart-swiper {     margin-bottom: 40px;

        max-width: 90%;
      }

      .ekart-content h1,
      .ekart-content p {
        text-align: center;
      }

      .ekart-button {
        display: block;
        margin: 0 auto;
      }
    }
/* Arrows default styling */

/* Responsive: make arrows smaller on mobile */
@media (max-width: 768px) {
  .ekart-prev::after,
  .ekart-next::after {
    display: none;
  }

  .ekart-content h1 {
    font-size: 2rem;
  }
}