/* desktop-HadesMJ-C11-REVISI-AKHIR-V2.css - Tema Cyber Neon Glow HIJAU & BIRU (Background Konten Diubah) */

/* Warna Dominan: Dark Blue/Green, Electric Green (#00FF00), Electric Cyan (#00FFFF) */

/* ========================================================= */
/* 1. KEYFRAMES & FONT (Untuk Efek Berdenyut dan Gelombang) */
/* ========================================================= */

/* Animasi Denyut (Pulsing Glow) Electric Green (Primary Glow) */
@keyframes neon-pulse-green {
    0% { box-shadow: 0 0 10px rgba(0, 255, 0, 0.8), 0 0 20px rgba(0, 255, 0, 0.4); }
    50% { box-shadow: 0 0 30px rgba(0, 255, 0, 1.5), 0 0 60px rgba(0, 255, 0, 0.8); } 
    100% { box-shadow: 0 0 10px rgba(0, 255, 0, 0.8), 0 0 20px rgba(0, 255, 0, 0.4); }
}

/* Animasi Denyut (Pulsing Glow) Neon Cyan (Secondary Glow) */
@keyframes neon-pulse-cyan {
    0% { box-shadow: 0 0 15px rgba(0, 255, 255, 1.0), 0 0 30px rgba(0, 255, 255, 0.6); }
    100% { box-shadow: 0 0 5px rgba(0, 255, 255, 0.5), 0 0 15px rgba(0, 255, 255, 0.3); }
}

/* ========================================================= */
/* 2. LATAR BELAKANG DAN HEADER/TOPBAR (HIJAU & BIRU) */
/* ========================================================= */
body {
    /* Background Hitam Pekat dengan Aksen Deep Cyber Blue/Green */
    background-image: none !important;
    background-color: #000210 !important; /* Darker/Black Blueish */
    color: #E0E0E0; 
    font-family: 'Inter', sans-serif;
    min-height: 100vh;
    box-shadow: inset 0 0 50px rgba(0, 255, 255, 0.05), inset 0 0 50px rgba(0, 255, 0, 0.05); /* Cyan & Green */
}

/* Kontainer Utama (Kotak Konten Game) - LATAR BELAKANG DIUBAH SESUAI PERMINTAAN */
.site-content-container, [data-container-background] {
    background-color: #021010 !important; /* Deep Cyber Green/Blue Dark Base */
    border-radius: 16px;
    
    /* Bingkai Holographic 3D (Utama Cyan, Outline Hijau) */
    border: 3px solid #00FFFF; /* Border utama Cyan (Biru) */
    outline: 3px solid #00FF00; /* Outline sekunder Green (Hijau) */
    outline-offset: -8px; 
    
    /* Glow Multi Layer (3D Lift) - Green & Cyan */
    box-shadow: 
        0 0 5px rgba(255, 255, 255, 0.5),   
        0 0 20px rgba(0, 255, 255, 1.2),    /* Cyan Glow SANGAT KUAT */
        0 0 40px rgba(0, 255, 0, 1.0),    /* Green Glow SANGAT KUAT */
        8px 8px 15px rgba(0, 0, 0, 0.9);    
}

