.discount-badge {
        background-color: red;
        /* Warna latar belakang */
        font-size: 0.8rem;
        font-weight: bold;
        border-radius: 0 15px 0 15px;
        /* Sesuaikan dengan sudut div swiper-slide */
        box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
        /* Efek shadow */
        padding: 5px 10px;
        background: linear-gradient(45deg, #FF5733, #C70039);
        /* Efek gradient */
    }

    /* Media query untuk tampilan mobile */
    @media (max-width: 768px) {
        .discount-badge {
            font-size: 0.7rem;
            /* Ukuran font lebih kecil untuk mobile */
        }
    }

    @media (max-width: 576px) {
        .discount-badge {
            font-size: 0.6rem;
            /* Ukuran font lebih kecil untuk tampilan yang lebih kecil */
        }
    }

    /* Untuk tampilan mobile, atur ukuran font dan padding yang lebih kecil */
    @media (max-width: 576px) {
        .product-name {
            font-size: 14px;
            /* Atur ukuran font lebih kecil di mobile */
        }

        .product-price {
            font-size: 12px;
            /* Ukuran font harga lebih kecil */
        }

        .btn-add-to-cart {
            font-size: 12px;
            /* Ukuran font di tombol lebih kecil */
            padding: 8px 10px;
            /* Sesuaikan padding untuk tombol */
        }
    }

    /* Penyesuaian tombol untuk tablet */
    @media (min-width: 577px) and (max-width: 768px) {
        .btn-add-to-cart {
            font-size: 14px;
            /* Ukuran font medium untuk tablet */
            padding: 10px 12px;
            /* Padding yang sesuai untuk tablet */
        }
    }

    .product-card {
        border: none;
        /* Menghilangkan border default */
        border-radius: 10px;
        /* Radius sudut untuk kartu */
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
        /* Bayangan lembut */
        overflow: hidden;
        /* Menghindari konten keluar dari batas */
        background-color: #fff;
        /* Warna latar belakang putih */
    }

    .product-image {
        border-radius: 50%;
        /* Membuat gambar berbentuk bulat */
        width: 150px;
        /* Ukuran gambar produk */
        height: 150px;
        /* Ukuran gambar produk */
        object-fit: cover;
        /* Memastikan gambar terpotong dengan baik */
    }

    .product-image-hover {
        border-radius: 50%;
        /* Gambar hover berbentuk bulat juga */
        width: 150px;
        height: 150px;
        object-fit: cover;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        /* Awalnya tidak terlihat */
        transition: opacity 0.3s;
        /* Transisi saat hover */
    }

    .image-card-custom:hover .product-image-hover {
        opacity: 1;
        /* Tampilkan gambar hover saat mouse berada di atas */
    }

    .image-card-custom:hover .product-image {
        opacity: 0;
        /* Sembunyikan gambar utama saat hover */
    }

    .discount-badge {
        background-color: #FF5733;
        /* Warna badge diskon */
        border-radius: 5px;
        /* Radius sudut badge */
    }

    .product-info {
        text-align: center;
        /* Pusatkan teks */
    }

    .product-name {
        white-space: nowrap;
        /* Menghindari teks melipat ke baris baru */
        overflow: hidden;
        /* Menghilangkan teks yang melampaui area */
        text-overflow: ellipsis;
        /* Menambahkan ellipsis ketika teks terlalu panjang */
        width: 100%;
        /* Mengatur lebar penuh */
        display: block;
        /* Membuat elemen tampil sebagai blok */
    }


    .product-price {
        font-size: 14px;
        /* Ukuran font untuk harga */
        color: #555;
        /* Warna teks untuk harga */
    }

    .btn-add-to-cart {
        width: 100%;
        /* Tombol memenuhi lebar kartu */
        background-color: #1EB9A7;
        /* Warna tombol */
        color: white;
        /* Warna teks tombol */
        border: none;
        /* Hilangkan border tombol */
        border-radius: 5px;
        /* Radius sudut tombol */
        padding: 10px;
        /* Padding untuk tombol */
    }

    .small-text {
        font-size: 0.8rem;
        /* Atur ukuran font lebih kecil, Anda bisa sesuaikan sesuai kebutuhan */
        font-weight: normal;
        /* Atur menjadi normal (biasa) */
        font-style: normal;
        /* Atur menjadi normal */
        margin: 0;
        /* Menghilangkan margin jika perlu */
    }