/* =========================================
   TEMA: LUXURY SPARKLING GOLD (Emas Berkilau)
   ========================================= */

/* --- 1. DEFINISI WARNA & EFEK KILAU --- */
:root {
    --gold-light: #fff6c3;    /* Emas sangat terang (highlight) */
    --gold-mid: #e5c15d;      /* Emas standar */
    --gold-dark: #b38f2d;     /* Emas gelap (shadow) */
    --gold-rich: #8a6e1c;     /* Emas tua untuk border */
    --sparkle-shadow: 0 0 15px rgba(255, 215, 0, 0.8), 0 0 30px rgba(255, 223, 0, 0.5); /* Efek cahaya */
}

/* --- 2. TOMBOL UTAMA (ACTION BUTTONS) --- */
/* Mengubah tombol biru/hijau menjadi Emas Metalik yang Sangat Mengkilap */
.bonus-slider-modal .activation-button,
.claim-item .claim-button,
.claim-item .activation-button,
.play-now,
.login-panel .login-button,
.login-panel .register-button,
.btn-primary,
.modal-footer .btn-primary {
    /* Gradasi diagonal tajam untuk efek logam */
    background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold-mid) 40%, var(--gold-dark) 60%, var(--gold-light) 100%) !important;
    background-size: 200% auto;
    color: #3a2c00 !important; /* Teks coklat tua agar kontras di atas emas */
    font-weight: bold;
    border: 2px solid var(--gold-light) !important;
    /* Bayangan ganda: satu untuk kedalaman 3D, satu untuk efek cahaya keluar (glow) */
    box-shadow: inset 0 2px 3px rgba(255, 255, 255, 0.6), inset 0 -2px 3px rgba(0, 0, 0, 0.2), 0 0 15px rgba(229, 193, 93, 0.6) !important;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.5);
    transition: all 0.4s ease;
}

/* Efek Hover: Lebih terang dan "menyala" */
.bonus-slider-modal .activation-button:hover,
.claim-item .claim-button:hover,
.play-now:hover,
.login-panel .login-button:hover,
.btn-primary:hover {
    background-position: right center !important; /* Menggerakkan gradasi saat hover */
    color: #000 !important;
    border-color: #fff !important;
    /* Efek kilau yang jauh lebih kuat saat di-hover */
    box-shadow: 0 0 25px rgba(255, 215, 0, 1), 0 0 50px rgba(255, 223, 0, 0.7) !important;
    transform: scale(1.02); /* Sedikit membesar */
}

/* --- 3. HEADER & NAVIGASI --- */
.site-header,
.modal-header {
    /* Latar belakang gelap agar emas menonjol */
    background: linear-gradient(to right, #2c2102, #5a4610, #2c2102) !important;
    border-bottom: 2px solid var(--gold-mid) !important;
    box-shadow: 0 5px 20px rgba(184, 134, 11, 0.4);
}

.modal-title,
.modal-header h4,
.top-menu > li {
    color: var(--gold-mid) !important;
    /* Efek teks emas */
    text-shadow: 0 0 5px rgba(255, 215, 0, 0.7), 0 0 10px rgba(184, 134, 11, 0.5);
}

.top-menu > li:hover,
.top-menu > li[data-active="true"] {
    color: #fff !important;
    text-shadow: 0 0 15px #ffd700, 0 0 30px #ffd700; /* Kilau teks ekstrem saat aktif */
}

/* --- 4. AKSEN TEKS & LINK --- */
/* Mengubah semua teks biru cyan menjadi emas */
a,
h1, h2, h3, h4, h5, h6,
.promotion-title,
.standard-nav-bar .nav-bar-title,
.info-center-container a {
    color: var(--gold-dark);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover,
.info-center-container a:hover {
    color: var(--gold-mid) !important;
    /* Teks bersinar saat di-hover */
    text-shadow: 0 0 8px rgba(229, 193, 93, 0.8);
}

/* --- 5. CONTAINER & KARTU (Cards) --- */
.claim-item,
.promotion-item,
.standard-side-menu a[data-active="true"],
.desktop-side-menu-group>li>a:not(.collapsed),
.notification-list .notification-item[data-seen="false"] {
    background-color: #fff !important; /* Latar tetap terang */
    border: 2px solid var(--gold-mid) !important; /* Border emas tebal */
    /* Aura emas di sekitar kotak */
    box-shadow: 0 0 20px rgba(229, 193, 93, 0.3) !important;
}

/* --- 6. PROGRESS BARS (Batang Proses) --- */
.bonus-progress .progress-bar.progress-bar-success,
.loyalty-level-container .loyalty-level-item .loyalty-level-progress-container .loyalty-level-progress-bar {
    /* Gradasi emas cair */
    background: linear-gradient(to right, var(--gold-dark), var(--gold-light), var(--gold-dark)) !important;
    box-shadow: 0 0 10px var(--gold-mid);
}

/* --- 7. INPUT FORM --- */
input[type=text],
input[type=password],
.form-control {
    border: 1px solid var(--gold-dark) !important;
    background-color: #fffcf2 !important; /* Putih kekuningan */
    color: #5a4610 !important;
}

input:focus,
.form-control:focus {
    border-color: var(--gold-mid) !important;
    box-shadow: 0 0 10px rgba(255, 215, 0, 0.5) !important; /* Fokus input menyala */
}

/* --- 8. JACKPOT (Dibuat Paling Menor) --- */
.home-progressive-jackpot .jackpot-container,
.jackpot-container {
    background: linear-gradient(to bottom, #5a4610 0%, #1a1200 100%) !important;
    border: 3px solid var(--gold-light) !important;
    box-shadow: 0 0 30px rgba(255, 215, 0, 0.6), inset 0 0 20px rgba(255, 215, 0, 0.4) !important;
    animation: pulseGold 2s infinite; /* Animasi berdenyut */
}

.jackpot-currency {
    color: #fff6c3 !important;
    font-weight: 900;
    text-shadow: 0 0 10px #ffd700, 0 0 20px #ffd700, 0 0 30px #ffd700; /* Teks jackpot sangat silau */
}

/* Animasi tambahan untuk efek berdenyut pada jackpot */
@keyframes pulseGold {
    0% { box-shadow: 0 0 30px rgba(255, 215, 0, 0.6); }
    50% { box-shadow: 0 0 50px rgba(255, 215, 0, 0.9); }
    100% { box-shadow: 0 0 30px rgba(255, 215, 0, 0.6); }
}