/* Header/Topbar dengan Gradien Cyber (Background Disesuaikan dengan Hijau & Biru) */
.topbar-container, .site-header {
    /* Background Cyber Green Neon Glow & Cyber Blue Neon Glow */
    background: linear-gradient(to right, #001A00 0%, #002020 50%, #001A00 100%) !important; 
    
    /* Border Holografis Kuat (Sinar utama Header) */
    border-bottom: 3px solid;
    border-image: linear-gradient(to right, #00FF00 0%, #00FFFF 100%) 1; /* Green ke Cyan */
    border-image-slice: 1;
    
    /* Glow Multi Layer (3D Lift) - Cyan & Green */
    box-shadow: 
        0 0 10px rgba(255, 255, 255, 0.5),   
        0 0 35px rgba(0, 255, 255, 1.5),     /* Cyan Glow SANGAT KUAT */
        0 0 60px rgba(0, 255, 0, 0.8);     /* Green Glow Kuat */
    
    animation: neon-pulse-cyan 4s infinite alternate ease-in-out; 
}

/* ========================================================= */
/* 3. TOMBOL MASUK & DAFTAR (HIJAU & BIRU) */
/* ========================================================= */
.login-panel .login-button, .login-panel .register-button {
    font-weight: 700;
    font-size: 1.1em; 
    padding: 10px 20px; 
    border-radius: 12px; 
    position: relative;
    overflow: hidden;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Tombol Masuk (LOGIN) - Electric Cyan 3D */
.login-panel .login-button {
    background-color: #001A20 !important; 
    color: #FFFFFF; 
    border: 3px solid #00FFFF; 
    outline: 3px solid #00FF00; 
    outline-offset: -5px; 
    
    box-shadow: 
        inset 0 0 10px rgba(255, 255, 255, 0.3), 
        0 0 25px rgba(0, 255, 255, 1.5), 
        0 0 50px rgba(0, 255, 0, 0.7), 
        -8px -8px 0 0 #005555, 
        -8px -8px 20px rgba(0, 255, 255, 0.3); 
}
.login-panel .login-button:hover {
    background-color: #002A30 !important; 
    box-shadow: 
        inset 0 0 15px rgba(255, 255, 255, 0.5),
        0 0 50px rgba(0, 255, 255, 2), 
        -8px -8px 0 0 #008888;
    transform: translate(3px, 3px); 
}

/* Tombol Daftar (REGISTER) - Neon Green 3D & Pulsing */
.login-panel .register-button {
    background-color: #002000 !important; 
    color: #FFFFFF; 
    border: 3px solid #00FF00; 
    outline: 3px solid #00FFFF; 
    outline-offset: -5px; 
    
    box-shadow: 
        inset 0 0 10px rgba(255, 255, 255, 0.3), 
        0 0 30px rgba(0, 255, 0, 2), 
        0 0 60px rgba(0, 255, 255, 0.8), 
        8px 8px 0 0 #005500, 
        8px 8px 20px rgba(0, 255, 0, 0.4); 
        
    animation: neon-pulse-green 2s infinite ease-in-out; 
}
.login-panel .register-button:hover {
    background-color: #003000 !important;
    box-shadow: 
        inset 0 0 15px rgba(255, 255, 255, 0.5),
        0 0 60px rgba(0, 255, 0, 2.5), 
        8px 8px 0 0 #008800;
    animation: none;
    transform: translate(-3px, -3px); 
}

/* ========================================================= */
/* 4. IKON MENU NAVIGASI (VARIASI BENTUK & HIJAU/BIRU) */
/* ========================================================= */

/* Wrapper/Link Ikon */
.site-header .top-menu>li>a {
    transition: all 0.3s;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 10px; 
    border-radius: 8px;
    background-color: transparent;
}

/* Ikon itu sendiri (Filter, Gambar, atau SVG) - DENGAN VARIASI BENTUK */
.icon-3d-glow, .site-header .top-menu>li>a .icon, .site-header .top-menu>li>a img {
    width: 40px; 
    height: 40px; 
    object-fit: contain;
    padding: 5px;
    
    /* VARIASI BENTUK: Dari kotak sempurna menjadi bentuk yang lebih dinamis */
    border-radius: 15px 5px 15px 5px; 

    /* Background Neon Transparan (Green) */
    background: rgba(0, 255, 0, 0.1); 
    
    /* Bingkai Holographic 3D (Border Cyan, Outline Green) */
    border: 3px solid #00FFFF; 
    outline: 3px solid #00FF00; 
    outline-offset: -8px; 

    /* Glow Multi Layer (3D Lift) - Cyan & Green */
    box-shadow: 
        0 0 5px rgba(255, 255, 255, 0.5),   
        0 0 15px rgba(0, 255, 255, 1),      
        0 0 30px rgba(0, 255, 0, 0.8),    
        4px 4px 10px rgba(0, 0, 0, 0.9);    
        
    filter: drop-shadow(0 0 10px #00FF00) brightness(1.3); 
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Ikon Hover (Efek Hyper-Glow) */
.icon-3d-glow:hover, .site-header .top-menu>li:hover>a .icon, .site-header .top-menu>li:hover>a img {
    background: rgba(0, 255, 255, 0.1); 
    border-color: #00FF00; 
    outline-color: #00FFFF; 
    
    box-shadow: 
        0 0 10px rgba(255, 255, 255, 0.7),
        0 0 30px rgba(0, 255, 0, 1.5), 
        0 0 60px rgba(0, 255, 255, 1.2),
        6px 6px 20px rgba(0, 0, 0, 1);
        
    transform: translateY(-5px) scale(1.1); 
    filter: drop-shadow(0 0 15px #00FFFF) brightness(1.5); 
}

/* Teks di bawah Ikon */
.site-header .top-menu>li>a span {
    color: #00FF00; 
    text-shadow: 0 0 8px rgba(0, 255, 0, 0.6);
    font-weight: 600;
    margin-top: 5px;
    transition: color 0.3s;
}

.site-header .top-menu>li:hover>a span {
    color: #00FFFF; 
    text-shadow: 0 0 10px rgba(0, 255, 255, 0.8);
}

/* Menu Item Aktif (Glow Dominan) - DENGAN VARIASI BENTUK */
.site-header .top-menu>li[data-active="true"]>a {
    background: #081818; 
    border: 1px solid #00FF00; 
    
    /* VARIASI BENTUK: Disesuaikan dengan ikon */
    border-radius: 18px 6px 18px 6px; 
    
    box-shadow: 0 0 35px rgba(0, 255, 0, 1.5); 
}

.site-header .top-menu>li[data-active="true"]>a .icon, .site-header .top-menu>li[data-active="true"]>a img {
     border-color: #00FF00;
     outline-color: #00FFFF;
     box-shadow: 
        0 0 5px rgba(255, 255, 255, 0.5), 
        0 0 25px rgba(0, 255, 0, 1.5), 
        0 0 50px rgba(0, 255, 255, 1);
     transform: scale(1.05);
}


/* ========================================================= */
/* 5. WIDGET (JACKPOT & SGP 4D) - HIJAU & BIRU */
/* ========================================================= */

/* Kotak Jackpot & Jumlah (Jackpot Box) - Green Neon 3D */
.home-progressive-jackpot .jackpot-container {
    background: #102010; 
    
    /* Bingkai 3D Kuat - Border Green, Outline Cyan */
    border: 3px solid #00FF00; 
    outline: 3px solid #00FFFF; 
    outline-offset: -8px; 
    border-radius: 30px; 
    
    box-shadow: 
        0 0 15px rgba(0, 255, 0, 1.5),     
        0 0 35px rgba(0, 255, 255, 0.8),   
        inset 0 0 20px rgba(255, 255, 255, 0.2), 
        10px 10px 20px rgba(0, 0, 0, 0.9);   
        
    padding: 15px 30px;
}

/* Kotak Angka Jackpot (Digit Box) - Sangat Neon dan 3D */
.home-progressive-jackpot .jackpot-amount-wrapper {
    background: #000000; 
    border: 2px solid #00FFFF; 
    border-radius: 15px;
    outline: 2px solid #00FF00; 
    outline-offset: -5px;
    
    box-shadow: 
        0 0 10px rgba(0, 255, 255, 1.0), 
        0 0 25px rgba(0, 255, 0, 1.2); 
}

.home-progressive-jackpot .jackpot-amount {
    color: #00FF00; 
    font-family: 'Digital-7', monospace; 
    text-shadow: 0 0 15px #00FF00, 0 0 40px rgba(0, 255, 0, 1.0); 
    letter-spacing: 3px;
}
.home-progressive-jackpot .jackpot-currency {
    color: #00FFFF; 
    text-shadow: 0 0 10px #00FFFF; 
}