.btn-primary {
    background-color: #f4e400 !important;
    border: #f4e400 !important;
    color: black;
}

.btn-primary:hover {
    background-color: #cfc756 !important;
    color: black;
}

.btn-outline-primary {
    /* background-color: #F4E400 !important; */
    border-color: #f4e400 !important;
    color: black;
}

.btn-outline-primary:hover {
    background-color: #f4e400 !important;
    color: black;
}

/* navbar */
#mainNav {
    background-color: #ffffff !important;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075); /* Shadow tipis */
    transition: none; /* Hilangkan transisi di mobile */
}

/* Pastikan teks tetap gelap di mobile */
#mainNav .navbar-nav .nav-link,
#mainNav .navbar-brand {
    color: #212529 !important;
}

/* ------------------------------------------------ */
/* DESKTOP (Min-width 992px): Aktifkan Transparan */
/* ------------------------------------------------ */
@media (min-width: 992px) {
    /* Awal: Transparan di desktop */
    #mainNav.navbar-transparent {
        background-color: transparent !important;
        box-shadow: none;
        transition: background-color 0.4s ease, box-shadow 0.4s ease; /* Aktifkan transisi di desktop */
    }

    /* Ubah warna teks menjadi putih di desktop (karena hero section gelap) */
    #mainNav.navbar-transparent .navbar-nav .nav-link,
    #mainNav.navbar-transparent .navbar-brand {
        color: #ffffff !important;
    }

    /* Gaya Scroll di Desktop (sama seperti sebelumnya) */
    #mainNav.navbar-scrolled {
        background-color: #ffffff !important;
        box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
    }
    /* Teks navbar-scrolled otomatis gelap karena kita pakai navbar-light */
}

/* Gaya setelah scroll (dibuat oleh JS) */
.navbar-scrolled {
    background-color: #ffffff !important; /* Putih Solid */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); /* Shadow halus */
}

/* Ganti warna teks navbar menjadi gelap ketika sudah di-scroll */
.navbar-scrolled .navbar-nav .nav-link,
.navbar-scrolled .navbar-brand {
    color: #212529 !important; /* Warna gelap */
}

/* Ganti ikon toggle menjadi gelap ketika sudah di-scroll */
.navbar-scrolled .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23000' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

/* end navbar */