/* Background Gradient Menu */
    /*.bg-menu {*/
    /*    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(204, 255, 255, 1), rgba(0, 201, 255, 0.5));*/
    /*    background-size: 400% 400%;*/
    /*    animation: gradientMove 4s ease-in-out infinite;*/
    /*}*/
.bg-menu {
    background: linear-gradient(135deg, #6a11cb, #2575fc, #6a11cb);
    background-size: 400% 400%;
    animation: gradientMove 4s ease-in-out infinite;
}


    /* Keyframes for gradient movement */
    @keyframes gradientMove {
        0% { background-position: 0% 50%; }
        50% { background-position: 100% 50%; }
        100% { background-position: 0% 50%; }
    }

    /* Background Image and Animation */
    .bg-img {
        background: linear-gradient(135deg, rgba(173, 216, 230, 0.6), rgba(255, 105, 180, 0.9), rgba(255, 204, 0, 0.6), rgba(255, 127, 80, 0.8));
        background-size: 400% 400%;
        animation: gradientMove 4s ease-in-out infinite;
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 60px;
        height: 60px;
    }

    /* Menu Text */
    .menu-text {
        display: flex;
        justify-content: center;
        align-items: center;
        text-align: center;
        width: 100%;
        min-width: max-content;
        white-space: nowrap;
        font-size: clamp(13px, 3vw, 18px); /* Min 12px, ideal 2vw, max 16px */
    }
/* Background Image with Glow Effect */
.bg-menu-utama {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    animation: glowing 1.5s infinite alternate;
}

/* Menambahkan layer transparan */
.bg-menu-utama::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("assets/img/1bg.png") 
        no-repeat center center/cover;
    opacity: 0.9; /* Mengatur opacity background */
    z-index: -1;
    border-radius: 8px;
}
    /* Keyframes for glow effect */
    @keyframes glowing {
        0% {
            box-shadow: 0 0 10px rgba(248, 249, 250, 0.7), 0 0 20px rgba(248, 249, 250, 0.5);
        }
        50% {
            box-shadow: 0 0 20px rgba(248, 249, 250, 1), 0 0 40px rgba(255, 255, 255, 1);
        }
        100% {
            box-shadow: 0 0 10px rgba(248, 249, 250, 0.7), 0 0 20px rgba(248, 249, 250, 0.5);
        }
    }