/* Sembunyikan scrollbar */
::-webkit-scrollbar {
    width: 0px;
    height: 0px;
    background: transparent;
}

body {
    background-color: #f3f4f6;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.product-image {
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

/* Animasi loading sederhana */
.loading-dots:after {
    content: '.';
    animation: dots 1s steps(5, end) infinite;
}

@keyframes dots {

    0%,
    20% {
        content: '.';
    }

    40% {
        content: '..';
    }

    60% {
        content: '...';
    }

    80%,
    100% {
        content: '';
    }
}

html {
    scroll-behavior: smooth;
}

/* Animasi Transisi Ekspansi Kategori */
#categoryExpandSection {
    transition: all 0.3s ease-in-out;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
}

#categoryExpandSection.show {
    max-height: 500px;
    opacity: 1;
    margin-top: 0.5rem;
}

/* Scroll horizontal styling */
.scroll-container {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

/* Custom Radius - Tidak terlalu rounded, konsisten untuk semua tombol filter */
.custom-radius {
    border-radius: 8px;
}

/* Animasi Kelap-kelip Oranye */
.animate-blink-orange {
    animation: blink-orange 1.5s infinite;
}

@keyframes blink-orange {

    0%,
    100% {
        opacity: 1;
        color: #f97316;
    }

    /* Orange-500 */
    50% {
        opacity: 0.3;
        color: #fb923c;
    }

    /* Orange-400 */
}