/* Container Background */
.bg-container {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: -1;
    background-color: #0f172a;
}

/* Slide Item - LOGIKA BARU (Transition instead of Keyframes) */
.bg-slide {
    position: absolute; inset: 0;
    background-size: cover; background-position: center;
    opacity: 0; 
    transform: scale(1);
    /* Transisi Opacity 2s, Transisi Zoom 15s linear agar smooth */
    transition: opacity 2s ease-in-out, transform 15s linear;
}

/* State Aktif */
.bg-slide.active { 
    opacity: 1; 
    transform: scale(1.15); /* Zoom in pelan-pelan saat aktif */
}

/* Overlay Gelap untuk Background agar teks selalu kontras */
.bg-overlay {
    position: absolute; inset: 0; background: rgba(0,0,0,0.4); z-index: 0;
}

/* Dark Glassmorphism Modal */
.glass-dark {
    background: rgba(15, 23, 42, 0.65); /* Slate-900 dengan opacity */
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5);
}

/* Input Autofill Fix (Agar warna tidak berubah jadi putih/kuning default browser) */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px #1e293b inset !important;
    -webkit-text-fill-color: white !important;
    transition: background-color 5000s ease-in-out 0s;
}

#modalAlert {
    transition: visibility 0s linear 0.3s, opacity 0.3s ease-out;
    visibility: hidden;
    opacity: 0;
}
#modalAlert.show {
    visibility: visible;
    opacity: 1;
    transition-delay: 0s;
}

#modalContent {
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.3s ease-out;
    transform: scale(0.9);
    opacity: 0;
}
#modalAlert.show #modalContent {
    transform: scale(1);
    opacity: 1;
}

#modalBackdrop {
    transition: opacity 0.3s ease-out;
    opacity: 0;
}
#modalAlert.show #modalBackdrop {
    opacity: 1;
}