/* ============================================================
   CRIMSON DRAGON OVERRIDE — KELASTOTO
   Dimuat TERAKHIR di head agar menang dari tema warna DB mana pun.
   ============================================================ */
:root {
  --header-color: var(--kel-panel,#1F0505);
  --navbar-color: var(--kel-primary,#E60000);
  --primary-color: var(--kel-primary,#E60000);
  --secondary-color: var(--kel-secondary,#FF4D4D);
  --lottery-color: var(--kel-bg,#140000);
  --footer-color: var(--kel-panel,#1F0505);
  --header-text: #ffffff;
  --navbar-text: #ffffff;
  --jackpot-text: var(--kel-secondary,#FF4D4D);
  --primary-text: #ffffff;
  --secondary-text: #ffffff;
  --lottery-text: var(--kel-text,#F5E6E6);
  --footer-text: #ffffff;
  --c-white: #ffffff;
  --c-black: #0c0c0c;
  --c-grey: #181818;
  --background-page: var(--kel-bg,#140000);
  --page-text: var(--kel-text,#F5E6E6);
  --gold-primary: #d4af37;
  --gold-light: #f5e7a3;
  --gold-gradient: linear-gradient(135deg, var(--kel-dark,#730000) 0%, var(--kel-primary,#E60000) 25%, var(--kel-dark,#730000) 50%, var(--kel-secondary,#FF4D4D) 75%, var(--kel-bg,#140000) 100%);
  --btn-gold: linear-gradient(180deg, var(--kel-secondary,#FF4D4D) 0%, var(--kel-primary,#E60000) 50%, var(--kel-dark,#730000) 100%);
  --panel-bg: linear-gradient(160deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%);
}

body,
.main-content,
.home {
  background: var(--kel-bg,#140000) !important;
  color: var(--kel-text,#F5E6E6) !important;
}

/* ---------- HEADER ---------- */
.header {
  background: linear-gradient(180deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%) !important;
  border-bottom: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}
.header__top {
  background: rgba(0, 0, 0, .3) !important;
  color: var(--kel-text,#F5E6E6) !important;
}
.header__mid {
  background: transparent !important;
}
.header-time,
.header-marquee .marquee,
.header-icons i {
  color: var(--kel-text,#F5E6E6) !important;
}

/* ---------- NAVBAR ---------- */
.header-nav .navbar {
  background: linear-gradient(135deg, var(--kel-dark,#730000) 0%, var(--kel-primary,#E60000) 25%, var(--kel-dark,#730000) 50%, var(--kel-secondary,#FF4D4D) 75%, var(--kel-bg,#140000) 100%) !important;
}
.header-nav .navbar-nav .nav-link {
  color: #ffffff !important;
}
.header-nav .navbar-nav .nav-link:hover {
  color: var(--kel-secondary,#FF4D4D) !important;
  background: rgba(var(--kel-primary-rgb,230,0,0), .2) !important;
}

/* ---------- HEADER MOBILE ---------- */
.header-mobile {
  background: linear-gradient(180deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%) !important;
  border-bottom: 2px solid var(--kel-primary,#E60000) !important;
}
.header-mobile__top {
  background: transparent !important;
}
.header-mobile__marquee,
.header-mobile__marquee .marquee {
  color: var(--kel-text,#F5E6E6) !important;
}
.header-mobile__marquee i {
  color: var(--kel-secondary,#FF4D4D) !important;
}
.mobile-button--menu,
.mobile-button--register,
.mobile-button--transaksi {
  background: linear-gradient(180deg, var(--kel-secondary,#FF4D4D) 0%, var(--kel-primary,#E60000) 100%) !important;
  color: #ffffff !important;
  border: 1px solid var(--kel-secondary,#FF4D4D) !important;
}
.mobile-button--menu span,
.mobile-button--register span,
.mobile-button--transaksi span {
  color: #ffffff !important;
}

/* ---------- TOMBOL MASUK / DAFTAR ---------- */
.button-login,
.btn-daftar {
  background: linear-gradient(180deg, var(--kel-secondary,#FF4D4D) 0%, var(--kel-primary,#E60000) 100%) !important;
  color: #ffffff !important;
  border: 1px solid var(--kel-secondary,#FF4D4D) !important;
}
.button-login:hover,
.btn-daftar:hover {
  background: linear-gradient(180deg, var(--kel-primary,#E60000) 0%, var(--kel-dark,#730000) 100%) !important;
  color: #ffffff !important;
}

/* ---------- JACKPOT ---------- */
.home__jackpot {
  background: linear-gradient(180deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%) !important;
  border-top: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
  border-bottom: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}
.home__jackpot .jackpot-gif .jackpot-amount {
  color: #ffffff !important;
  text-shadow: 0 0 10px var(--kel-secondary,#FF4D4D), 0 0 20px var(--kel-primary,#E60000) !important;
}

/* ---------- MENU / GAMES ---------- */
.home__menu {
  background: var(--kel-panel,#1F0505) !important;
}
.home__menu .menu-container {
  background: linear-gradient(160deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%) !important;
  border: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}
.home__menu .menu-container .menu-right .menu-games .games-item .games-border {
  background: linear-gradient(180deg, var(--kel-primary,#E60000) 0%, var(--kel-dark,#730000) 100%) !important;
}
.home__menu .menu-container .download-border {
  background: linear-gradient(180deg, var(--kel-primary,#E60000) 0%, var(--kel-dark,#730000) 100%) !important;
}

/* ---------- PAYMENT / PROVIDER ---------- */
.home__payment {
  background: var(--kel-bg,#140000) !important;
}
.home__payment .payment-border {
  background: var(--kel-panel,#1F0505) !important;
  border: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}

/* ---------- SEO ---------- */
.home__seo,
.home__seo .seo-content,
.home__seo .seo-mobile {
  background: var(--kel-panel,#1F0505) !important;
  color: #D4C0C0 !important;
  border-top: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}

/* ---------- PAGE HEADER ---------- */
.page-header {
  background: linear-gradient(135deg, var(--kel-panel,#1F0505), var(--kel-panel,#1F0505)) !important;
  color: var(--kel-secondary,#FF4D4D) !important;
  border: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}

/* ---------- FOOTER ---------- */
.footer__provider {
  background: var(--kel-panel,#1F0505) !important;
  border-top: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
}
.footer__trademark {
  background: var(--kel-bg,#140000) !important;
  color: #A58282 !important;
}
.footer-mobile {
  background: linear-gradient(180deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%) !important;
  border-top: 2px solid var(--kel-primary,#E60000) !important;
}
.footer-mobile .footer-item .footer-title {
  color: var(--kel-text,#F5E6E6) !important;
}
.footer-mobile .footer-item .footer-icon i {
  color: var(--kel-secondary,#FF4D4D) !important;
}
.footer-mobile .footer-item.footer-login {
  background: linear-gradient(180deg, var(--kel-secondary,#FF4D4D) 0%, var(--kel-primary,#E60000) 100%) !important;
}
.footer-mobile .footer-item.footer-login .footer-title,
.footer-mobile .footer-item.footer-login .footer-icon i {
  color: #ffffff !important;
}

/* ---------- FLOATING CONTACT ---------- */
.floating-contact__button .static {
  background: linear-gradient(180deg, var(--kel-secondary,#FF4D4D) 0%, var(--kel-primary,#E60000) 100%) !important;
  color: #ffffff !important;
}

/* ---------- FORM / INPUT ---------- */
input,
select,
textarea,
.form-control {
  background: var(--kel-panel,#1F0505) !important;
  color: var(--kel-text,#F5E6E6) !important;
  border-color: var(--kel-dark,#730000) !important;
}
input::placeholder {
  color: #A58282 !important;
}

/* ---------- SALDO / TEKS AKUN ---------- */
.wallet-amount,
span[name="mainBalance"],
.username {
  color: var(--kel-secondary,#FF4D4D) !important;
  font-weight: 800 !important;
}

/* ---------- SCROLLBAR ---------- */
::-webkit-scrollbar-thumb {
  background: var(--kel-dark,#730000) !important;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--kel-primary,#E60000) !important;
}

/* ---------- POPUP ---------- */
.custom-popup .popup-content,
.popup-bank-detail {
  background: var(--kel-panel,#1F0505) !important;
  border: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .3) !important;
  color: var(--kel-text,#F5E6E6) !important;
}

/* ============================================================
   VIVID PASS — hapus efek kusam, warna lebih tegas & jelas
   (grayscale bawaan tema mematikan warna logo bank/provider)
   ============================================================ */

/* 1) Matikan semua efek grayscale/pudar pada gambar konten */
.home__payment .bank-content img,
.home__payment .bank-content img:hover,
.pembarayan-swiper .bank-content img,
.footer .provider-logo img,
.footer .provider-logo img:hover,
.header .header-user .user-account img,
.header .header-user .user-account:hover img,
.header .header-user .account-status .status-list img,
.home__menu .menu-games .games-item img,
.home__menu .menu-games .games-item:hover img,
.other-post .other-item .img img,
.other-post .other-item:hover .img img,
.other-promo .other-item .img img,
.other-promo .other-item:hover .img img,
.prog-game-swiper .game-icon img,
.prog-game-swiper .game-icon:hover img,
.payment-item img,
.provider-holder img {
  -webkit-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
}

/* 2) Logo bank & provider tampil lebih hidup (warna keluar) */
.home__payment .bank-content img,
.pembarayan-swiper .bank-content img,
.footer .provider-logo img,
.provider-holder img {
  -webkit-filter: saturate(1.18) brightness(1.05) !important;
  filter: saturate(1.18) brightness(1.05) !important;
}

/* 3) Teks & tombol lebih tegas */
.home__jackpot .jackpot-amount {
  text-shadow: 0 0 6px var(--kel-secondary,#FF4D4D), 0 0 18px var(--kel-primary,#E60000), 0 0 34px rgba(var(--kel-primary-rgb,230,0,0), .55) !important;
}
.header-nav .navbar-nav .nav-link {
  text-shadow: 0 1px 2px rgba(0, 0, 0, .45) !important;
}
.button-login,
.btn-daftar,
.mobile-button--menu,
.mobile-button--register,
.mobile-button--transaksi {
  box-shadow: 0 6px 18px rgba(var(--kel-primary-rgb,230,0,0), .35) !important;
  text-shadow: 0 1px 2px rgba(70, 0, 0, .5) !important;
}

/* ============================================================
   NOTIFIKASI (SweetAlert2) — ikut tema merah gelap
   ============================================================ */
.swal2-container.swal2-shown {
  background: rgba(var(--kel-bg-rgb,20,0,0), .72) !important;
}
.swal2-popup {
  background: linear-gradient(160deg, var(--kel-panel,#1F0505) 0%, var(--kel-bg,#140000) 100%) !important;
  border: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .45) !important;
  border-radius: 16px !important;
  color: var(--kel-text,#F5E6E6) !important;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .6), 0 0 26px rgba(var(--kel-primary-rgb,230,0,0), .25) !important;
}
.swal2-title {
  color: var(--kel-text,#F5E6E6) !important;
  font-weight: 800 !important;
}
.swal2-html-container,
.swal2-content {
  color: var(--kel-text,#F5E6E6) !important;
}
.swal2-styled.swal2-confirm {
  background: linear-gradient(180deg, var(--kel-secondary,#FF4D4D) 0%, var(--kel-primary,#E60000) 55%, var(--kel-dark,#730000) 100%) !important;
  color: var(--kel-text,#F5E6E6) !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  box-shadow: 0 8px 20px rgba(var(--kel-primary-rgb,230,0,0), .4) !important;
}
.swal2-styled.swal2-cancel {
  background: var(--kel-dark,#730000) !important;
  color: var(--kel-text,#F5E6E6) !important;
  border-radius: 10px !important;
}
.swal2-icon.swal2-warning { border-color: #FFB020 !important; color: #FFB020 !important; }
.swal2-icon.swal2-error { border-color: var(--kel-secondary,#FF4D4D) !important; color: var(--kel-secondary,#FF4D4D) !important; }
.swal2-icon.swal2-error [class^="swal2-x-mark-line"] { background-color: var(--kel-secondary,#FF4D4D) !important; }
.swal2-icon.swal2-success { border-color: #00E08A !important; color: #00E08A !important; }
.swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(0, 224, 138, .4) !important; }
.swal2-icon.swal2-success [class^="swal2-success-line"] { background-color: #00E08A !important; }
.swal2-icon.swal2-info { border-color: var(--kel-secondary,#FF4D4D) !important; color: var(--kel-secondary,#FF4D4D) !important; }
.swal2-icon.swal2-question { border-color: #FF7A7A !important; color: #FF7A7A !important; }
.swal2-toast {
  background: var(--kel-panel,#1F0505) !important;
  border: 1px solid rgba(var(--kel-primary-rgb,230,0,0), .45) !important;
}
.swal2-input,
.swal2-textarea,
.swal2-select {
  background: var(--kel-panel,#1F0505) !important;
  color: var(--kel-text,#F5E6E6) !important;
  border: 1px solid var(--kel-dark,#730000) !important;
}