/* =========================================================================
   theme.css — ELITE theme
   -------------------------------------------------------------------------
   File ini di-generate dari split theme-engine/css/theme.css (root, shared +
   default) menjadi per-tema. Dimuat SELALU bareng theme.css root & 2 file
   tema lain (lihat index.html) — jangan dimuat sendirian, karena token
   :root/default & keyframes/@property tinggal di root.
   ========================================================================= */

/* =========================================================================
   4) ELITE — Purple Galaxy
   ========================================================================= */
body[data-theme="elite"] {
  --th-bg:          #01000E;
  --th-surface:     #070817;
  --th-surface-2:   #0F111E;
  --th-surface-deep: #281553;
  --th-text:        #E3E0EC; /* Text utama: title, angka balance, heading */
  --th-text-muted:  #9897A2; /* Text secondary: label kecil (Welcome back, USDT, Aset Koin) */
  --th-text-hint:   #6E6593; /* Text muted/disabled/hint: placeholder, subtitle redup, menu nonaktif */
  --th-accent:      #8C33E7;
  --th-accent-2:    #A354E6;
  --th-accent-3:    #5d46b2;
  --th-accent-4:    #924be1;
  --th-accent-glow: #261154;
   
  --th-accent-grad: linear-gradient(135deg, #a73bf2, #7a22cc);
  --th-border:      rgba(163, 84, 230, 0.35);
  --th-border-hover: rgba(163, 84, 230, 0.45);
  --th-border-active: rgba(163, 84, 230, 0.72);
  --th-border-solid: #5B269A;
  --th-shadow:      0 0 12px rgba(163, 84, 230, 0.25);
  --th-header-bg:   #0C0024;
  --th-nav-bg:      #040716;
  --th-cyan:        #4DDDD7;
  --th-green:       #4EBA5D;
  --th-border-gradient: linear-gradient(190deg, #5d46b2 0%, #924be1 15%, #2A2542 100%);
  --th-gold:        #F3BA2F;
  --th-magenta:     #B41482;
  --th-logo:        none;
  --th-icon-filter: brightness(0) saturate(100%) invert(28%) sepia(83%)
                    saturate(3200%) hue-rotate(258deg) brightness(92%) contrast(96%);
  --th-header-bg-img: url("../../assets/bg-elit.jpg");
  --th-header-solid-bg: #0b0716;
  --th-bg-api-ip:   url("../../assets/orbit-elit/bg-pg-api-1.png");
  --th-bg-api-btn:  url("../../assets/orbit-elit/bg-pg-api-3.png");
  --th-bg-api-status: url("../../assets/orbit-elit/bg-pg-api-2.png");
  --th-btn-start-img: url("../../assets/orbit-elit/start.png");
  --th-btn-stop-img:  url("../../assets/orbit-elit/stop.png");
  --th-btn-pause-img: url("../../assets/orbit-elit/pause.png");
  --th-btn-force-buy-img:  url("../../assets/orbit-elit/force-green.png");
  --th-btn-force-sell-img: url("../../assets/orbit-elit/force-red.png");
  --th-btn-primary-shadow: 0 0 15px rgba(167, 59, 242, 0.7), inset 0 0 5px rgba(255, 255, 255, 0.3);
}
/* =========================================================================
   5) PENERAPAN TOKEN KE KOMPONEN
   -------------------------------------------------------------------------
   PENTING soal kontras: app ini mencampur card terang & gelap dengan warna
   teks yang sebagian hardcoded. Memaksa SEMUA .card jadi gelap membuat teks
   gelap jadi tak terbaca. Karena itu modelnya per-skema:

     - elite & galaxy = SKEMA TERANG  -> jangan paksa card gelap. Cukup ubah
       background halaman + aksen + icon. Card & teks biarkan seperti default
       (sudah kontras). Hasil: tampilan terang dengan brand ungu/emas.
     - black           = SKEMA GELAP  -> card digelapkan + teks dibuat terang.

   default tidak pernah tersentuh.
   ========================================================================= */
/* Background halaman — semua tema (tint ringan untuk terang, gelap untuk black) */
body[data-theme="elite"] {
  background-color: var(--th-bg) !important;
}
/* Elite, Galaxy, Black: video background — matikan image agar tidak overlap */
body[data-theme="elite"] .top-offset:not(#capture),
body[data-theme="elite"] .gradient-purple {
  background-image: none !important;
  background-color: transparent !important;
}
body[data-theme="elite"] .elite-video-bg,
body[data-theme="elite"] #elite-bg-video {
  display: block !important;
}
/* Coin detail video background — covers the WHOLE panel (behind header too),
   non-default themes only. Default keeps display:none (rule above). */
body[data-theme="elite"] #coin-details .theme-light {
  position: relative;
  z-index: 0; /* stacking context so the z-index:-1 video sits above the panel bg */
}
/* Coin detail cards -> 30% opacity so the video shows through (non-default themes) */
body[data-theme="elite"] #coin-setting .bg-theme {
  background-color: rgba(27, 24, 43, 0.30) !important; /* Card/Table BG @30% */
}
/* ---- BLACK: skema gelap ----
   Kontras teks & card ditangani oleh mode gelap bawaan template:
   applyTheme() menambah class `theme-dark` saat type=black, jadi semua aturan
   `.theme-dark ...` di style.css aktif (teks terang, card gelap, dll.).
   Di sini cukup tint warna agar pas navy + cyan, tanpa override teks yang
   berisiko menimpa teks berwarna (mis. hijau/merah). */
body[data-theme="elite"] {
  background-color: var(--th-bg) !important;
}
body[data-theme="elite"] .bg-theme {
  background-color: var(--th-surface) !important;
}
body[data-theme="elite"] .card {
  border-color: var(--th-border) !important;
  box-shadow: var(--th-shadow) !important;
}
/* --- Aksen: menimpa sistem 'highlight' bawaan template (SEMUA tema) --- */
body[data-theme="elite"]  .color-highlight {
  color: var(--th-accent) !important;
}
body[data-theme="elite"]  .bg-highlight {
  background-color: var(--th-accent) !important;
}
body[data-theme="elite"]  .border-highlight {
  border-color: var(--th-accent) !important;
}
body[data-theme="elite"]  .gradient-highlight {
  background-image: var(--th-accent-grad) !important;
}
/* Footer-bar nav aktif (mengikuti pola styles/highlights/*.css) */
body[data-theme="elite"]  .footer-bar-1 .active-nav i,
body[data-theme="elite"]  .footer-bar-1 .active-nav span {
  background: var(--th-accent-grad) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
/* =========================================================================
   6) ICON & LOGO — bikin icon ikut tema
   -------------------------------------------------------------------------
   Dua kategori icon di app ini:
   (a) Icon gambar mono PNG  -> quick-action di Home (<span class="icon"><img>>),
       logo brand, dsb.  Direcolor pakai filter var(--th-icon-filter).
   (b) Font-icon (bootstrap-icons .bi-*, fontawesome .fa-*) -> nav, header,
       chevron, dll.  Diwarnai via color/fill var(--th-accent).
   default tidak pernah tersentuh (selector pakai [data-theme="non-default"]).
   ========================================================================= */
/* ---- (a) Icon gambar mono: quick-action Home + .theme-icon + logo brand ---- */
body[data-theme="elite"]  .icon > img,
body[data-theme="elite"]  .icon-highlight img,
body[data-theme="elite"]  .theme-icon {
  filter: var(--th-icon-filter);
}
/* Orbit themed icons sudah berwarna — batalkan filter agar tidak di-tint ulang.
   .orbit-icon ditambahkan via Vue :class binding saat themeIcon() aktif.
   Juga batalkan filter untuk gambar yang di-load dari folder theme-engine. */
body[data-theme="elite"]  .orbit-icon,
body[data-theme="elite"]  img[src*="theme-engine/assets/orbit-"] {
  filter: none !important;
}
/* CSS explicit asset assignment for menu quick action icons in Elite theme */
body[data-theme="elite"] #quick-action-api,
body[data-theme="elite"] .quick-action-api {
  content: url("../../assets/orbit-elit/api-configuration.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-credit {
  content: url("../../assets/orbit-elit/credit.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-profit {
  content: url("../../assets/orbit-elit/profit.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-faq {
  content: url("../../assets/orbit-elit/faq.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-saving {
  content: url("../../assets/orbit-elit/saving.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-bonus {
  content: url("../../assets/orbit-elit/cashback.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-strategy {
  content: url("../../assets/orbit-elit/moonbot-rocket.png") !important;
  filter: none !important;
}
body[data-theme="elite"] #quick-action-fee,
body[data-theme="elite"] #quick-action-fee2 {
  content: url("../../assets/orbit-elit/bnb-fee.png") !important;
  filter: none !important;
}

/* Quick Action Home reset agar tidak terpengaruh style tombol atau flex container */
body[data-theme="elite"] #quick-action-card .icon,
body[data-theme="elite"] #quick-action-card .btn-investor-mode .icon {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  display: inline-block !important;
  width: auto !important;
  height: auto !important;
  line-height: normal !important;
  transform: none !important;
}
/* Border for sort-content */
body[data-theme="elite"] .sort-trade-header {
  border-top: 1px solid #2A2542 !important;
  border-bottom: 1px solid #2A2542 !important;

}
/* Sorting bar (Trade): transparan saat di atas, gelap saat list di-scroll */
body[data-theme="elite"] #sorting-bar {
  background: transparent !important;
  transition: background-color 0.25s ease;
}
body[data-theme="elite"] #sorting-bar.header-scrolled {
  background: rgba(10, 13, 24, 0.9) !important;
}
/* List koin (Trade) jadi scroll container sendiri — halaman tidak ikut scroll.
   Offset bar pakai MARGIN (bukan padding) supaya baris terpotong di batas
   container dan tidak terlihat menembus di belakang bar yang transparan. */
body[data-theme="elite"] #trade-page .bg-binance-tick {
  /* 135px bar atas + 100px footer bar (fixed). Container berhenti TEPAT di
     atas footer, bukan di dasar viewport — dulu sisanya ditutup
     padding-bottom:100px sehingga masih ada 100px kosong yang bisa di-scroll
     setelah item terakhir. padding-bottom dibiarkan 0 tanpa !important supaya
     BatchSetting() masih bisa set 175px lewat inline style. */
  height: calc(100vh - 235px);
  margin-top: 135px;
  padding-top: 0 !important;
  padding-bottom: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}
/* Wrapper dikunci setinggi viewport: .footer-clear (padding-bottom 100px) +
   min-height:100vh bikin halaman masih ikut ter-scroll ~100px. Satu-satunya
   yang boleh scroll adalah .bg-binance-tick. */
body[data-theme="elite"] #trade-page .page-content {
  min-height: 0 !important;
  height: 100vh !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}
body[data-theme="elite"] #trade-page {
  overflow: hidden !important;
}
/* Teks status "Inactive" pada kartu koin (dot merah #d5465b) -> text secondary.
   Status "Active" (dot hijau) dibiarkan. Match hex DAN serialisasi rgb() Vue. */
body[data-theme="elite"] .coin-status:has(> .coin-status-dot[style*="#d5465b"]) .font-11,
body[data-theme="elite"] .coin-status:has(> .coin-status-dot[style*="213, 70, 91"]) .font-11 {
  color: var(--th-text-muted) !important;
}
/* Swap aset logo bertema bila sudah tersedia (default --th-logo:none = aman,
   <img> asli dibiarkan). Taruh aset di theme-engine/assets/icons/<tema>/logo.webp
   lalu set --th-logo di token tema, dan matikan filter di atas untuk .brand-logo. */
/* ---- (b) Font-icon (bi-*, fa-*): nav, header, menu/list ---- */
/* Nav bawah (Home, Trade, dll.): non-aktif = muted, aktif = aksen. */
body[data-theme="elite"]  #footer-bar a i,
body[data-theme="elite"]  #footer-bar a span {
  color: rgba(255, 255, 255, 0.75) !important;
}
body[data-theme="elite"]  #footer-bar .active-nav i,
body[data-theme="elite"]  #footer-bar .active-nav span {
  background: var(--th-accent-grad) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}
/* Nav bawah: icon Home & Trade -> aset tema (orbit-elit/home.png & trade.png),
   menggantikan glyph bootstrap-icons yang digambar di ::before */
body[data-theme="elite"]  #footer-bar .bi-house-fill::before,
body[data-theme="elite"]  #footer-bar .bi-graph-up::before {
  content: "" !important;
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../../assets/orbit-elit/home.png") center / contain no-repeat;
  vertical-align: middle;
}
body[data-theme="elite"]  #footer-bar .bi-graph-up::before {
  background-image: url("../../assets/orbit-elit/trade.png");
}
/* Non-aktif diredupkan supaya state aktif/non-aktif tetap terbaca */
body[data-theme="elite"]  #footer-bar a:not(.active-nav) .bi-house-fill::before,
body[data-theme="elite"]  #footer-bar a:not(.active-nav) .bi-graph-up::before {
  filter: grayscale(1) brightness(1.3);
  opacity: 0.75;
}
/* Tampilan Footer Elite (seperti Image 2) */
body[data-theme="elite"] #footer-bar.footer-bar-1 {
  background-color: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  border-radius: 25px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6) !important;
}
body[data-theme="elite"] #footer-bar.footer-bar-1 a:not(.active-nav) span {
  color: rgba(255, 255, 255, 0.75) !important; /* Menu nonaktif -> terang */
}
body[data-theme="elite"] #footer-bar.footer-bar-1 .active-nav span {
  color: #c084fc !important; /* Ungu lebih terang (Beranda) */
}
body[data-theme="elite"] #footer-bar.footer-bar-1 .footer-divider {
  background-color: var(--th-accent-4) !important;
  opacity: 1 !important;
}
/* Floating Certificates Elite */
body[data-theme="elite"] .floating-certificates {
  background-color: #271153 !important; /* Ungu gelap seperti di gambar */
  border: 1px solid rgba(138, 43, 226, 0.3) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}
body[data-theme="elite"] .floating-certificates .my-floating-certificates {
  color: #ffffff !important;
}
body[data-theme="elite"] .floating-certificates .badge.text-bg-danger {
  background-color: #89206b !important; /* Pink/ungu tua untuk badge "New" */
  color: #ffffff !important;
}
body[data-theme="elite"] .floating-certificates span[onclick="CloseCertificate()"] {
  background-color: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  box-shadow: none !important;
  backdrop-filter: blur(4px);
}
body[data-theme="elite"] .floating-certificates span[onclick="CloseCertificate()"] i {
  color: #aeb4c5 !important;
}
/* Panah collapse daftar sertifikat (#legal-modal) — inline color:black +
   text-stroke hitam tak terbaca di modal gelap; samakan dengan icon gradient */
body[data-theme="elite"]  #legal-modal .toggle-arrow {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  -webkit-text-stroke: 0 !important;
  display: inline-block;
}
/* Exchanger Elite */
body[data-theme="elite"] .select_wrap .default_option {
  background-color: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
  color: var(--th-text) !important;
}
body[data-theme="elite"] .select_wrap .default_option p {
  color: var(--th-text) !important;
}
body[data-theme="elite"] .select_wrap .default_option:before {
  border-color: transparent transparent var(--th-text) var(--th-text) !important;
}
body[data-theme="elite"] .select_wrap .select_ul {
  background-color: var(--th-surface-2) !important;
  border: 1px solid var(--th-border) !important;
}
body[data-theme="elite"] .select_wrap .select_ul li {
  background-color: var(--th-surface-2) !important;
  color: var(--th-text) !important;
}
body[data-theme="elite"] .select_wrap .select_ul li p {
  color: var(--th-text) !important;
}
body[data-theme="elite"] .select_wrap .select_ul li:hover {
  background-color: var(--th-surface) !important;
}
/* Icon header (gear/help/refresh/bell) ikut warna teks tema biar terbaca. */
body[data-theme="elite"]  .header i {
  color: var(--th-text) !important;
}
/* Icon menu/list/settings & icon ber-aksen eksplisit -> warna aksen tema.
   :not(...) menjaga icon STATUS (hijau/merah/kuning) tetap apa adanya. */
body[data-theme="elite"]  .menu i,
body[data-theme="elite"]  .list-group i,
body[data-theme="elite"]  .theme-icon i,
body[data-theme="elite"]  .color-highlight i {
  color: var(--th-accent) !important;
}
/* Pengaman: jangan ubah icon status berwarna (sukses/gagal/peringatan). */
body[data-theme="elite"]  .text-success,
body[data-theme="elite"]  .text-danger,
body[data-theme="elite"]  .text-warning,
body[data-theme="elite"]  .color-green,
body[data-theme="elite"]  .color-red,
body[data-theme="elite"]  .color-yellow {
  filter: none !important;
}
/* Elite: warna hijau via --th-green */
body[data-theme="elite"] .color-green,
body[data-theme="elite"] .color-soft-green,
body[data-theme="elite"] .text-success {
  color: var(--th-green) !important;
}
/* Navigation menu themes support */
body[data-theme="elite"] .nav-container {
  background-color: var(--th-surface-2) !important;
      border-left: 1px solid rgb(73 59 129);
    box-shadow: 0 0 12px rgba(146, 75, 225, 0.1);

}
body[data-theme="elite"] .nav a {
  color: var(--th-text) !important;
}
/* border-offset (background di bawah header) -> ikut tema, bukan putih hardcoded */
body[data-theme="elite"] .border-offset {
  background-color: transparent !important;
}
/* "Isi Ulang Sekarang" — default hijau gelap (#006400, inline); di tema gelap
   dibuat lebih terang agar terbaca. */
body[data-theme="elite"] .recharge-now-link {
  color: #3ddc84 !important;
}
/* Elite: gradient border via double-layer background-image trick */
body[data-theme="elite"] .balance-card {
  position: relative !important;
  background-color: transparent !important;
  border: 1.5px solid transparent !important;
  border-radius: 16px !important;
  background-image:
    linear-gradient(rgb(10, 13, 24), rgb(10, 13, 24)),
    conic-gradient(from var(--glow-angle, 0deg), #A45CFF, #5D46B2, #1B182B, #5D46B2, #A45CFF) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  box-shadow: none !important;
  filter: drop-shadow(0 0 15px rgba(164, 92, 255, 0.5));
  animation: spin-border-pulse 4s linear infinite;
}
/* Style for the dedicated shadow/glow element inside the balance card */
body[data-theme="elite"] .balance-card-glow {
  position: absolute !important;
  top: 1.5px !important;
  left: 1.5px !important;
  right: 1.5px !important;
  bottom: 1.5px !important;
  border-radius: 14.5px !important;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.5),
              inset 0 0 20px 5px rgba(0, 0, 0, 0.65),
              inset 0 0 15px var(--th-border) !important;
  pointer-events: none !important;
  display: block !important;
  background: transparent !important;
  z-index: 2 !important;
}
body[data-theme="elite"] .balance-card-glow {
  box-shadow: inset 0 0 20px 5px rgba(0, 0, 0, 0.7),
              inset 0 0 15px rgba(146, 75, 225, 0.35) !important;
}
/* Make wallet balance transparent for elite theme */
body[data-theme="elite"] .balance-card .wallet-balance {
  background-color: transparent !important;
}
body[data-theme="elite"] .balance-card h4 {
  color: #fff !important;
}
/* Label (h6 USDT, Coin Asset) */
body[data-theme="elite"]  .balance-card h6 {
  color: var(--th-text-muted) !important;
  opacity: 1 !important;
}
/* Icon info circle */
body[data-theme="elite"]  .bi-info-circle-fill {
  color: var(--th-text-muted) !important;
}
/* Icon copy (clipboard) — inline style="color: black" (mis. tombol copy
   alamat withdrawal) jadi ilang di atas surface gelap. */
body[data-theme="elite"]  .bi-clipboard {
  color: var(--th-text) !important;
}
/* Icon "Setting" (formula.html, batch_formula.html) — cuma img src, gak ada
   id/class, jadi di-swap lewat content: url() per tema. */
body[data-theme="elite"] img[src*="setting.png"] {
  content: url("../../assets/orbit-elit/setting.png");
}
body[data-theme="elite"] img[src*="star-coin"] {
  content: url("../../assets/orbit-elit/star-coin.png");
}
/* Input ".key" (WD address, IP list, dll) — background hitam solid, khusus
   tema elite (sama kayak treatment yang dipakai sebelumnya). Border cuma
   ditaruh di INPUT-nya, div wrapper ".key" di-reset polos biar gak dobel
   kotak (kalau wrapper-nya juga .key). */
body[data-theme="elite"]  input.key,
body[data-theme="elite"]  .key input,
body[data-theme="elite"]  .key input:focus,
body[data-theme="elite"]  input.key:focus,
body[data-theme="elite"]  #copy_wd_address,
body[data-theme="elite"]  #otp-address {
  background-color: #000000 !important;
  background: #000000 !important;
  border: 1px solid var(--th-border) !important;
  border-color: var(--th-border) !important;
  color: var(--th-text) !important;
}
body[data-theme="elite"]  div.key,
body[data-theme="elite"]  .form-custom:has(#otp-address) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Teks Trading Volume row */
body[data-theme="elite"]  .balance-card .font-12,
body[data-theme="elite"]  .balance-card .font-13 {
  color: var(--th-text-muted) !important;
}
body[data-theme="elite"] .balance-card .color-theme {
  color: #fff !important;
}
/* HR pemisah horizontal */
body[data-theme="elite"]  .balance-card hr {
  border-color: var(--th-border) !important;
  opacity: 1 !important;
}
/* Pemisah vertikal USDT | Coin Asset */
body[data-theme="elite"]  .balance-card .v-divider {
  background-color: var(--th-border) !important;
  opacity: 1 !important;
}
/* =========================================================================
   8) PROFILE INFO CARD — Telepon, Tingkat Bintang, Alamat Penarikan, Voucher Plan
   ========================================================================= */
/* Card background dark themes */
body[data-theme="elite"]  .profile-info-card {
  background-color: var(--th-surface) !important;
  border: 1px solid var(--th-border) !important;
}
/* Label kiri (h5.font-13): abu-abu --th-text-muted */
body[data-theme="elite"]  .profile-info-card h5 {
  color: var(--th-text-muted) !important;
}
/* Nilai kanan (h4): teks terang (kecuali teks status hijau) */
body[data-theme="elite"]  .profile-info-card h4:not(.color-soft-green):not(.color-green):not(.text-success) {
  color: var(--th-text) !important;
  opacity: 1 !important;
}
body[data-theme="elite"]  .profile-info-card h4 span {
  opacity: 1 !important;
}
/* Divider pemisah antar baris */
body[data-theme="elite"]  .profile-info-card .divider {
  background-color: var(--th-border) !important;
  opacity: 1 !important;
}
/* "Verified" text dan teks nilai kanan lainnya (color-black) */
body[data-theme="elite"]  .profile-info-card .color-black {
  color: var(--th-text) !important;
}
/* CATATAN: filter recolor adalah pendekatan tanpa-aset. Untuk hasil pixel-perfect
   per brand, sediakan PNG bertema di theme-engine/assets/icons/<tema>/ dan ganti
   blok (a) menjadi swap `content:` per icon, atau pakai teknik CSS mask. */
/* =========================================================================
   8) PROFIT PAGE (ELITE THEME)
   ========================================================================= */
/* Top Card */
body[data-theme="elite"] .profit-top-card {
  background-color: rgba(10, 5, 20, 0.4) !important; /* Semi-transparent to let video through */
  border: 1px solid rgba(146, 75, 225, 0.8) !important;
  border-radius: 12px !important;
  background-image: none !important;
  box-shadow: 0 0 20px 2px rgba(93, 70, 178, 0.5), inset 0 0 15px rgba(93, 70, 178, 0.3) !important;
  backdrop-filter: blur(2px);
}
/* List Card Wrapper */
body[data-theme="elite"] .profit-list-card {
  background-color: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 12px 12px 0 0 !important;
  background-image: 
    linear-gradient(var(--th-surface), var(--th-surface)), 
   linear-gradient(180deg, #5d46b2 0%, #924be1 15%,#2A2542 100%) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  box-shadow: none !important;
  margin: 0 !important;
}
body[data-theme="elite"] .profit-list-card .bg-theme {
  background-color: transparent !important;
}
/* Summary Row & Monthly Summary Separator (Elite / Purple Theme) */
body[data-theme="elite"] .profit-summary-row,
body[data-theme="elite"] .month-summary-separator,
body[data-theme="elite"] [style*="background-color: rgba(0, 0, 0, 0.04)"],
body[data-theme="elite"] [style*="background-color:rgba(0,0,0,0.04)"],
body[data-theme="elite"] #profit-page .month-summary-separator,
body[data-theme="elite"] #profit-page .d-flex.month-summary-separator,
body[data-theme="elite"] #profit-page .d-flex[style*="0.04"],
body[data-theme="elite"] #asset-page .month-summary-separator,
body[data-theme="elite"] #asset-page .d-flex.month-summary-separator,
body[data-theme="elite"] #asset-page .d-flex[style*="0.04"],
body[data-theme="elite"] #user-asset .month-summary-separator,
body[data-theme="elite"] #tab-group-credit .month-summary-separator,
body[data-theme="elite"] #bonus-page .month-summary-separator,
body[data-theme="elite"] #bonus-page .d-flex.month-summary-separator,
body[data-theme="elite"] #bonus-page .d-flex[style*="0.04"],
body[data-theme="elite"] #user-bonus .month-summary-separator {
  background-color: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background-image: 
    linear-gradient(rgba(20, 15, 35, 0.88), rgba(20, 15, 35, 0.88)), 
    linear-gradient(135deg, #5d46b2 0%, #924be1 100%) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  box-shadow: 0 0 10px rgba(93, 70, 178, 0.25) !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

body[data-theme="elite"] .month-summary-separator h5.color-theme,
body[data-theme="elite"] .profit-summary-row h5.color-theme,
body[data-theme="elite"] [style*="background-color: rgba(0, 0, 0, 0.04)"] h5.color-theme,
body[data-theme="elite"] [style*="background-color:rgba(0,0,0,0.04)"] h5.color-theme,
body[data-theme="elite"] #profit-page .d-flex[style*="0.04"] h5.color-theme,
body[data-theme="elite"] #asset-page .d-flex[style*="0.04"] h5.color-theme,
body[data-theme="elite"] #bonus-page .d-flex[style*="0.04"] h5.color-theme,
body[data-theme="elite"] #profit-page .month-summary-separator h5.color-theme,
body[data-theme="elite"] #asset-page .month-summary-separator h5.color-theme,
body[data-theme="elite"] #user-asset .month-summary-separator h5.color-theme,
body[data-theme="elite"] #bonus-page .month-summary-separator h5.color-theme {
  color: #d1a8ff !important;
  -webkit-text-fill-color: #d1a8ff !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  text-shadow: 0 0 8px rgba(167, 122, 223, 0.35);
}

body[data-theme="elite"] .month-summary-separator h5:not(.color-theme) {
  color: #00C076 !important;
  font-weight: 700 !important;
}
/* Fix inline color: black for dark themes in Profit Page */
body[data-theme="elite"] .profit-top-card [style*="color: black"],
body[data-theme="elite"] .profit-list-card [style*="color: black"],
body[data-theme="elite"] .profit-list-card label {
  color: var(--th-text) !important;
}
/* =========================================================================
   6) TRADE PAGE HEADER STYLES (Elite, Galaxy, Black)
   ========================================================================= */
body[data-theme="elite"] .top-sort {
  position: relative !important;
  z-index: 1 !important;
}
/* Search Bar Container */
body[data-theme="elite"] .searchBar-content {
  background-color: transparent !important;
  border: 1px solid var(--th-border) !important;
  backdrop-filter: blur(5px);
}
body[data-theme="elite"] .searchBar-content {
  background-color: transparent !important;
  border: 1px solid rgba(163, 84, 230, 0.4) !important;
}
/* Search Bar Input & Icons */
body[data-theme="elite"] .searchBar-content .searchBar {
  background-color: transparent !important;
  color: var(--th-text) !important;
}
body[data-theme="elite"] .searchBar-content .searchBar::placeholder {
  color: var(--th-text-hint, var(--th-text-muted)) !important;
}
body[data-theme="elite"] .searchBar-content i,
body[data-theme="elite"] .searchBar-content input[type="button"] {
  color: var(--th-text) !important;
  background-color: transparent !important;
}
/* Sort Buttons Overrides (Ignore active button #924be1) */
body[data-theme="elite"] .sort-content button:not([style*="924be1"]),
body[data-theme="elite"] .sort-content > div[style*="0.04"] {
  background-color: transparent !important;
  color: var(--th-text) !important;
  border: 1px solid var(--th-border) !important;
}
/* Sort Buttons Icons */
body[data-theme="elite"] .sort-content button:not([style*="924be1"]) i,
body[data-theme="elite"] .sort-content > div i {
  color: var(--th-text-muted) !important;
}
/* Binance Text Override */
body[data-theme="elite"] .sort-content > div p {
  color: var(--th-text) !important;
}
/* Fix Offcanvas / Drawer backgrounds for dark themes */
body[data-theme="elite"] .offcanvas {
  background-color: var(--th-bg) !important;
}
/* Transparent containers for search and sort buttons in Elite */
body[data-theme="elite"] .searchBar-container {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Strip sort halaman Trade: bayangannya DIPERTAHANKAN seperti tampilan yang
   sudah berjalan. Dulu bayangan itu ditulis inline dengan `!important` di
   trade.html sehingga `box-shadow: none` di atas tidak pernah kena; tanda itu
   kini dilepas supaya tema black bisa mematikannya, jadi nilainya dipasang
   kembali di sini agar elite tidak ikut berubah. Hapus blok ini kalau elite
   memang ingin ikut tanpa bayangan. */
body[data-theme="elite"] .top-sort .searchBar-container:not(.sort-content-tabel) {
  box-shadow: 0px 8px 15px -5px rgba(0, 0, 0, 0.15) !important;
}
/* Make list headers (Name/Qty, etc) solid white for Elite */
body[data-theme="elite"] .searchBar-container .sort-content p {
  opacity: 1 !important;
  color: #ffffff !important;
}
/* Teks Pengaturan Sekumpulan (Batch Setting) ungu untuk Elite */
body[data-theme="elite"] .btn-investor-mode span.color-theme,
body[data-theme="elite"] .btn-investor-mode .icon i {
  /* color: var(--th-accent-2) !important; */
}
body[data-theme="elite"] .btn-investor-mode i.font-11 {
  color: var(--th-text) !important;
}
/* Trade Footer Bar Thin Borders */
body[data-theme="elite"] #trade-footer-bar {
  border-top: 2px solid rgba(255, 255, 255, 0.15) !important;
  border-bottom: 2px solid rgba(255, 255, 255, 0.15) !important;
  box-shadow: none !important;
}
/* Header tabel Trade: tanpa border, tanpa shadow */
body[data-theme="elite"] .sort-content-tabel {
  border: 0 !important;
  box-shadow: none !important;
}
/* Dynamic Table Header Height */
body[data-theme="elite"] #tabel-header-container {
  height: 35px !important;
}
/* =========================================================
   ELITE THEME: FIX STICKY HEADERS OVERLAPPING CARDS
   ========================================================= */
body[data-theme="elite"] .top-header.sticky {
    background: transparent !important;
    background-image: none !important;
    z-index: 99 !important;
    transition: background-color 0.3s ease, background-image 0.3s ease;
}
body[data-theme="elite"] .top-header.sticky.header-scrolled {
    background-image: var(--th-bg-api-ip) !important;
    background-color: var(--th-header-solid-bg, #0b0716) !important;
    background-size: cover !important;
    background-position: center !important;
}
/* Coin detail header when scrolled: no image, just 80% opacity dark (video shows subtly) */
body[data-theme="elite"] #coin-details-header.header-scrolled {
    background-image: none !important;
    background-color: rgba(11, 7, 22, 0.80) !important; /* @80% */
    background-size: auto !important;
}
/* Coin detail header icons -> gradient like the menu (non-default themes) */
/* Back chevron (font icon) */
body[data-theme="elite"] #coin-details-header .bi-chevron-left {
    background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    display: inline-block;
}
/* 2. Header Right Action Icons (Refresh, Info, Question, Download, Gear, CSV) */
body[data-theme="elite"] .page-title .bi-question-circle-fill,
body[data-theme="elite"] .page-title .bi-info-circle-fill,
body[data-theme="elite"] .page-title .bi-arrow-repeat,
body[data-theme="elite"] .page-title .refreshBtn i,
body[data-theme="elite"] .page-title .bi-download,
body[data-theme="elite"] .page-title .bi-gear,
body[data-theme="elite"] .page-title .bi-gear-fill,
body[data-theme="elite"] .page-title .bi-pie-chart-fill,
body[data-theme="elite"] #vue-download-csv-asset-credit i,
body[data-theme="elite"] #vue-download-csv-asset-credit .bi,
body[data-theme="elite"] #vue-download-csv-trasaction i,
body[data-theme="elite"] #vue-download-csv-trasaction .bi,
body[data-theme="elite"] #button-credit-downloads i,
body[data-theme="elite"] #button-credit-downloads .bi,
body[data-theme="elite"] button-new-tab-url-icon i,
body[data-theme="elite"] button-download i,
body[data-theme="elite"] .refreshBtn i,
body[data-theme="elite"] a.refresh i,
body[data-theme="elite"] .refreshBtn:not(.refreshBtn-home) i {
    background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    display: inline-block;
    opacity: 1 !important;
}

/* Action icons (PNG): fill the icon shape with the gradient via mask on the <a> wrapper */
body[data-theme="elite"] #coin-details-header .justify-end a:has(> img),
body[data-theme="elite"] .page-title .justify-end a:has(> img) {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 20px;
    height: 20px;
    background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%);
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}
body[data-theme="elite"] #coin-details-header .justify-end a:has(> img) > img,
body[data-theme="elite"] .page-title .justify-end a:has(> img) > img {
    visibility: hidden;
}
body[data-theme="elite"] #coin-details-header a:has(> img[src*="graph-icon"]),
body[data-theme="elite"] .page-title a:has(> img[src*="graph-icon"]) {
    -webkit-mask-image: url("../../../images/pictures/graph-icon.png");
    mask-image: url("../../../images/pictures/graph-icon.png");
}
body[data-theme="elite"] #coin-details-header a:has(> img[src*="profit-summary-icon"]),
body[data-theme="elite"] .page-title a:has(> img[src*="profit-summary-icon"]) {
    -webkit-mask-image: url("../../../images/pictures/profit-summary-icon.png");
    mask-image: url("../../../images/pictures/profit-summary-icon.png");
}
body[data-theme="elite"] #coin-details-header a:has(> img[src*="transaction-icon"]),
body[data-theme="elite"] .page-title a:has(> img[src*="transaction-icon"]) {
    -webkit-mask-image: url("../../../images/pictures/transaction-icon.png");
    mask-image: url("../../../images/pictures/transaction-icon.png");
}
/* =========================================================
   ELITE THEME SPECIFIC OVERRIDES FOR ASSET.HTML
   ========================================================= */
body[data-theme="elite"] #user-asset > .content:first-child,
body[data-theme="elite"] #user-bonus > div > .content,
body[data-theme="elite"] #flush-one .content,
body[data-theme="elite"] #user-bonus > .content,
body[data-theme="elite"] #user-profit > .content,
body[data-theme="elite"] #user-history-credit > .content,
body[data-theme="elite"] #user-recharge > .content {
    background-color: #0f0a21 !important;
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] #user-asset > .content:first-child,
body[data-theme="elite"] #user-profit > .content:first-child {
    background-color: rgba(15, 10, 33, 0.5) !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.5) !important;
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
}
/* Fix text colors inside these cards */
body[data-theme="elite"] #user-asset > .content:first-child h5.color-theme,
body[data-theme="elite"] #user-bonus > div > .content h6,
body[data-theme="elite"] #flush-one .content h6,
body[data-theme="elite"] #user-bonus > div > .content i,
body[data-theme="elite"] #flush-one .content i,
body[data-theme="elite"] #user-profit > .content h6,
body[data-theme="elite"] #user-profit > .content i,
body[data-theme="elite"] #user-history-credit > .content h6,
body[data-theme="elite"] #user-history-credit > .content p,
body[data-theme="elite"] #user-recharge > .content h6 {
    color: white !important;
}
body[data-theme="elite"] #user-asset > .content:first-child span.bg-soft-red {
    border: 1px solid #ff4444 !important;
    color: #ff4444 !important;
    background: transparent !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
    display: inline-block !important;
    font-size: 11px !important;
}
body[data-theme="elite"]  #div-withdrawal-asset,
body[data-theme="elite"]  #div-withdrawal-bonus {
    background-color: var(--th-surface) !important;
    border: 1px solid var(--th-border) !important;
    padding: 15px !important;
}
body[data-theme="elite"]  #div-withdrawal-asset .input-group,
body[data-theme="elite"]  #div-withdrawal-bonus .input-group {
    background-color: var(--th-surface-2) !important;
    border: 1px solid var(--th-border) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    margin-bottom: 12px !important;
    overflow: hidden;
}
body[data-theme="elite"]  #div-withdrawal-asset .input-group-text,
body[data-theme="elite"]  #div-withdrawal-bonus .input-group-text {
    background-color: transparent !important;
    border: none !important;
    color: var(--th-text) !important;
}
body[data-theme="elite"]  #div-withdrawal-asset .input-group-prepend .input-group-text,
body[data-theme="elite"]  #div-withdrawal-bonus .input-group-prepend .input-group-text {
    border-right: 1px solid var(--th-border) !important;
    border-radius: 0 !important;
}
body[data-theme="elite"]  #div-withdrawal-asset .input-group-append .input-group-text:not(.btn-uni),
body[data-theme="elite"]  #div-withdrawal-bonus .input-group-append .input-group-text:not(.btn-uni) {
    border-left: 1px solid var(--th-border) !important;
    border-radius: 0 !important;
}
body[data-theme="elite"]  #div-withdrawal-asset .form-control,
body[data-theme="elite"]  #div-withdrawal-bonus .form-control {
    background-color: transparent !important;
    border: none !important;
    color: var(--th-text) !important;
    box-shadow: none !important;
}
body[data-theme="elite"]  #div-withdrawal-asset .form-control::placeholder,
body[data-theme="elite"]  #div-withdrawal-bonus .form-control::placeholder {
    color: var(--th-text-muted) !important;
}
/* Tombol "Send Code" — border-nya sebelumnya hardcode putih, sekarang ikut
   warna aksen tema (bukan sekadar putih polos). */
body[data-theme="elite"]  #div-withdrawal-asset .btn-uni#basic-addon2,
body[data-theme="elite"]  #div-withdrawal-bonus .btn-uni#basic-addon2 {
    background: var(--th-accent-grad) !important;
    border: 1px solid var(--th-accent) !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    margin: 3px !important;
    padding: 4px 8px !important;
    height: auto !important;
    font-weight: 500 !important;
}
body[data-theme="elite"]  #div-withdrawal-asset h5,
body[data-theme="elite"]  #div-withdrawal-bonus h5,
body[data-theme="elite"]  #div-withdrawal-bonus p.color-gray {
    color: var(--th-text) !important;
}
body[data-theme="elite"]  #div-withdrawal-asset p.color-purple,
body[data-theme="elite"]  #div-withdrawal-bonus p.color-purple {
    color: var(--th-accent) !important;
}
/* =========================================================
   ELITE THEME SPECIFIC OVERRIDES FOR API CONNECT PAGES
   ========================================================= */
/* General text colors & icons */
body[data-theme="elite"] #api-connect-page h3.color-theme,
body[data-theme="elite"] #api-connect-okx-page h3.color-theme,
body[data-theme="elite"] #api-connect-tokocrypto-page h3.color-theme {
    color: white !important;
}
body[data-theme="elite"] #api-connect-page .bi-question-circle-fill,
body[data-theme="elite"] #api-connect-okx-page .bi-question-circle-fill,
body[data-theme="elite"] #api-connect-tokocrypto-page .bi-question-circle-fill {
    color: #a29fb4 !important;
}
/* Status text overrides */
body[data-theme="elite"] #api-connect-page h3.color-white,
body[data-theme="elite"] #api-connect-okx-page h3.color-white,
body[data-theme="elite"] #api-connect-tokocrypto-page h3.color-white {
    color: white !important;
}
/* Guidelines body text */
body[data-theme="elite"] #api-connect-page i[style*="font-style: normal"],
body[data-theme="elite"] #api-connect-okx-page i[style*="font-style: normal"],
body[data-theme="elite"] #api-connect-tokocrypto-page i[style*="font-style: normal"] {
    color: #8c85a5 !important;
}
/* Inputs wrapper — ikut standar GLOBAL CARD BACKGROUND */
body[data-theme="elite"] #api-connect-page .content,
body[data-theme="elite"] #api-connect-okx-page .content,
body[data-theme="elite"] #api-connect-tokocrypto-page .content {
    background-color: rgba(10, 13, 24, 0.9) !important;
    border: none !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
    padding-bottom: 16px !important;
}
body[data-theme="elite"] #api-connect-page [class*="input-screate-key"],
body[data-theme="elite"] #api-connect-okx-page [class*="input-screate-key"],
body[data-theme="elite"] #api-connect-tokocrypto-page [class*="input-screate-key"],
body[data-theme="elite"] #api-connect-page [class*="input-secret-key"],
body[data-theme="elite"] #api-connect-okx-page [class*="input-secret-key"],
body[data-theme="elite"] #api-connect-tokocrypto-page [class*="input-secret-key"] {
    margin-bottom: 8px !important;
    padding-bottom: 4px !important;
}
/* .content yg cuma bungkus teks "Don't have account? Register now" gak perlu
   glow/card look — kena rule di atas juga soalnya sama-sama ".content" di
   halaman yang sama. Di-reset polos khusus buat yang isinya cuma .key teks. */
body[data-theme="elite"]  #api-connect-page .content:has(> .key > .color-theme),
body[data-theme="elite"]  #api-connect-okx-page .content:has(> .key > .color-theme),
body[data-theme="elite"]  #api-connect-tokocrypto-page .content:has(> .key > .color-theme) {
    background: transparent !important;
    box-shadow: none !important;
}
/* The actual text inputs */
body[data-theme="elite"] #api-connect-page input.key,
body[data-theme="elite"] #api-connect-okx-page input.key,
body[data-theme="elite"] #api-connect-tokocrypto-page input.key {
    background: #000000 !important;
    border: 1px solid var(--th-border) !important;
    color: var(--th-text) !important;
    border-radius: 8px !important;
    padding: 0 10px !important;
    box-shadow: none !important;
}
/* Input Placeholder */
body[data-theme="elite"] #api-connect-page input.key::placeholder,
body[data-theme="elite"] #api-connect-okx-page input.key::placeholder,
body[data-theme="elite"] #api-connect-tokocrypto-page input.key::placeholder {
    color: var(--th-text-hint, rgba(255, 255, 255, 0.3)) !important;
}
/* Paste/Copy buttons */
body[data-theme="elite"] #api-connect-page .btn-copy,
body[data-theme="elite"] #api-connect-okx-page .btn-copy,
body[data-theme="elite"] #api-connect-tokocrypto-page .btn-copy {
    background: linear-gradient(135deg, rgba(92, 51, 181, 0.8) 0%, rgba(146, 76, 227, 0.8) 100%) !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
    color: white !important;
    border-radius: 6px !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.2) !important;
}
/* Connect / Disconnect Buttons */
body[data-theme="elite"] #api-connect-page .bottomButton .btn,
body[data-theme="elite"] #api-connect-okx-page .bottomButton .btn,
body[data-theme="elite"] #api-connect-tokocrypto-page .bottomButton .btn {
    background-image: var(--th-bg-api-btn, none) !important;
    background-size: cover !important;
    background-position: center !important;
    border: 1px solid rgba(146, 75, 225, 0.6) !important;
    color: white !important;
    box-shadow: 0 0 12px rgba(146, 75, 225, 0.3) !important;
}
/* Back button */
body[data-theme="elite"] #api-connect-page .bottomButton-back .btn,
body[data-theme="elite"] #api-connect-okx-page .bottomButton-back .btn,
body[data-theme="elite"] #api-connect-tokocrypto-page .bottomButton-back .btn {
    background-color: transparent !important;
    border: none !important;
    color: #924be1 !important;
}
/* Box for Spotlution IPs / Status Box
   Border opaque + background-clip padding-box supaya bg image tidak
   menutupi border translucent (border terlihat "kepotong") */
body[data-theme="elite"] #api-connect-page .gradient-purple-2,
body[data-theme="elite"] #api-connect-okx-page .gradient-purple-2,
body[data-theme="elite"] #api-connect-tokocrypto-page .gradient-purple-2 {
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4) !important;
    background-clip: padding-box !important;
}
body[data-theme="elite"] #api-connect-form-binance .gradient-purple-2,
body[data-theme="elite"] #api-connect-form-okx .gradient-purple-2,
body[data-theme="elite"] #api-connect-form-tokocrypto .gradient-purple-2 {
    background-image: var(--th-bg-api-ip, none) !important;
    background-size: cover !important;
    background-position: center !important;
}
body[data-theme="elite"] #api-connect-page > .gradient-purple-2,
body[data-theme="elite"] #api-connect-okx-page > .gradient-purple-2,
body[data-theme="elite"] #api-connect-tokocrypto-page > .gradient-purple-2 {
    background-image: var(--th-bg-api-status, none) !important;
    background-size: cover !important;
    background-position: center !important;
    background-clip: padding-box !important;
}
body[data-theme="elite"] #api-connect-page .color-theme,
body[data-theme="elite"] #api-connect-okx-page .color-theme,
body[data-theme="elite"] #api-connect-tokocrypto-page .color-theme {
    color: #a29fb4 !important;
}
body[data-theme="elite"] #api-connect-page .color-theme a,
body[data-theme="elite"] #api-connect-okx-page .color-theme a,
body[data-theme="elite"] #api-connect-tokocrypto-page .color-theme a {
    color: #924be1 !important;
}
body[data-theme="elite"] .pt-2 > .card.card-style,
body[data-theme="elite"] .card.card-style.bg-transparent,
body[data-theme="elite"] .card.card-style[style*="background-color: transparent"],
body[data-theme="elite"] .card.card-style[style*="background: transparent"],
body[data-theme="elite"] #quick-action-card {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}
body[data-theme="elite"] #asset-page .pt-2 > .card.card-style > .content,
body[data-theme="elite"] #bonus-page .pt-2 > .card.card-style > .content,
body[data-theme="elite"] #bonus-page #user-bonus .pt-2 > .card.card-style > .content {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
body[data-theme="elite"] #asset-page #tab-group-credit > .tab-controls,
body[data-theme="elite"] #bonus-page #tab-group-bonus > .tab-controls,
body[data-theme="elite"] .tab-controls {
    margin-top: 5px !important;
    background-color: #0f0a21 !important;
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    border-radius: 8px !important;
    padding: 2px !important;
    display: flex !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
/* =========================================================
   ELITE THEME SPECIFIC OVERRIDES FOR MENU
   ========================================================= */
/* Glowing Menu Background (top left glow) */
body[data-theme="elite"] .nav-container {
    background: radial-gradient(circle at top left, rgba(146, 75, 225, 0.4) 0%, rgba(20, 10, 40, 0.95) 40%, #080410 100%) !important;
}
/* Ensure menu-info has no background to let the glow show */
body[data-theme="elite"] #menu-info {
    background: transparent !important;
}
/* Menu drawer icons -> putih (bukan ungu) di semua tema gelap */
body[data-theme="elite"] .nav-container .nav li a i {
    color: #ffffff !important;
}
/* Greyish-purple text for menu items */
body[data-theme="elite"] .nav-container .nav li a {
    color: #a29fb4 !important;
}
body[data-theme="elite"] .tab-controls a {
    color: #a29fb4 !important;
    background: transparent !important;
    border-radius: 6px !important;
    margin: 0 !important;
    transition: all 0.3s ease;
    border: 1px solid transparent !important;
    text-align: center;
    flex: 1;
}
body[data-theme="elite"] .tab-controls a.active,
body[data-theme="elite"] .tab-controls a[aria-expanded="true"] {
    background-color: rgba(92, 51, 181, 0.6) !important;
    color: white !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
    box-shadow: 0 0 12px rgba(146, 75, 225, 0.4) !important;
}
body[data-theme="elite"] #tab-credit > .pt-1 > div,
body[data-theme="elite"] #tab-withdraw > .pt-1 > div,
body[data-theme="elite"] #tab-bonus > div,
body[data-theme="elite"] #tab-withdraw-bonus > .pt-1 > div {
    background-color: transparent !important;
}
body[data-theme="elite"] #tab-credit .font-500,
body[data-theme="elite"] #tab-withdraw .font-500 {
    color: white !important;
}
body[data-theme="elite"] .filter-box {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 8px !important;
    padding: 0 8px !important;
}
body[data-theme="elite"] .filter-box i,
body[data-theme="elite"] .filter-box label,
body[data-theme="elite"] .filter-box .color-black {
    color: white !important;
}
body[data-theme="elite"] .dropdown-menu {
    background-color: #0f0a21 !important;
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] .dropdown-menu .dropdown-item {
    color: white !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}
body[data-theme="elite"] .dropdown-menu .dropdown-item:last-child {
    border-bottom: none !important;
}
body[data-theme="elite"] .dropdown-menu .dropdown-item:hover,
body[data-theme="elite"] .dropdown-menu .dropdown-item:focus,
body[data-theme="elite"] .dropdown-menu .dropdown-item.active {
    background-color: var(--th-accent, #924be1) !important;
    color: white !important;
}
body[data-theme="elite"] #tab-group-credit .content:not(.tab-controls) {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
body[data-theme="elite"] #tab-group-bonus .content:not(.tab-controls) {
    background-color: #0f0a21 !important;
    border-radius: 12px !important;
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
    padding: 8px !important;
    margin-top: 12px !important;
}
body[data-theme="elite"] .divider {
    background-color: #ffffff !important;
    opacity: 0.1 !important;
}
body[data-theme="elite"] #tab-withdraw .searchBar-container,
body[data-theme="elite"] #tab-bonus .searchBar-container,
body[data-theme="elite"] #tab-withdraw-bonus .searchBar-container {
    background-color: transparent !important;
}
body[data-theme="elite"] #tab-withdraw .searchBar-container .color-theme,
body[data-theme="elite"] #tab-bonus .searchBar-container .color-theme,
body[data-theme="elite"] #tab-withdraw-bonus .searchBar-container .color-theme {
    color: white !important;
}
/* Row backgrounds - OVERRIDING VUE INLINE STYLES */
body[data-theme="elite"] #tab-credit .d-flex[aria-expanded="true"],
body[data-theme="elite"] #tab-withdraw .d-flex.py-1.my-1,
body[data-theme="elite"] #tab-bonus .d-flex[aria-expanded="true"],
body[data-theme="elite"] #tab-withdraw-bonus .d-flex.py-1.my-1 {
    background-color: transparent !important;
}
body[data-theme="elite"] #tab-credit .d-flex[aria-expanded="true"] h5.color-theme,
body[data-theme="elite"] #tab-bonus .d-flex[aria-expanded="true"] h5.color-theme,
body[data-theme="elite"] #tab-bonus .d-flex[aria-expanded="true"] h5.font-13,
body[data-theme="elite"] #tab-bonus .d-flex[aria-expanded="true"] p,
body[data-theme="elite"] #tab-bonus .searchBar-container p {
    color: white !important;
}
body[data-theme="elite"] #tab-withdraw .d-flex.py-1.my-1 p.font-12,
body[data-theme="elite"] #tab-withdraw .d-flex.py-1.my-1 h5.color-theme,
body[data-theme="elite"] #tab-withdraw-bonus .d-flex.py-1.my-1 p.font-12,
body[data-theme="elite"] #tab-withdraw-bonus .d-flex.py-1.my-1 h5.color-theme,
body[data-theme="elite"] #tab-withdraw-bonus .d-flex.py-1.my-1 h5 {
    color: white !important;
}
/* =========================================================
   ELITE THEME: KEUNTUNGAN HARIAN (INFO-PROFIT) CARDS
   ========================================================= */
/* Rincian profit: bentuk item sama seperti default (flat, siku, shadow
   lembut, tanpa margin antar item) — hanya warnanya mengikuti tema */
body[data-theme="elite"] #vue-info-profit .card.card-style {
    background-color: rgba(10, 13, 24, 0.9) !important;
    margin: 12px 15px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(146, 75, 225, 0.25) !important;
    box-shadow: rgba(146, 75, 225, 0.25) 0px 0px 15px -5px !important;
}
body[data-theme="elite"] #vue-info-profit .divider {
    background-color: rgba(146, 75, 225, 0.2) !important;
    opacity: 1 !important;
}
body[data-theme="elite"] #vue-info-profit .color-black,
body[data-theme="elite"] #vue-info-profit .color-theme,
body[data-theme="elite"] #vue-info-profit p:not([style*="color"]) {
    color: #f2effa !important;
}
body[data-theme="elite"] #vue-info-profit .font-11:not(.color-black):not(.color-theme) {
    color: rgba(242, 239, 250, 0.6) !important;
}
/* =========================================================
   ELITE THEME: BONUS (CASHBACK) TABS
   ========================================================= */
body[data-theme="elite"] #tab-bonus a.font-500[style*="color: black"],
body[data-theme="elite"] #tab-withdraw-bonus a.font-500[style*="color: black"] {
    color: white !important;
}
body[data-theme="elite"] #tab-bonus .filter-box label.color-black {
    color: white !important;
}
body[data-theme="elite"] #user-bonus > div > .pt-2 > .card.bg-white {
    background-color: transparent !important;
}
/* =========================================================
   ELITE THEME: SAVING MEMBERSHIP CARD (LIKE PROFIT HEADER)
   ========================================================= */
body[data-theme="elite"] #saving-membership .content.card {
    background-color: rgba(10, 5, 20, 0.4) !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
    border-radius: 12px !important;
    background-image: none !important;
    box-shadow: 0 0 20px 2px rgba(93, 70, 178, 0.5), inset 0 0 15px rgba(93, 70, 178, 0.3) !important;
    backdrop-filter: blur(2px);
}
/* Fix inline dark colors */
body[data-theme="elite"] #saving-membership .content.card [style*="color: rgb(33, 33, 33)"],
body[data-theme="elite"] #saving-membership .content.card [style*="color: #212121"],
body[data-theme="elite"] #saving-membership .content.card [style*="color: black"],
body[data-theme="elite"] #saving-membership .content.card p,
body[data-theme="elite"] #saving-membership .content.card h5,
body[data-theme="elite"] #saving-membership .content.card i.font-22 {
    color: white !important;
}
/* Divider inside card */
body[data-theme="elite"] #saving-membership .content.card .divider {
    background-color: rgba(255, 255, 255, 0.2) !important;
}
/* Daily Profit Button */
body[data-theme="elite"] #saving-membership .content.card .icon-button {
    background: linear-gradient(135deg, #924be1 0%, #5d46b2 100%) !important;
    color: white !important;
    border-radius: 20px !important;
    padding: 6px 14px !important;
    font-weight: 600 !important;
    display: inline-flex;
    align-items: center;
    box-shadow: 0 4px 15px rgba(146, 75, 225, 0.5) !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
}
body[data-theme="elite"] #saving-membership .content.card .icon-button i {
    color: white !important;
}
/* =========================================================
   ELITE THEME: SAVING HISTORY LIST (LIKE PROFIT TABLE)
   ========================================================= */
body[data-theme="elite"] #saving-history-list .color-black,
body[data-theme="elite"] #saving-history-list .saving-item1,
body[data-theme="elite"] #saving-history-list .saving-item2,
body[data-theme="elite"] #saving-history-list .saving-item3,
body[data-theme="elite"] #saving-history-list .saving-item4,
body[data-theme="elite"] #saving-history-list p,
body[data-theme="elite"] #stop-saving i {
    color: white !important;
}
/* =========================================================
   ELITE THEME: STRATEGY & FEE SETTINGS MODULES
   ========================================================= */
body[data-theme="elite"] #strategy-content > .content,
body[data-theme="elite"] #fee-setting-buy-bnb-content > .content,
body[data-theme="elite"] #fee-setting-information-content > .content,
body[data-theme="elite"] #fee-setting-information-detail-content > .content {
    background-color: transparent !important;
}
body[data-theme="elite"] #strategy-content .card.card-style,
body[data-theme="elite"] #fee-setting-buy-bnb-content .card.card-style,
body[data-theme="elite"] #fee-setting-information-content .card.card-style,
body[data-theme="elite"] #fee-setting-information-detail-content .card.card-style {
    background-color: rgba(10, 13, 24, 0.9) !important;
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* Override inline black text */
body[data-theme="elite"] #strategy-content [style*="color:black"],
body[data-theme="elite"] #strategy-content [style*="color: black"],
body[data-theme="elite"] #fee-setting-buy-bnb-content [style*="color:black"],
body[data-theme="elite"] #fee-setting-buy-bnb-content [style*="color: black"],
body[data-theme="elite"] #fee-setting-information-content [style*="color:black"],
body[data-theme="elite"] #fee-setting-information-content [style*="color: black"],
body[data-theme="elite"] #fee-setting-information-detail-content [style*="color:black"],
body[data-theme="elite"] #fee-setting-information-detail-content [style*="color: black"] {
    color: white !important;
}
/* General text elements inside these cards */
body[data-theme="elite"] #strategy-content .card.card-style h5,
body[data-theme="elite"] #fee-setting-buy-bnb-content .card.card-style h5,
body[data-theme="elite"] #fee-setting-information-content .card.card-style h5,
body[data-theme="elite"] #fee-setting-information-detail-content .card.card-style h5,
body[data-theme="elite"] #strategy-content .card.card-style span,
body[data-theme="elite"] #fee-setting-buy-bnb-content .card.card-style span,
body[data-theme="elite"] #fee-setting-information-content .card.card-style span,
body[data-theme="elite"] #fee-setting-information-detail-content .card.card-style span {
    color: white !important;
}
/* Fix white forms/inputs inside these modules */
body[data-theme="elite"] #strategy-content .form-control,
body[data-theme="elite"] #fee-setting-buy-bnb-content .form-control,
body[data-theme="elite"] #fee-setting-information-content .form-control,
body[data-theme="elite"] #fee-setting-information-detail-content .form-control {
    background-color: transparent !important;
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    color: white !important;
}
/* Fix placeholder colors for these inputs */
body[data-theme="elite"] #strategy-content .form-control::placeholder,
body[data-theme="elite"] #fee-setting-buy-bnb-content .form-control::placeholder,
body[data-theme="elite"] #fee-setting-information-content .form-control::placeholder,
body[data-theme="elite"] #fee-setting-information-detail-content .form-control::placeholder {
    color: var(--th-text-hint, rgba(255, 255, 255, 0.5)) !important;
}
body[data-theme="elite"] #saving-history-list .saving-list {
    padding: 15px 15px 10px 15px !important;
}
/* =========================================================
   ELITE THEME: EXTENDED MODULES (Formula, Transactions, Summary, etc.)
   ========================================================= */
/* Force ALL offcanvas drawers to be dark in Elite Mode */
body[data-theme="elite"] .offcanvas,
body[data-theme="elite"] .offcanvas-footer {
    background-color: #01000E !important;
}
/* Neutralize hardcoded .theme-light wrappers inside Elite Mode */
body[data-theme="elite"] .theme-light {
    background-color: transparent !important;
}
/* Make backgrounds of main containers transparent */
body[data-theme="elite"] #body-formula,
body[data-theme="elite"] #body-formula > .content,
body[data-theme="elite"] #body-batch-formula,
body[data-theme="elite"] #body-batch-formula > .content,
body[data-theme="elite"] #coin-setting .page-content,
body[data-theme="elite"] #vue-transaction-history,
body[data-theme="elite"] #user-summary,
body[data-theme="elite"] #user-profit-summary,
body[data-theme="elite"] #user-roi-setting,
body[data-theme="elite"] #vue-trading-history-body,
body[data-theme="elite"] #body-balancing-configuration {
    background-color: transparent !important;
}
/* Transform all inner cards and white backgrounds into Elite cards */
body[data-theme="elite"] #body-formula .card,
body[data-theme="elite"] #body-formula .bg-theme,
body[data-theme="elite"] #body-batch-formula .card,
body[data-theme="elite"] #body-batch-formula .bg-theme,
body[data-theme="elite"] #vue-transaction-history .content.bg-theme,
body[data-theme="elite"] #vue-transaction-history .card,
body[data-theme="elite"] #user-summary .content.bg-theme,
body[data-theme="elite"] #user-summary .card,
body[data-theme="elite"] #user-profit-summary .content,
body[data-theme="elite"] #user-profit-summary .card,
body[data-theme="elite"] #vue-trading-history-body .card,
body[data-theme="elite"] #vue-trading-history-body .content.bg-theme,
body[data-theme="elite"] #body-balancing-configuration .content,
body[data-theme="elite"] #body-balancing-configuration .card {
    background-color: #0f0a21 !important;
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
/* Collapse section di dalam kartu formula (TA, Trailing Profit, dll.):
   tanpa border/box sendiri — cukup ikut kartu induknya (seperti di strategy) */
body[data-theme="elite"] #body-formula [id^="collapse-list"].bg-theme,
body[data-theme="elite"] #body-batch-formula [id^="collapse-list"].bg-theme,
body[data-theme="elite"] #collapse-moon-logic-formula.bg-theme,
body[data-theme="elite"] #collapse-moon-logic-batch-formula.bg-theme {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
/* Coin detail cards: 30% transparent so the video background shows through */
body[data-theme="elite"] #coin-setting .content.bg-theme {
    background-color: rgba(15, 10, 33, 0.80) !important; /* @80% */
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
/* Forms and Inputs transparency */
body[data-theme="elite"] #body-formula .form-control,
body[data-theme="elite"] #body-batch-formula .form-control,
body[data-theme="elite"] #coin-setting .form-control,
body[data-theme="elite"] #vue-transaction-history .form-control,
body[data-theme="elite"] #user-summary .form-control,
body[data-theme="elite"] #user-profit-summary .form-control,
body[data-theme="elite"] #user-roi-setting .form-control,
body[data-theme="elite"] #vue-trading-history-body .form-control,
body[data-theme="elite"] #body-balancing-configuration .form-control {
    background-color: transparent !important;
    border: 0.5px solid rgba(146, 75, 225, 0.3) !important;
    color: white !important;
}
/* ROI Setting: input-group seragam dengan pola form withdrawal
   (box ber-border tema + glow, ikon transparan dengan separator, input polos) */
body[data-theme="elite"] #user-roi-setting .input-group {
    background-color: var(--th-surface-2, #1a113a) !important;
    border: 1px solid rgba(146, 75, 225, 0.6) !important;
    border-radius: 8px !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.2) !important;
    overflow: hidden;
}
body[data-theme="elite"] #user-roi-setting .input-group:focus-within {
    border-color: #924be1 !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.4) !important;
}
body[data-theme="elite"] #user-roi-setting .input-group .input-group-text {
    background-color: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    color: white !important;
    border-right: 1px solid rgba(146, 75, 225, 0.3) !important;
}
body[data-theme="elite"] #user-roi-setting .input-group .form-control,
body[data-theme="elite"] #user-roi-setting #roi-setting-capital,
body[data-theme="elite"] #user-roi-setting #roi-setting-year {
    background-color: #000000 !important;
    background: #000000 !important;
    border: none !important;
    box-shadow: none !important;
    color: white !important;
}
body[data-theme="elite"] #user-roi-setting .input-group .form-control::placeholder,
body[data-theme="elite"] #user-roi-setting #roi-setting-capital::placeholder {
    color: var(--th-text-muted, rgba(255, 255, 255, 0.4)) !important;
}
/* Override hardcoded black inline texts */
body[data-theme="elite"] #body-formula [style*="color:black"],
body[data-theme="elite"] #body-formula [style*="color: black"],
body[data-theme="elite"] #body-batch-formula [style*="color:black"],
body[data-theme="elite"] #body-batch-formula [style*="color: black"],
body[data-theme="elite"] #coin-setting [style*="color:black"],
body[data-theme="elite"] #coin-setting [style*="color: black"],
body[data-theme="elite"] #vue-transaction-history [style*="color:black"],
body[data-theme="elite"] #vue-transaction-history [style*="color: black"],
body[data-theme="elite"] #user-summary [style*="color:black"],
body[data-theme="elite"] #user-summary [style*="color: black"],
body[data-theme="elite"] #user-profit-summary [style*="color:black"],
body[data-theme="elite"] #user-profit-summary [style*="color: black"],
body[data-theme="elite"] #user-roi-setting [style*="color:black"],
body[data-theme="elite"] #user-roi-setting [style*="color: black"],
body[data-theme="elite"] #vue-trading-history-body [style*="color:black"],
body[data-theme="elite"] #vue-trading-history-body [style*="color: black"],
body[data-theme="elite"] #body-balancing-configuration [style*="color:black"],
body[data-theme="elite"] #body-balancing-configuration [style*="color: black"],
body[data-theme="elite"] .content-recharge [style*="color: #333"],
body[data-theme="elite"] .content-recharge [style*="color:#333"] {
    color: white !important;
}
body[data-theme="elite"] .content-recharge h2,
body[data-theme="elite"] .content-recharge h2 *,
body[data-theme="elite"] .content-recharge [style*="color: #d9534f"],
body[data-theme="elite"] .content-recharge [style*="color: #d9534f"] *,
body[data-theme="elite"] .content-recharge [style*="color:#d9534f"],
body[data-theme="elite"] .content-recharge [style*="color:#d9534f"] * {
    color: #ff5252 !important;
    -webkit-text-fill-color: #ff5252 !important;
}
body[data-theme="elite"] .warning-box {
    background-color: rgba(255, 152, 0, 0.1) !important;
    border: 1px solid #ff9800 !important;
    box-shadow: 0 0 15px rgba(255, 152, 0, 0.2) !important;
}
body[data-theme="elite"] .content-recharge {
    background-color: var(--th-surface-2) !important;
    border: 1px solid rgba(146, 75, 225, 0.5) !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] .content-recharge a {
    color: var(--th-accent-light, #d4a5ff) !important;
}
/* Generic text tags inside these dark modules must be white */
body[data-theme="elite"] #body-formula h5,
body[data-theme="elite"] #body-formula h6,
body[data-theme="elite"] #body-formula span,
body[data-theme="elite"] #body-formula p,
body[data-theme="elite"] #body-formula label,
body[data-theme="elite"] #body-batch-formula h5,
body[data-theme="elite"] #body-batch-formula h6,
body[data-theme="elite"] #body-batch-formula span,
body[data-theme="elite"] #body-batch-formula p,
body[data-theme="elite"] #body-batch-formula label,
body[data-theme="elite"] #coin-setting h5,
body[data-theme="elite"] #coin-setting h6,
body[data-theme="elite"] #coin-setting span:not(.badge),
body[data-theme="elite"] #coin-setting p,
body[data-theme="elite"] #vue-transaction-history h5,
body[data-theme="elite"] #vue-transaction-history h6,
body[data-theme="elite"] #vue-transaction-history span:not(.badge),
body[data-theme="elite"] #vue-transaction-history p,
body[data-theme="elite"] #user-summary h5,
body[data-theme="elite"] #user-summary h6,
body[data-theme="elite"] #user-summary span,
body[data-theme="elite"] #user-summary p,
body[data-theme="elite"] #user-profit-summary h5,
body[data-theme="elite"] #user-profit-summary h6,
body[data-theme="elite"] #user-profit-summary span,
body[data-theme="elite"] #user-profit-summary p,
body[data-theme="elite"] #user-profit-summary i,
body[data-theme="elite"] #user-roi-setting h5,
body[data-theme="elite"] #user-roi-setting h6,
body[data-theme="elite"] #user-roi-setting span,
body[data-theme="elite"] #user-roi-setting p,
body[data-theme="elite"] #user-roi-setting i,
body[data-theme="elite"] #vue-trading-history-body h5,
body[data-theme="elite"] #vue-trading-history-body h6,
body[data-theme="elite"] #vue-trading-history-body span,
body[data-theme="elite"] #vue-trading-history-body p,
body[data-theme="elite"] #body-balancing-configuration h5,
body[data-theme="elite"] #body-balancing-configuration h6,
body[data-theme="elite"] #body-balancing-configuration span,
body[data-theme="elite"] #body-balancing-configuration p {
    color: white !important;
}
/* Fix checkboxes/radios visibility in Elite Mode */
body[data-theme="elite"] .form-check-input {
    border-color: #cccccc !important;
    background-color: transparent !important;
    border-radius: 50% !important;
}
body[data-theme="elite"] .form-check-input:checked {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"), linear-gradient(135deg, #924be1 0%, #5d46b2 100%) !important;
    background-size: 80% 80%, 100% 100% !important;
    background-position: center, center !important;
    background-repeat: no-repeat !important;
    border-color: #924be1 !important;
}
/* Ensure inputs placeholders are visible */
body[data-theme="elite"] #body-formula .form-control::placeholder,
body[data-theme="elite"] #body-batch-formula .form-control::placeholder,
body[data-theme="elite"] #coin-setting .form-control::placeholder,
body[data-theme="elite"] #vue-transaction-history .form-control::placeholder,
body[data-theme="elite"] #user-summary .form-control::placeholder,
body[data-theme="elite"] #vue-trading-history-body .form-control::placeholder,
body[data-theme="elite"] #body-balancing-configuration .form-control::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}
body[data-theme="elite"] #saving-history-list .saving-item1,
body[data-theme="elite"] #saving-history-list .saving-item2 {
    margin-bottom: 12px !important;
    opacity: 0.8 !important;
}
body[data-theme="elite"] #saving-history-list .divider {
    background-color: rgba(146, 75, 225, 0.5) !important;
    height: 1px !important;
    margin: 0 15px !important;
    opacity: 1 !important;
    box-shadow: 0 0 8px 1px rgba(146, 75, 225, 0.6) !important;
}
/* Header Border Fix */
body[data-theme="elite"] #saving-history-list .bg-theme > div {
    border-bottom: 1px solid rgba(146, 75, 225, 0.5) !important;
    box-shadow: 0 1px 8px -1px rgba(146, 75, 225, 0.4) !important;
    padding-bottom: 10px !important;
    padding-top: 15px !important;
    margin: 0 15px !important;
    padding-left: 0 !important;
}
/* =========================================================
   ELITE THEME: SAVING PAGE FOOTER BUTTONS
   ========================================================= */
body[data-theme="elite"] #footer-bar-savings {
    background-color: #080410 !important;
    /* border: 1px solid rgba(146, 75, 225, 0.8) !important;
    border-bottom: none !important;
    box-shadow: 0 0 15px rgba(146, 75, 225, 0.5) !important; */
    padding: 15px !important;
}
body[data-theme="elite"] #set-amount-to-start-saving {
    background: linear-gradient(135deg, #924be1 0%, #5d46b2 100%) !important;
    border-radius: 25px !important;
    box-shadow: 0 4px 15px rgba(146, 75, 225, 0.5) !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
    padding: 12px 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px;
}
body[data-theme="elite"] #stop-saving {
    background: linear-gradient(135deg, #e74c3c 0%, #c0392b 100%) !important;
    border-radius: 25px !important;
    box-shadow: 0 4px 15px rgba(231, 76, 60, 0.4) !important;
    padding: 12px 15px !important;
    font-weight: 600 !important;
}
body[data-theme="elite"] #saving-setting {
    background: linear-gradient(135deg, #924be1 0%, #5d46b2 100%) !important;
    border-radius: 25px !important;
    box-shadow: 0 4px 15px rgba(146, 75, 225, 0.4) !important;
    padding: 12px 15px !important;
    font-weight: 600 !important;
}
/* =========================================================
   DYNAMIC THEME: SWEETALERT & MODALS
   ========================================================= */
body[data-theme="elite"] .swal2-popup,
body[data-theme="elite"] .modal-content,
body[data-theme="elite"] .offcanvas,
body[data-theme="elite"] .dialog-ovelay .dialog,
body[data-theme="elite"] .dialog-ovelay-2 .dialog,
body[data-theme="elite"] .popUp .card.card-style {
    background-color: var(--th-surface) !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
    box-shadow: 0 0 20px var(--th-shadow),
                inset 0 0 20px 5px rgba(0, 0, 0, 0.65),
                inset 0 0 15px var(--th-border) !important; /* Add glowing shadow to the modal */
}
/* Extra glow specifically for Elite theme */
body[data-theme="elite"] .swal2-popup,
body[data-theme="elite"] .modal-content,
body[data-theme="elite"] .offcanvas,
body[data-theme="elite"] .dialog-ovelay .dialog,
body[data-theme="elite"] .dialog-ovelay-2 .dialog,
body[data-theme="elite"] .popUp .card.card-style {
    background-color: rgba(10, 13, 24, 0.9) !important;
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* Custom styling for SweetAlert custom dialog elements (Coin Group Volatility alerts, etc.) */
body[data-theme="elite"] #swal-confirm-btn {
    background: var(--th-accent-grad, #924be1) !important;
    color: white !important;
    border: none !important;
}
body[data-theme="elite"] #swal-cancel-btn {
    background: transparent !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
}
body[data-theme="elite"] .swal2-popup .text-xl-coin-group {
    color: var(--th-text) !important;
}
body[data-theme="elite"] .swal2-popup .bg-red-box-coin-group {
    background-color: rgba(220, 38, 38, 0.15) !important;
    border: 1px solid rgba(220, 38, 38, 0.3) !important;
    border-radius: 8px;
    padding: 10px;
    margin: 10px 0;
}
body[data-theme="elite"] .swal2-popup .bg-red-box-coin-group p,
body[data-theme="elite"] .swal2-popup .bg-red-box-coin-group ul,
body[data-theme="elite"] .swal2-popup .bg-red-box-coin-group li {
    color: #fca5a5 !important;
}
body[data-theme="elite"] .swal2-popup div[style*="background-color: #eef2ff"],
body[data-theme="elite"] .swal2-popup div[style*="background-color:#eef2ff"] {
    background-color: rgba(146, 75, 225, 0.15) !important;
    color: var(--th-text) !important;
}
body[data-theme="elite"] .swal2-popup div[style*="background-color: #eef2ff"] strong,
body[data-theme="elite"] .swal2-popup div[style*="background-color:#eef2ff"] strong {
    color: var(--th-accent) !important;
}
/* Global Cards Glossy Glow Override */
body[data-theme="elite"] .card.card-style {
    border: 1px solid var(--th-border) !important;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5),
                inset 0 0 20px 5px rgba(0, 0, 0, 0.65),
                inset 0 0 15px var(--th-border) !important;
}
body[data-theme="elite"] .accordion-header.card.card-style {
    background-color: var(--th-surface) !important;
    border: 1px solid var(--th-border) !important;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.5),
                inset 0 0 20px 0px rgba(0, 0, 0, 2),
                inset 0 0 15px var(--th-border) !important;
}
/* Elite Theme specific Card Glow Override (Stronger Glow) */
body[data-theme="elite"] .card.card-style {
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 20px rgba(146, 75, 225, 0.25),
                inset 0 0 20px 5px rgba(0, 0, 0, 0.7),
                inset 0 0 15px rgba(146, 75, 225, 0.35) !important;
}
body[data-theme="elite"] .accordion-header.card.card-style {
    background-color: rgba(27, 24, 43, 0.8) !important; /* Match other cards */
    border: 1px solid rgba(146, 75, 225, 0.4) !important;
    box-shadow: 0 0 20px rgba(146, 75, 225, 0.25),
                inset 0 0 20px 0px rgba(0, 0, 0, 2),
                inset 0 0 15px rgba(146, 75, 225, 0.35) !important;
}
/* Prevent transparent wrappers from getting borders and shadows */
body[data-theme="elite"] .pt-2 > .card.card-style,
body[data-theme="elite"] .card.card-style.bg-transparent,
body[data-theme="elite"] .card.card-style[style*="background-color: transparent"],
body[data-theme="elite"] .card.card-style[style*="background: transparent"],
body[data-theme="elite"] #quick-action-card {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}
body[data-theme="elite"] .swal2-title,
body[data-theme="elite"] .swal2-html-container,
body[data-theme="elite"] .swal2-content,
body[data-theme="elite"] .modal-title,
body[data-theme="elite"] .modal-body,
body[data-theme="elite"] .modal-header h2,
body[data-theme="elite"] .swal2-popup .color-black,
body[data-theme="elite"] .swal2-popup [style*="color: black"],
body[data-theme="elite"] .swal2-popup [style*="color:black"] {
    color: white !important;
}
body[data-theme="elite"] .modal-content h1,
body[data-theme="elite"] .modal-content h2,
body[data-theme="elite"] .modal-content h3,
body[data-theme="elite"] .modal-content h4,
body[data-theme="elite"] .modal-content h5,
body[data-theme="elite"] .modal-content h6,
body[data-theme="elite"] .offcanvas-title,
body[data-theme="elite"] .offcanvas-body,
body[data-theme="elite"] .dialog-ovelay .dialog header h2,
body[data-theme="elite"] .dialog-ovelay .dialog header h3,
body[data-theme="elite"] .dialog-ovelay .dialog .dialog-msg p,
body[data-theme="elite"] .dialog-ovelay-2 .dialog header h2,
body[data-theme="elite"] .dialog-ovelay-2 .dialog header h3,
body[data-theme="elite"] .dialog-ovelay-2 .dialog .dialog-msg p,
body[data-theme="elite"] .popUp .card.card-style div,
body[data-theme="elite"] .popUp .card.card-style p,
body[data-theme="elite"] .popUp .card.card-style span,
body[data-theme="elite"] .popUp .card.card-style a,
body[data-theme="elite"] .popUp .card.card-style .color-black {
    color: var(--th-text) !important;
}
body[data-theme="elite"] .dialog-ovelay .dialog header,
body[data-theme="elite"] .dialog-ovelay-2 .dialog header {
    background-color: transparent !important;
    border-bottom: 1px solid var(--th-border) !important;
}
body[data-theme="elite"] .modal-header,
body[data-theme="elite"] .modal-footer {
    border: none !important;
}
body[data-theme="elite"] .swal2-popup select,
body[data-theme="elite"] .swal2-popup input,
body[data-theme="elite"] .modal-content select,
body[data-theme="elite"] .modal-content input,
body[data-theme="elite"] .offcanvas select,
body[data-theme="elite"] .offcanvas input,
body[data-theme="elite"] .popUp .card.card-style select,
body[data-theme="elite"] .popUp .card.card-style input {
    background-color: var(--th-surface-2) !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
}
/* Password create/change modal (SweetAlert): #swal2-input-password /
   #swal2-input-confirm-password — dipasangin sama tombol eye .SwalBtn2, jadi
   di-target langsung by ID biar pasti menang dari style bawaan .swal2-input. */
body[data-theme="elite"] .swal2-popup .swal2-input,
body[data-theme="elite"] #swal2-input-recovery {
    background-color: transparent !important;
    background: transparent !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: 1px solid var(--th-border, rgba(163, 84, 230, 0.5)) !important;
    box-shadow: 0 0 10px rgba(163, 84, 230, 0.25) !important;
    border-radius: 8px !important;
}
body[data-theme="elite"] .swal2-popup .swal2-input::placeholder,
body[data-theme="elite"] #swal2-input-recovery::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.5) !important;
}
body[data-theme="elite"] #swal2-input-recovery:focus {
    border-color: rgba(164, 92, 255, 0.9) !important;
    box-shadow: 0 0 12px rgba(164, 92, 255, 0.45) !important;
    outline: none !important;
}
body[data-theme="elite"] #swal2-input-password,
body[data-theme="elite"] #swal2-input-confirm-password {
    background-color: var(--th-surface-2) !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
    border-right: none !important;
}
body[data-theme="elite"] #swal2-input-password::placeholder,
body[data-theme="elite"] #swal2-input-confirm-password::placeholder {
    color: var(--th-text-muted) !important;
}
/* Margin config popup (SweetAlert): #swal-drop-rate / #swal-buy-amount /
   #swal-take-profit — HTML-nya nulis atribut class dua kali
   (class="col-3 rounded-2 border border-dark-subtle" ... class="swal2-input"),
   browser cuma pakai yang PERTAMA jadi class swal2-input-nya gak pernah
   nempel — target langsung by ID biar pasti kena. */
body[data-theme="elite"] #swal-drop-rate,
body[data-theme="elite"] #swal-buy-amount,
body[data-theme="elite"] #swal-take-profit {
    background-color: var(--th-surface-2) !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
}
body[data-theme="elite"] .form-custom {
    border-color: var(--th-border) !important;
}
body[data-theme="elite"] .swal2-popup .swal2-confirm,
body[data-theme="elite"] .dialog-ovelay .dialog .button-danger,
body[data-theme="elite"] .dialog-ovelay-2 .dialog .button-danger,
body[data-theme="elite"] .buy-modal-content button[onclick*="Confirm"] {
    background: var(--th-accent-grad, var(--th-accent)) !important;
    color: #fff !important;
    border: none !important;
    box-shadow: 0 0 15px var(--th-shadow) !important; /* Add glowing shadow to the button */
}
/* Extra shiny button for Elite theme */
body[data-theme="elite"] .swal2-popup .swal2-confirm,
body[data-theme="elite"] .dialog-ovelay .dialog .button-danger,
body[data-theme="elite"] .dialog-ovelay-2 .dialog .button-danger,
body[data-theme="elite"] .buy-modal-content button[onclick*="Confirm"] {
    background: linear-gradient(135deg, #a73bf2, #7a22cc) !important;
    box-shadow: 0 0 15px rgba(167, 59, 242, 0.7), inset 0 0 5px rgba(255, 255, 255, 0.3) !important;
    text-shadow: 0 0 3px rgba(255, 255, 255, 0.5) !important;
}
body[data-theme="elite"] .swal2-popup .swal2-cancel,
body[data-theme="elite"] .dialog-ovelay .dialog .button-default,
body[data-theme="elite"] .dialog-ovelay-2 .dialog .button-default,
body[data-theme="elite"] .popUp .card.card-style .border-dark-dark,
body[data-theme="elite"] .buy-modal-content button[onclick*="Close"] {
    background: var(--th-surface-2) !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
}
/* SweetAlert Validation Message */
body[data-theme="elite"] .swal2-validation-message,
body[data-theme="elite"] .swal2-popup .swal2-validation-message {
    background: rgba(164, 92, 255, 0.14) !important;
    border: 1px solid rgba(164, 92, 255, 0.5) !important;
    color: var(--th-accent-2, #c9a0ff) !important;
    -webkit-text-fill-color: var(--th-accent-2, #c9a0ff) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    margin: 14px auto 8px auto !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    box-shadow: 0 0 14px rgba(164, 92, 255, 0.25) !important;
}
body[data-theme="elite"] .swal2-validation-message::before,
body[data-theme="elite"] .swal2-popup .swal2-validation-message::before {
    background-color: #ff5252 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
}
/* Link "Bagaimana cara menemukan ID Transaksi saya?" di Recovery Swal -> Elite Purple */
body[data-theme="elite"] #recharge-recovery-swal a,
body[data-theme="elite"] #recharge-recovery-swal a[onclick*="CallGitbook"],
body[data-theme="elite"] #recharge-recovery-swal [style*="924be1"],
body[data-theme="elite"] .swal2-popup a[onclick*="CallGitbook"],
body[data-theme="elite"] .recovery-gitbook-link {
    color: var(--th-accent-2, #a45cff) !important;
    -webkit-text-fill-color: var(--th-accent-2, #a45cff) !important;
    text-decoration: underline !important;
}
body[data-theme="elite"] .badge-shine-wrapper.shine-active::after {
    content: "";
    position: absolute;
    top: 0;
    left: -100%;
    width: 30%;
    height: 100%;
    background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,0) 100%);
    transform: skewX(-20deg);
    animation: shine-sweep 5s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    pointer-events: none; /* Prevent blocking clicks */
}
/* =========================================================
   Unified Button Theme Overrides
   ========================================================= */
/* --- ELITE THEME --- */
body[data-theme="elite"] .btn-primary {
    background: linear-gradient(135deg, rgba(92, 51, 181, 0.8) 0%, rgba(146, 76, 227, 0.8) 100%) !important;
    border: 1px solid rgba(146, 75, 225, 0.8) !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.3) !important;
}
body[data-theme="elite"] .btn-fail {
    background: linear-gradient(135deg, rgba(181, 51, 51, 0.8) 0%, rgba(227, 76, 76, 0.8) 100%) !important;
    border: 1px solid rgba(225, 75, 75, 0.8) !important;
    box-shadow: 0 0 10px rgba(225, 75, 75, 0.3) !important;
}
/* =========================================
   PROFIT TABLE THEME FIXES 
   ========================================= */
body[data-theme="elite"] #profit-page .card.card-style {
  background-color: var(--th-card-bg) !important;
}
body[data-theme="elite"] #profit-page .color-purple {
  color: #a77adf !important;
}
body[data-theme="elite"] #profit-page a.font-500[style*="color: black"],
body[data-theme="elite"] #profit-page .color-black {
  color: var(--th-text) !important;
}
body[data-theme="elite"] #profit-page .divider[style*="background-color: #000"] {
  background-color: rgba(255, 255, 255, 0.2) !important;
}
/* =========================================
   CAROUSEL BATCH THEME FIXES 
   ========================================= */
body[data-theme="elite"] #carousel-batch .carousel-item {
  background-color: transparent !important;
}
/* =========================================
   TRADE PAGE THEME FIXES 
   ========================================= */
body[data-theme="elite"] #trade-top-divider {
  display: none !important;
}
/* =========================================
   CREDIT INFO HEADER: THEMED BG IMAGE
   ========================================= */
body[data-theme="elite"] #vue-tab-asset_credit_info {
  background-image: var(--th-bg-api-ip) !important;
  background-color: var(--th-header-solid-bg, #0b0716) !important;
  background-size: cover !important;
  background-position: center !important;
}
/* For specific dark themes, show the themed buttons and hide the default ones. */
body[data-theme="elite"] .btn-start-theme,
body[data-theme="elite"] .btn-stop-theme {
  display: inline-block !important; /* inline-block matches button */
  width: 100%;
}
body[data-theme="elite"] .btn-start-default,
body[data-theme="elite"] .btn-stop-default {
  display: none !important;
}
/* Active/inactive state override (toggled from JS on the strategy page).
   Higher specificity than the theme "show" rule above so it wins. */
body[data-theme="elite"] .btn-start-theme.btn-trade-hidden,
body[data-theme="elite"] .btn-stop-theme.btn-trade-hidden {
  display: none !important;
}
body[data-theme="elite"] .reset-formula-avg,
body[data-theme="elite"] .batch-reset-formula-avg,
body[data-theme="elite"] button[onclick*="InsertNewAddress"],
body[data-theme="elite"] #regis-phone {
  background-image: var(--th-btn-stop-img, linear-gradient(135deg, #d84558, #a5303f)) !important;
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
}
body[data-theme="elite"] .change-all-btn,
body[data-theme="elite"] .batch-change-all-btn {
  background-image: var(--th-btn-pause-img, linear-gradient(135deg, #f7b733, #d98e04)) !important;
  border: 1px solid rgba(255, 190, 90, 0.75) !important;
  box-shadow: 0 0 16px rgba(247, 160, 30, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(255, 210, 130, 0.25) !important;
}
/* Toast (alert.html): di mode tema jangan warna polos, pakai gaya tombol
   start/pause/stop yang mengkilat; default (non-tema) tetap warna aslinya */
body[data-theme="elite"] .alert-warning,
body[data-theme="elite"] .alert-success,
body[data-theme="elite"] .alert-error {
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}
/* Warning: pause.png mengkilat */
body[data-theme="elite"] .alert-warning {
  background-image: var(--th-btn-pause-img, linear-gradient(135deg, #f7b733, #d98e04)) !important;
  border: 1px solid rgba(255, 190, 90, 0.75) !important;
  box-shadow: 0 0 16px rgba(247, 160, 30, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(255, 210, 130, 0.25) !important;
  color: #ffffff !important;
  -webkit-text-stroke: 0.3px rgba(0, 0, 0, 0.3);
  paint-order: stroke fill;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
body[data-theme="elite"] .alert-warning span,
body[data-theme="elite"] .alert-warning i {
  color: #ffffff !important;
  -webkit-text-stroke: 0.3px rgba(0, 0, 0, 0.3);
  paint-order: stroke fill;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
/* Berhasil: start.png mengkilat */
body[data-theme="elite"] .alert-success {
  background-image: var(--th-btn-start-img, linear-gradient(135deg, #24c48d, #1a9e6f)) !important;
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
}
/* Error/gagal: stop.png mengkilat */
body[data-theme="elite"] .alert-error {
  background-image: var(--th-btn-stop-img, linear-gradient(135deg, #d84558, #a5303f)) !important;
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
}
/* Force Buy / Force Sell — themed banners (elite only; default untouched) */
body[data-theme="elite"] #btn-force-buy,
body[data-theme="elite"] #btn-force-sell {
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
}
body[data-theme="elite"] #btn-force-buy {
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
}
body[data-theme="elite"] #btn-force-sell {
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
}
body[data-theme="elite"] #btn-force-buy {
  background-image: var(--th-btn-force-buy-img) !important;
}
body[data-theme="elite"] #btn-force-sell {
  background-image: var(--th-btn-force-sell-img) !important;
}
/* Moon Logic icon — themed swap (default untouched).
   Global: semua img moon-logic-icon diganti versi tema, ukuran ikut konteks masing-masing. */
body[data-theme="elite"]  img[src*="moon-logic-icon"] {
  content: url("../../assets/orbit-elit/moonlogic.png?v=1");
  object-fit: contain;
}
/* Ukuran khusus di settings coin detail */
body[data-theme="elite"]  .settings-item img[src*="moon-logic-icon"] {
  width: 40px !important;
  height: 40px !important;
}
/* Coin detail setting icons — themed swap (elite only; default untouched).
   avg (balance-scale) reflects ON/OFF via inline color: #36b693=on, #d84558=off.
   The browser serializes the inline style to rgb(), so match the rgb form too. */
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="36b693"],
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="54, 182, 147"],
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="d84558"],
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="216, 69, 88"],
body[data-theme="elite"] .settings-item i.fa-tools,
body[data-theme="elite"] .settings-item i.fa-traffic-light,
body[data-theme="elite"] .settings-item i.fa-box {
  display: inline-block;
  width: 48px;
  height: 48px;
  object-fit: contain;
  vertical-align: middle;
}
/* Elite */
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="36b693"],
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="54, 182, 147"] {
  content: url("../../assets/orbit-elit/coin-detail/avg-on.png?v=1");
}
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="d84558"],
body[data-theme="elite"] .settings-item i.fa-balance-scale[style*="216, 69, 88"] {
  content: url("../../assets/orbit-elit/coin-detail/avg-off.png?v=1");
}
body[data-theme="elite"] .settings-item i.fa-tools {
  content: url("../../assets/orbit-elit/coin-detail/formula.png?v=1");
}
body[data-theme="elite"] .settings-item i.fa-traffic-light {
  content: url("../../assets/orbit-elit/coin-detail/nonstop.png?v=1");
}
body[data-theme="elite"] .settings-item i.fa-box {
  content: url("../../assets/orbit-elit/coin-detail/partial.png?v=1");
}
/* =========================================
   LEADERBOARD (rank-pop-up) — ELITE THEME
   Assets: ../assets/orbit-elit/leaderboard/
   (only when the theme is active; default is untouched)
   ========================================= */
/* Palette (elite leaderboard):
   Base BG #0A0715 · Modal BG #141225 · Card/Table BG #1B182B
   Header Purple #2C214F · Border Purple #8F6DD7 · Glow Purple #A45CFF
   Text Primary #F2EFFA · Text Secondary #96929D · Gold Accent #FFD86B */
/* Whole card uses the space background image (fallback = Base BG) */
body[data-theme="elite"] .ranking-top-up {
  background: url("../../assets/orbit-elit/leaderboard/bg-pg-leaderboard.png") center top / cover no-repeat,
              #0a0715 !important;
  overflow: hidden;
}
body[data-theme="elite"] .ranking-top-up-wrapper {
  position: relative;
  border: none !important;
  box-shadow: 0 0 20px rgba(164, 92, 255, 0.8), 
              0 0 40px rgba(255, 216, 107, 0.4), 
              inset 0 0 15px rgba(164, 92, 255, 0.5),
              inset 0 0 30px rgba(255, 216, 107, 0.2) !important;
  border-radius: 12px;
  display: block;
}
body[data-theme="elite"] .ranking-top-up-wrapper::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  border-radius: 12px;
  padding: 2.5px; /* Thicker border for more glow */
  background: linear-gradient(185deg, #A45CFF 15%, #FFD86B 40%, #F2EFFA 60%, #A45CFF 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
  z-index: 10;
}
/* Header: transparent so the space bg shows through, + podium clipart + glow divider */
body[data-theme="elite"] .ranking-top-up-header-container {
  background: transparent !important;
  border-bottom: 1px solid rgba(164, 92, 255, 0.35); /* Glow Purple */
  box-shadow: 0 3px 16px -6px rgba(164, 92, 255, 0.45);
}
body[data-theme="elite"] .ranking-top-up-header-container::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 16px;
  width: 132px;
  height: 132px;
  background: url("../../assets/orbit-elit/leaderboard/leaderboard-clipart-1.png") center / contain no-repeat;
  z-index: 2;
  pointer-events: none;
}
/* Leaderboard Pill Tabs — Elite Theme */
body[data-theme="elite"] .ranking-top-tab-navigation {
  background: rgba(26, 6, 80, 0.85) !important;
  border: 1px solid rgba(164, 92, 255, 0.55) !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.5), 0 2px 8px rgba(0, 0, 0, 0.35) !important;
}
body[data-theme="elite"] .ranking-top-tab {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: "PlusJakartaSans", sans-serif !important;
  font-weight: 700 !important;
}
body[data-theme="elite"] .ranking-top-tab:hover {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="elite"] .ranking-top-tab.active {
  background: linear-gradient(135deg, #9A7BDD, #8A6CCF) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-family: "PlusJakartaSans-Bold", sans-serif !important;
  font-weight: 800 !important;
  box-shadow: 0 1px 6px rgba(154, 123, 221, 0.45) !important;
}
/* Hide clipart medal when AUM tab is active */
body[data-theme="elite"] .ranking-top-up-wrapper.tab-aum-active .ranking-top-up-header-container::before {
  display: none !important;
}
/* Header in Elite Theme when AUM tab is active */
body[data-theme="elite"] .ranking-top-up-wrapper.tab-aum-active .ranking-top-up-header-container {
  background: transparent !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(164, 92, 255, 0.45) !important;
}
/* AUM Hall of Fame in Elite Theme (PurpleGalaxyTheme) */
body[data-theme="elite"] .ranking-aum-subtitle {
  color: #E1DAFC !important;
}
body[data-theme="elite"] .ranking-aum-title {
  color: #F7EEFF !important;
}
body[data-theme="elite"] .ranking-aum-divider {
  background: #B442F6 !important;
  box-shadow: 0 0 10px rgba(180, 66, 246, 0.7) !important;
}
body[data-theme="elite"] .aum-body-container {
  background-color: transparent !important;
}
body[data-theme="elite"] .aum-tier-card {
  background: rgba(34, 14, 80, 0.55) !important;
  border: 1px solid rgba(164, 92, 255, 0.7) !important;
  box-shadow: 0 0 6px rgba(164, 92, 255, 0.35) !important;
}
body[data-theme="elite"] .aum-tier-badge {
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
  border-right: 1px solid rgba(164, 92, 255, 0.35) !important;
}
/* Tier accents for Elite (ORBIT_AUM_TIER_ACCENTS) */
body[data-theme="elite"] .aum-tier-card.tier-black .aum-tier-badge {
  border-left-color: #FCD570 !important;
}
body[data-theme="elite"] .aum-tier-card.tier-galaxy .aum-tier-badge {
  border-left-color: #E6EAF0 !important;
}
body[data-theme="elite"] .aum-tier-card.tier-elite .aum-tier-badge {
  border-left-color: #B84AFB !important;
}
body[data-theme="elite"] .aum-tier-card.tier-prime .aum-tier-badge {
  border-left-color: #29F05F !important;
}
body[data-theme="elite"] .aum-tier-card.tier-one .aum-tier-badge {
  border-left-color: #02CFFA !important;
}
/* Top-left inner glow on tier badge, tinted by tier accent */
body[data-theme="elite"] .aum-tier-card.tier-black {
  --aum-accent-rgb: 252, 213, 112;
}
body[data-theme="elite"] .aum-tier-card.tier-galaxy {
  --aum-accent-rgb: 230, 234, 240;
}
body[data-theme="elite"] .aum-tier-card.tier-elite {
  --aum-accent-rgb: 184, 74, 251;
}
body[data-theme="elite"] .aum-tier-card.tier-prime {
  --aum-accent-rgb: 41, 240, 95;
}
body[data-theme="elite"] .aum-tier-card.tier-one {
  --aum-accent-rgb: 2, 207, 250;
}
body[data-theme="elite"] .aum-tier-badge {
  background:
    radial-gradient(circle at 0% 0%, rgba(var(--aum-accent-rgb, 255, 255, 255), 0.12) 0%, rgba(var(--aum-accent-rgb, 255, 255, 255), 0) 55%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.09) 0%, rgba(255, 255, 255, 0.02) 100%) !important;
  box-shadow: inset 4px 4px 10px -8px rgba(var(--aum-accent-rgb, 255, 255, 255), 0.35) !important;
}
body[data-theme="elite"] .aum-tier-label {
  color: #F5F4F9 !important;
  -webkit-text-fill-color: #F5F4F9 !important;
}
body[data-theme="elite"] .aum-tier-name {
  color: #F5F4F9 !important;
  -webkit-text-fill-color: #F5F4F9 !important;
}
body[data-theme="elite"] .aum-rank-row:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
/* Divider colors (|) */
body[data-theme="elite"] .aum-rank-sep.rank-sep-1 {
  color: #FAE4AB !important;
}
body[data-theme="elite"] .aum-rank-sep.rank-sep-2 {
  color: #E8E2FF !important;
}
body[data-theme="elite"] .aum-rank-sep.rank-sep-3 {
  color: #F2CF95 !important;
}
/* Name colors */
body[data-theme="elite"] .aum-rank-username.rank-1-text {
  color: #F8D74E !important;
  font-weight: 800;
}
body[data-theme="elite"] .aum-rank-username.rank-2-text {
  color: #D8D5EA !important;
  font-weight: 700;
}
body[data-theme="elite"] .aum-rank-username.rank-3-text {
  color: #F5B342 !important;
  font-weight: 700;
}
/* AUM wallpaper when AUM tab is active */
body[data-theme="elite"] .ranking-top-up.tab-aum-active,
body[data-theme="elite"] .ranking-top-up:has(.tab-aum-active) {
  background: url("../../assets/orbit-elit/aum-wp.png") center top / cover no-repeat,
              #0a0715 !important;
}
/* Footer divider, text, and link */
body[data-theme="elite"] .aum-footer-notes {
  border-top: 1px solid rgba(164, 92, 255, 0.25) !important;
}
body[data-theme="elite"] .aum-footer-notes p,
body[data-theme="elite"] .aum-footer-note-text {
  color: #B9B2D6 !important;
  opacity: 1 !important;
}
body[data-theme="elite"] .aum-footer-notes a,
body[data-theme="elite"] .aum-footer-link {
  color: #BB6AF3 !important;
}
/* Monthly Leaderboard name colors in Elite theme */
body[data-theme="elite"] .table-rank-pop-up .text-shine-gold,
body[data-theme="elite"] .table-rank-pop-up span[style*="fdc846"],
body[data-theme="elite"] .table-rank-pop-up span[style*="253, 200, 70"] {
  color: #F8D74E !important;
  -webkit-text-fill-color: #F8D74E !important;
}
body[data-theme="elite"] .table-rank-pop-up .text-shine-silver,
body[data-theme="elite"] .table-rank-pop-up span[style*="737279"],
body[data-theme="elite"] .table-rank-pop-up span[style*="115, 114, 121"] {
  color: #D8D5EA !important;
  -webkit-text-fill-color: #D8D5EA !important;
}
body[data-theme="elite"] .table-rank-pop-up .text-shine-bronze,
body[data-theme="elite"] .table-rank-pop-up span[style*="bd890b"],
body[data-theme="elite"] .table-rank-pop-up span[style*="189, 137, 11"] {
  color: #F5B342 !important;
  -webkit-text-fill-color: #F5B342 !important;
}
/* Header title. "MOON" (the <p>'s own text) = 30deg downward gradient white -> Glow Purple.
   Child spans reset their own fill so only "MOON" shows the gradient. */
body[data-theme="elite"] .ranking-top-up-header-title {
  background: linear-gradient(150deg, #ffffff 0%, #a45cff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent !important;
}
/* "BOT" -> Text Primary */
body[data-theme="elite"] .ranking-top-up-header-title span[style*="#fff"],
body[data-theme="elite"] .ranking-top-up-header-title span[style*="255, 255, 255"] {
  -webkit-text-fill-color: #f2effa;
  color: #f2effa !important;
}
/* "TOP 20" -> Gold Accent */
body[data-theme="elite"] .ranking-top-up-header-title span[style*="fdc846"],
body[data-theme="elite"] .ranking-top-up-header-title span[style*="253, 200, 70"] {
  -webkit-text-fill-color: #ffd86b;
  color: #ffd86b !important;
}
/* Body panel (inline background-color:white) -> transparent so the bg shows */
body[data-theme="elite"] .ranking-top-up div[style*="background-color: white"] {
  background-color: transparent !important;
}
/* Table -> Card/Table BG @10% + shiny purple border, rounded 5px, margin-top 10px */
body[data-theme="elite"] .table-rank-pop-up {
  background-color: rgba(27, 24, 43, 0.70) !important; /* Card/Table BG @10% */
  border: 1px solid rgba(164, 92, 255, 0.55) !important; /* Glow Purple */
  border-radius: 5px !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  overflow: hidden !important;
  margin-top: 10px !important;
  box-shadow: 0 0 14px rgba(164, 92, 255, 0.30),
              inset 0 0 12px rgba(164, 92, 255, 0.10); /* shiny */
}
body[data-theme="elite"] .th-rank-pop-up {
  color: #f2effa !important; /* Text Primary */
  border-bottom: 1px solid rgba(143, 109, 215, 0.35) !important;
}
body[data-theme="elite"] .td-rank-pop-up {
  color: #f2effa !important; /* Text Primary */
}
/* Subtle row separators (Border Purple @ low alpha) */
body[data-theme="elite"] .table-rank-pop-up tbody tr td {
  border-bottom: 1px solid rgba(143, 109, 215, 0.2) !important;
}
body[data-theme="elite"] .table-rank-pop-up tbody tr:last-child td {
  border-bottom: none !important;
}
/* "Trailing Profit :" label -> Text Primary */
body[data-theme="elite"] .ranking-top-up td.ps-1 {
  color: #f2effa !important;
}
/* Footnotes + empty-state -> Text Secondary */
body[data-theme="elite"] .ranking-top-up li,
body[data-theme="elite"] .ranking-top-up tbody p,
body[data-theme="elite"] .ranking-top-up .bi-ban {
  color: #96929d !important; /* Text Secondary */
}
/* Close button visible on dark and styled for elite */
body[data-theme="elite"] .button-close-banner {
  /* Gradient ring: Glow Purple -> Text Primary -> Glow Purple (top to bottom).
     Inner fill (Base BG) via padding-box, gradient shows only in the border area. */
  border: 2px solid transparent !important;
  background:
    linear-gradient(#0a0715, #0a0715) padding-box,
    linear-gradient(180deg, #a45cff 0%, #f2effa 50%, #a45cff 100%) border-box !important;
  box-shadow: 0 0 14px rgba(164, 92, 255, 0.7),
              inset 0 0 8px rgba(164, 92, 255, 0.3); /* shiny */
  right: 25px !important;
  top: 25px !important;
  width: 34px !important;
  height: 34px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 50% !important;
}
body[data-theme="elite"] .button-close-banner .btn-close {
  /* X icon rendered in Text Primary via mask (exact color, not filter approximation) */
  filter: none !important;
  opacity: 1 !important; /* Remove bootstrap's default 0.5 opacity */
  background-image: none !important;
  background-color: #f2effa !important; /* Text Primary */
  -webkit-mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center / 14px 14px no-repeat;
  mask: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414z'/%3e%3c/svg%3e") center / 14px 14px no-repeat;
  width: 14px;
  height: 14px;
  border: none;
  padding: 0;
  margin: 0;
  float: none !important;
}
/* Rank medals 1/2/3 (emoji spans in the rank cell) -> themed images.
   Match both hex and rgb() serializations of the inline colors. */
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="fdc846"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="253, 200, 70"] {
  content: url("../../assets/orbit-elit/leaderboard/rank-1.png");
}
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="737279"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="115, 114, 121"] {
  content: url("../../assets/orbit-elit/leaderboard/rank-2.png");
}
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="bd890b"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="189, 137, 11"] {
  content: url("../../assets/orbit-elit/leaderboard/rank-3.png");
}
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="fdc846"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="253, 200, 70"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="737279"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="115, 114, 121"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="bd890b"],
body[data-theme="elite"] .td-rank-pop-up.d-flex span[style*="189, 137, 11"] {
  width: auto !important;
  height: 26px !important;
  vertical-align: middle;
}
/* Trailing shields -> themed shields (mapped by COLOR to keep green=ON / red=OFF).
   trail-off.png = green, trail-on.png = red. */
body[data-theme="elite"] .ranking-top-up img[src*="security-shield.png"] {
  content: url("../../assets/orbit-elit/leaderboard/trail-off.png");
}
body[data-theme="elite"] .ranking-top-up img[src*="security-shield-red"] {
  content: url("../../assets/orbit-elit/leaderboard/trail-on.png");
}
body[data-theme="elite"] .ranking-top-up img[src*="security-shield"] {
  width: auto !important;
  height: 22px !important;
}
/* =========================================================================
   PROFIT SUMMARY — card atas selebar card list; tabel menyatu dengan card
   (desain mengikuti tabel credit info); kolom profit hijau tema
   ========================================================================= */
/* Card "Profit Summary List": samakan dengan card "All Time Profit" di atas
   (inset 15px kiri-kanan, radius penuh) */
body[data-theme="elite"]  #user-profit-summary .card.card-style {
    margin: 0 !important;
    border-radius: 0px !important;
    border: none !important;
    box-shadow: none !important;
}
/* Tabel di dalam card list: full selebar card, tanpa border/box sendiri */
body[data-theme="elite"]  #user-profit-summary .card .content {
    background-color: transparent !important;
    border: none !important;
    border-radius: 0px !important;
    box-shadow: none !important;
    margin: 0 !important;
}
/* Nilai profit positif (inline #36b693) -> hijau tema; match hex & rgb */
body[data-theme="elite"] #user-profit-summary h5[style*="#36b693"],
body[data-theme="elite"] #user-profit-summary h5[style*="54, 182, 147"] {
    color: var(--th-green, #4EBA5D) !important;
}
/* =========================================================================
   DATEPICKER (bootstrap-datepicker) — dipakai di modal Select Date
   (asset / bonus / profit / profit-summary / roi). Default: hover #eee,
   active biru #006dcc -> ganti ke ungu/aksen tema.
   ========================================================================= */
/* Judul "Select Date" (inline color abu #545454) & teks switch/arrow */
body[data-theme="elite"] .modal .datepicker .datepicker-switch,
body[data-theme="elite"] .modal .datepicker .prev,
body[data-theme="elite"] .modal .datepicker .next,
body[data-theme="elite"] .modal .datepicker .dow,
body[data-theme="elite"] .modal .datepicker table tr td,
body[data-theme="elite"] .modal .datepicker table tr td span {
    color: var(--th-text, #E3E0EC) !important;
}
body[data-theme="elite"] .modal-header h2[style*="color: rgb(84, 84, 84)"],
body[data-theme="elite"] .modal-header h2[style*="color:#545454"] {
    color: var(--th-text, #E3E0EC) !important;
}
/* Tanggal bulan lain / disabled -> muted */
body[data-theme="elite"] .modal .datepicker table tr td.old,
body[data-theme="elite"] .modal .datepicker table tr td.new,
body[data-theme="elite"] .modal .datepicker table tr td span.old,
body[data-theme="elite"] .modal .datepicker table tr td span.new,
body[data-theme="elite"] .modal .datepicker table tr td.disabled,
body[data-theme="elite"] .modal .datepicker table tr td span.disabled {
    color: var(--th-text-hint, #6E6593) !important;
}
/* Hover / focused (default #eee) -> ungu tema jelas terlihat */
body[data-theme="elite"] .modal .datepicker table tr td.day:hover,
body[data-theme="elite"] .modal .datepicker table tr td.day.focused,
body[data-theme="elite"] .modal .datepicker table tr td span:hover,
body[data-theme="elite"] .modal .datepicker table tr td span.focused,
body[data-theme="elite"] .modal .datepicker .datepicker-switch:hover,
body[data-theme="elite"] .modal .datepicker .prev:hover,
body[data-theme="elite"] .modal .datepicker .next:hover,
body[data-theme="elite"] .modal .datepicker tfoot tr th:hover {
    background: rgba(146, 75, 225, 0.55) !important;
    background-image: none !important;
    color: #ffffff !important;
    border-radius: 6px !important;
}
/* Cell terpilih (active) -> aksen gradient tema penuh */
body[data-theme="elite"] .modal .datepicker table tr td.active,
body[data-theme="elite"] .modal .datepicker table tr td.active:hover,
body[data-theme="elite"] .modal .datepicker table tr td.active.active,
body[data-theme="elite"] .modal .datepicker table tr td span.active,
body[data-theme="elite"] .modal .datepicker table tr td span.active:hover {
    background: var(--th-accent-grad, #924be1) !important;
    background-image: var(--th-accent-grad, none) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 6px !important;
    box-shadow: var(--th-btn-primary-shadow, 0 0 10px var(--th-shadow)) !important;
    text-shadow: none !important;
}
/* Toggle Month/Year: aktif -> aksen tema (default #ad85f3) */
body[data-theme="elite"] .asset-filter-date .col-form-label.active,
body[data-theme="elite"] .profit-filter-date .col-form-label.active,
body[data-theme="elite"] .profit-summary-filter-date .col-form-label.active,
body[data-theme="elite"] .history-credit-filter-date .col-form-label.active {
    background: var(--th-accent-grad, #924be1) !important;
    border: 1px solid var(--th-border-solid, #5B269A) !important;
    color: #ffffff !important;
    box-shadow: var(--th-btn-primary-shadow, 0 0 10px var(--th-shadow)) !important;
}
/* Toggle non-aktif -> border/teks tema */
body[data-theme="elite"] .asset-filter-date .col-form-label,
body[data-theme="elite"] .profit-filter-date .col-form-label,
body[data-theme="elite"] .profit-summary-filter-date .col-form-label,
body[data-theme="elite"] .history-credit-filter-date .col-form-label {
    color: var(--th-text-muted, #9897A2) !important;
    border: 1px solid var(--th-border, rgba(163, 84, 230, 0.35)) !important;
}
/* =========================================
   ROI LOADER DYNAMIC THEME
   ========================================= */
body[data-theme="elite"] #roiLoader {
  background: rgba(0, 0, 0, 0.9) !important;
}
body[data-theme="elite"] #roiLoader {
  background: rgba(1, 0, 14, 0.9) !important; /* Match elite bg */
}
body[data-theme="elite"] #roiLoader .spinner-border-custom {
  color: var(--th-accent) !important;
}
body[data-theme="elite"] #roiLoader .color-purple {
  color: var(--th-text) !important;
}
body[data-theme="elite"] .roi-powered-by {
  background-color: var(--th-surface-deep, var(--th-surface, var(--th-bg))) !important;
}
/* =========================================
   ROI BACKGROUND & LOGO DYNAMIC THEME
   ========================================= */
body[data-theme="elite"] #capture {
  background-image: url("../../assets/orbit-elit/bg-pg-roi.png") !important;
}
body[data-theme="elite"] .roi-card-logo {
  content: url("../../assets/orbit-elit/moonbot-roi-icon.png");
  filter: drop-shadow(0 0 8px rgba(164, 92, 255, 0.65)) drop-shadow(0 0 16px rgba(199, 125, 255, 0.35)) !important;
}
body[data-theme="elite"] #capture h1 {
  color: #F2EFFA !important;
  text-shadow: 0 0 10px #A45CFF, 0 0 4px #7A22CC !important;
}
/* =========================================
   ROI CARDS — elegant purple glow style
   ========================================= */
body[data-theme="elite"] #capture .card-roi-bg {
  background: linear-gradient(180deg, #C77DFF 0%, #A45CFF 50%, #5A22CC 100%) !important;
  border-radius: 14px !important;
  padding: 1px !important;
  box-shadow: 0 0 12px rgba(164, 92, 255, 0.55),
              0 0 24px rgba(122, 34, 204, 0.3) !important;
}
body[data-theme="elite"] #capture .card-content {
  background: rgba(13, 10, 24, 0.94) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 0 14px rgba(164, 92, 255, 0.18) !important;
}
/* Sel bulan/tahun: border ungu glow + isi gelap transparan */
body[data-theme="elite"] #capture .card-content [style*="linear-gradient(0deg, #c8e3fa"],
body[data-theme="elite"] #capture .card-content [style*="linear-gradient(0deg, rgb(200, 227, 250)"] {
  background: linear-gradient(180deg, rgba(199, 125, 255, 0.75), rgba(164, 92, 255, 0.4)) !important;
  padding: 1px !important;
  box-shadow: 0 0 6px rgba(164, 92, 255, 0.35) !important;
}
body[data-theme="elite"] #capture .card-content [style*="background: #2b0099"],
body[data-theme="elite"] #capture .card-content [style*="background: rgb(43, 0, 153)"] {
  background: rgba(14, 11, 26, 0.95) !important;
}
/* Label bulan/tahun -> ungu terang bercahaya, dengan garis pemisah tipis ke
   nilainya di bawah. Polanya menyalin tema black (black:2688): begitu
   background kotak label dibuat transparan, label dan nilainya menempel jadi
   satu blok tanpa batas — garis inilah yang mengembalikan pemisahnya.
   Warnanya diambil dari aksen tema ini (#C77DFF), bukan emas.
   `margin` kiri-kanan 6px supaya garisnya tidak menyentuh bingkai gradient
   sel; `border-radius: 0` karena inline-nya `2px` — sisa dari saat label masih
   berbentuk kotak berwarna. */
body[data-theme="elite"] #capture .card-content [style*="background: #270186"],
body[data-theme="elite"] #capture .card-content [style*="background: rgb(39, 1, 134)"] {
  background: transparent !important;
  color: #C77DFF !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(199, 125, 255, 0.45) !important;
  padding-bottom: 3px !important;
  margin: 0 6px 4px 6px !important;
}
/* Badge tahun "ALL" */
body[data-theme="elite"] #capture .card-content [style*="border: 2px solid rgb(156, 99, 216)"] {
  border-color: #C77DFF !important;
  box-shadow: 0 0 8px rgba(164, 92, 255, 0.6),
              inset 0 0 4px rgba(164, 92, 255, 0.3) !important;
}
/* Angka ROI besar: glow ungu bercahaya */
body[data-theme="elite"] #capture .card-content [style*="text-shadow"] {
  text-shadow: 0 0 10px #A45CFF, 0 0 4px #7A22CC !important;
}
/* =========================================
   HEADER MOONBOT LOGO DYNAMIC THEME
   ========================================= */
/* =========================================
   MOON LOGIC DROPDOWNS DYNAMIC THEME
   ========================================= */
body[data-theme="elite"] .custom-ta .myselect.form-custom {
  border-color: var(--th-accent) !important;
  background-color: transparent !important;
  margin-top: -2px !important;
}
body[data-theme="elite"] .custom-ta .myselect.form-custom select {
  color: var(--th-text) !important;
  border: none !important;
  background-color: transparent !important;
  padding-top: 2px !important;
  padding-bottom: 0px !important;
  /* Cegah nilai panjang (mis. "Fibonacci Retracement") wrap/melebihi box */
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
/* Chevron .form-select versi terang untuk tema gelap
   (SVG bootstrap asli stroke #343a40 terlalu gelap) */
body[data-theme="elite"] select.form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23cfc9dd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
}
/* Teks tombol select ikut alignment kelasnya (option-nya sudah diatur style.min.css) */
body[data-theme="elite"] select.form-select-center {
  text-align: center !important;
}
body[data-theme="elite"] select.form-select-right {
  text-align: right !important;
}
/* Popup native <select> ikut gelap (color-scheme mempengaruhi render OS/browser;
   warna option dihormati Chrome/Firefox desktop, diabaikan iOS) */
body[data-theme="elite"] select {
  color-scheme: dark;
}
body[data-theme="elite"] select option,
body[data-theme="elite"] .custom-ta .form-select option {
  background-color: #0f0a21 !important;
  color: #f2effa !important;
}
/* Chromium 135+: popup select bisa distyle penuh (background, border, glow).
   Browser lain mengabaikan blok ini dan memakai fallback color-scheme di atas.
   Mencakup .form-select (form biasa) dan .swal2-select (popup SweetAlert,
   mis. Choose Language). */
body[data-theme="elite"] select.form-select,
body[data-theme="elite"] select.swal2-select {
  appearance: base-select;
}
body[data-theme="elite"] select.form-select::picker(select),
body[data-theme="elite"] select.swal2-select::picker(select) {
  appearance: base-select;
  background-color: #0f0a21;
  color: #f2effa;
  border: 1px solid rgba(146, 75, 225, 0.4);
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2);
  padding: 8px 0;
}
/* Panah bawaan base-select tidak perlu: chevron sudah digambar .form-select */
body[data-theme="elite"] select.form-select::picker-icon {
  display: none;
}
body[data-theme="elite"] select.form-select option,
body[data-theme="elite"] select.swal2-select option {
  padding: 6px 12px;
}
body[data-theme="elite"] select.form-select option:hover,
body[data-theme="elite"] select.form-select option:focus,
body[data-theme="elite"] select.swal2-select option:hover,
body[data-theme="elite"] select.swal2-select option:focus {
  background-color: rgba(146, 75, 225, 0.25) !important;
}
/* =========================================
   GLOWING COMPONENTS (FOOTER & CARDS)
   ========================================= */
body[data-theme="elite"] #moon-logic-card-theme,
body[data-theme="elite"] #strategy-mode-card-theme,
body[data-theme="elite"] #ta-card-theme,
body[data-theme="elite"] #batch-ta-card-theme,
body[data-theme="elite"] #grouping-container,
body[data-theme="elite"] #money-management-card-theme {
  background-color: rgba(10, 13, 24, 0.9) !important;
  border: 1px solid hsl(252 37% 37% / 1) !important;
  box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
body[data-theme="elite"] #money-management-card-theme .form-check[style*="border"] {
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] #money-management-card-theme div[style*="color: rgb(0, 0, 0)"],
body[data-theme="elite"] #money-management-card-theme div[style*="color: #000"] {
  color: #ffffff !important;
}
body[data-theme="elite"] #moon-logic-card-theme p,
body[data-theme="elite"] #moon-logic-card-theme span {
  color: #ffffff !important;
}
body[data-theme="elite"] .switch-green .ios-input:checked ~ .custom-control-label::before {
  background-color: var(--th-accent) !important;
}
body[data-theme="elite"] #footer-bar.footer-bar-1 {
  box-shadow: 0 0 15px var(--th-accent) !important;
  border: 1px solid var(--th-accent) !important;
}
body[data-theme="elite"] #footer-bar.footer-bar-1 .footer-divider {
  background-color: var(--th-accent) !important;
  opacity: 0.6 !important;
}
/* =========================================
   THEME HEADERS (Moon Logic dll)
   ========================================= */
body[data-theme="elite"] .top-header.sticky.theme-header {
  background: url("../../assets/orbit-elit/bg-pg-api-2.png") center/cover no-repeat !important;
  background-color: transparent !important;
}
/* =========================================
   MENU ICONS GRADIENT
   ========================================= */
body[data-theme="elite"] #home-dropdown-list i {
  background: linear-gradient(180deg, #ffffff 0%, #2A7B9B 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* =========================================
   SELECT2 & SWAL THEME OVERRIDES (ELITE)
   ========================================= */
body[data-theme="elite"] .theme-swal-popup {
  background-color: #141225 !important; /* Modal BG */
  color: #f2effa !important; /* Text Primary */
  border: 1px solid rgba(164, 92, 255, 0.3) !important;
  border-radius: 12px;
}
body[data-theme="elite"] .theme-swal-popup .swal2-title {
  color: #ffffff !important; /* White */
}
body[data-theme="elite"] .select2-container--default.select2-container--open .select2-selection--single,
body[data-theme="elite"] .select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
body[data-theme="elite"] .select2-container--default.select2-container--open.select2-container--above .select2-selection--single {
  border: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-top: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-bottom: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-left: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-right: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-radius: 8px !important;
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
}
body[data-theme="elite"] .select2-dropdown,
body[data-theme="elite"] .select2-dropdown.select2-dropdown--below,
body[data-theme="elite"] .select2-dropdown.select2-dropdown--above,
body[data-theme="elite"] .select2-container--open .select2-dropdown,
body[data-theme="elite"] .select2-container--open .select2-dropdown--below,
body[data-theme="elite"] .select2-container--open .select2-dropdown--above {
  background-color: #1b182b !important; /* Card/Table BG */
  border: 1px solid rgba(164, 92, 255, 0.5) !important; /* Glow Purple */
  border-top: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-bottom: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-left: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-right: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-radius: 8px !important;
  border-top-left-radius: 8px !important;
  border-top-right-radius: 8px !important;
  border-bottom-left-radius: 8px !important;
  border-bottom-right-radius: 8px !important;
  margin-top: 6px !important;
  overflow: hidden !important;
}
body[data-theme="elite"] .select2-dropdown.select2-dropdown--above,
body[data-theme="elite"] .select2-container--open .select2-dropdown--above {
  margin-top: -6px !important;
}
body[data-theme="elite"] .select2-container--default .select2-results__option {
  color: #f2effa !important; /* Text Primary */
  background-color: transparent !important;
  padding: 10px 15px !important;
  border-bottom: 1px solid rgba(164, 92, 255, 0.15) !important;
}
body[data-theme="elite"] .select2-container--default .select2-results__option:last-child {
  border-bottom: none !important;
}
body[data-theme="elite"] .select2-container--default .select2-results__option--highlighted[aria-selected],
body[data-theme="elite"] .select2-container--default .select2-results__option--highlighted[aria-selected="true"] {
  background-color: rgba(164, 92, 255, 0.3) !important; /* Glow Purple transparent */
  color: #ffffff !important; /* White */
}
body[data-theme="elite"] .select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: rgba(164, 92, 255, 0.1) !important;
}
/* Custom Modals (e.g., Jenis Entri) */
body[data-theme="elite"] .buy-modal-content {
  background-color: #1b182b !important;
  border: 1px solid rgba(164, 92, 255, 0.3) !important;
  box-shadow: 0 0 15px rgba(164, 92, 255, 0.2) !important;
  border-radius: 12px !important;
}
body[data-theme="elite"] .buy-modal-content .color-theme {
  color: #ffffff !important;
}
/* List group options in modal */
body[data-theme="elite"] .list-group-item.list-cycle,
body[data-theme="elite"] .list-group-item.list-partial,
body[data-theme="elite"] .list-group-item.list-active {
  background-color: transparent !important;
  color: #f2effa !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}
body[data-theme="elite"] .list-group-item.list-cycle.active,
body[data-theme="elite"] .list-group-item.list-partial.active,
body[data-theme="elite"] .list-group-item.list-active.active {
  background-color: rgba(164, 92, 255, 0.3) !important; /* Glow Purple transparent */
  color: #ffffff !important;
  border-color: rgba(164, 92, 255, 0.5) !important;
}
body[data-theme="elite"] .select2-container--default .select2-results__option[aria-disabled="true"] {
  color: #96929d !important; /* Text Secondary */
  opacity: 0.5;
}
/* Style the selection box itself */
body[data-theme="elite"] .select2-container--default .select2-selection--single {
  background-color: #0a0715 !important; /* Base BG */
  border: 1px solid rgba(164, 92, 255, 0.5) !important;
  border-radius: 8px;
}
body[data-theme="elite"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #f2effa !important;
}
/* =========================================================================
   ASSET / CREDIT PAGE THEMING (Elite, Galaxy, Black)
   ========================================================================= */
/* 1. Stacking context for video background */
body[data-theme="elite"] #asset-page .theme-light {
  position: relative;
  z-index: 0;
}
body[data-theme="elite"] #asset-page #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
body[data-theme="elite"] #asset-page moonbot-bg {
  display: none !important;
}
/* 2. Header transparency on scroll (matches coin-details-header) */
body[data-theme="elite"] #asset-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* 3. Transparent cards for Elite theme */
body[data-theme="elite"] #user-asset > .content {
  background-color: rgba(27, 24, 43, 0.80) !important;
  border: none !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
  backdrop-filter: blur(2px);
}
body[data-theme="elite"] #asset-page .pt-2 > .card.card-style.bg-white,
body[data-theme="elite"] #asset-page .pt-2 > .card.card-style,
body[data-theme="elite"] #asset-page .card.card-style.bg-white {
  min-height: calc(100vh - 240px) !important;
  background-color: rgba(10, 13, 24, 0.9) !important;
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  border-radius: 12px 12px 0 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom: none !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
  margin: 0 !important;
  padding-bottom: 90px !important;
}
/* 4b. Hide dividers that look like ugly borders */
body[data-theme="elite"] #asset-page .divider {
  display: none !important;
}
/* 5. Override inline white backgrounds in history lists */
body[data-theme="elite"] #asset-page [style*="background-color: rgb(255, 255, 255)"]:not(.month-summary-separator),
body[data-theme="elite"] #asset-page [style*="background-color: white"]:not(.month-summary-separator),
body[data-theme="elite"] #asset-page [style*="background-color:#fff"]:not(.month-summary-separator),
body[data-theme="elite"] #asset-page [style*="background-color: #fff"]:not(.month-summary-separator) {
  background-color: rgba(27, 24, 43, 0.8) !important; /* Card/Table BG @80% */
}
/* 6. History List text colors for Elite */
body[data-theme="elite"] #asset-page .color-black,
body[data-theme="elite"] #asset-page a[style*="color: black"],
body[data-theme="elite"] #asset-page h5[style*="color: rgb(134, 135, 138)"],
body[data-theme="elite"] #asset-page p[style*="color: rgb(134, 135, 138)"],
body[data-theme="elite"] #asset-page .font-500[style*="color: black"] {
  color: #F2EFFA !important;
}
/* 8. Fix icon gradients in header */
body[data-theme="elite"] #asset-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* 9. Filter dropdown: dark bg + thin purple border + subtle glow */
body[data-theme="elite"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] {
  background-color: #0f0a21 !important;
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] .dropdown-item {
  color: #f2effa !important;
}
body[data-theme="elite"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] .dropdown-item:hover,
body[data-theme="elite"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] .dropdown-item.active {
  background-color: rgba(146, 75, 225, 0.25) !important;
}
/* =========================================================================
   PROFIT (#profit-page) & STRATEGY (#strategy-page) — video bg + theme
   (mirror coin detail / asset; non-default themes only)
   ========================================================================= */
/* Video background: child of the offcanvas -> covers the panel viewport */
body[data-theme="elite"] #profit-page #elite-bg-video,
body[data-theme="elite"] #strategy-page #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Hide moonbot-bg backdrop */
body[data-theme="elite"] #profit-page moonbot-bg,
body[data-theme="elite"] #strategy-page moonbot-bg {
  display: none !important;
}
/* Header when scrolled: no image, 80% dark */
body[data-theme="elite"] #tab-user-profit.header-scrolled,
body[data-theme="elite"] #strategy-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="elite"] #tab-user-profit .bi,
body[data-theme="elite"] #strategy-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards -> Card/Table BG @80% */
body[data-theme="elite"] #profit-page .card.card-style,
body[data-theme="elite"] #strategy-page .card.card-style {
  background-color: rgba(10, 13, 24, 0.9) !important;
  border: 1px solid hsl(252 37% 37% / 1) !important;
  box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* Profit list card: diperpanjang langsung sampai bawah layar tanpa border melengkung di bawah */
body[data-theme="elite"] #profit-page .pt-1.mt-2 > .card.card-style,
body[data-theme="elite"] #profit-page #user-profit .pt-1.mt-2 > .card.card-style,
body[data-theme="elite"] #profit-page .card.card-style {
  min-height: calc(100vh - 240px) !important;
  border-radius: 12px 12px 0 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom: none !important;
  margin: 0 !important;
  padding-bottom: 90px !important;
}

body[data-theme="elite"] #profit-page .pt-1.mt-2 > .card.card-style > .content,
body[data-theme="elite"] #profit-page .card.card-style > .content {
  margin: 0 8px 8px 8px !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
body[data-theme="elite"] #profit-page .pt-1.mt-2 > .card.card-style > .d-flex,
body[data-theme="elite"] #profit-page .card.card-style > .d-flex {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
body[data-theme="elite"] #profit-page .pt-1.mt-2 > .card.card-style > .d-flex > a.font-500,
body[data-theme="elite"] #profit-page .card.card-style > .d-flex > a.font-500 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body[data-theme="elite"] #profit-page .pt-1.mt-2 > .card.card-style > .d-flex > .filter-box,
body[data-theme="elite"] #profit-page .card.card-style > .d-flex > .filter-box {
  margin-right: 0 !important;
}
body[data-theme="elite"] #user-profit .card.card-style > .content,
body[data-theme="elite"] #user-profit-summary .card.card-style > .content {
  margin: 0 !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Kartu ber-ID di halaman strategi: ikut standar GLOBAL CARD BACKGROUND
   (selector 2-ID di sini menang atas rule global berbasis class) */
body[data-theme="elite"] #strategy-page #strategy-mode-card-theme,
body[data-theme="elite"] #strategy-page #grouping-container,
body[data-theme="elite"] #strategy-page #money-management-card-theme {
  background-color: rgba(10, 13, 24, 0.9) !important;
  border: 1px solid hsl(252 37% 37% / 1) !important;
  box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* TA card on strategy page: thin purple border, subtle glow (match #coin-setting) */
body[data-theme="elite"] #strategy-page #strategy-ta-card-theme {
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
/* Inline white backgrounds -> Card/Table BG @80% */
body[data-theme="elite"] #profit-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #profit-page [style*="background-color: white"],
body[data-theme="elite"] #profit-page [style*="background-color: #fff"],
body[data-theme="elite"] #strategy-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #strategy-page [style*="background-color: white"],
body[data-theme="elite"] #strategy-page [style*="background-color: #fff"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
}
/* Text colors -> light */
body[data-theme="elite"] #profit-page .color-black,
body[data-theme="elite"] #profit-page a[style*="color: black"],
body[data-theme="elite"] #profit-page h5[style*="color: rgb(134, 135, 138)"],
body[data-theme="elite"] #profit-page p[style*="color: rgb(134, 135, 138)"],
body[data-theme="elite"] #strategy-page .color-black,
body[data-theme="elite"] #strategy-page a[style*="color: black"] {
  color: #f2effa !important;
}
/* =========================================================================
   ROI SETTING + MOON LOGIC + FEE (CASHBACK/BNB) — video bg + theme
   ========================================================================= */
/* Video background (child of the offcanvas) */
body[data-theme="elite"] #roi-setting #elite-bg-video,
body[data-theme="elite"] #formula-moon-logic #elite-bg-video,
body[data-theme="elite"] #fee-setting-information-page #elite-bg-video,
body[data-theme="elite"] #fee-setting-buy-bnb-page #elite-bg-video,
body[data-theme="elite"] #info-profit #elite-bg-video,
body[data-theme="elite"] #asset-credit-info-page #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header drawer Rincian (info-profit & credit info): transparan di awal
   (video terlihat penuh), semi-gelap hanya saat di-scroll — seperti drawer
   lain. Selector ber-ID supaya menang atas state .header-scrolled global
   yang memasang tekstur pekat. */
body[data-theme="elite"]  #vue-tab-info-profit,
body[data-theme="elite"]  #vue-tab-asset_credit_info {
  background: transparent !important;
  background-image: none !important;
}
body[data-theme="elite"]  #vue-tab-info-profit.header-scrolled,
body[data-theme="elite"]  #vue-tab-asset_credit_info.header-scrolled {
  background: rgba(11, 7, 22, 0.85) !important;
}
/* Konten list credit info: div polos (bukan card) -> beri backdrop gelap
   yang sama dengan card drawer lain supaya tidak menumpang video mentah */
body[data-theme="elite"]  #vue-asset_credit_info,
body[data-theme="elite"]  #vue-asset_credit_info > div,
body[data-theme="elite"]  #vue-asset_credit_info .content {
  min-height: calc(100vh - 60px) !important;
}
body[data-theme="elite"]  #vue-asset_credit_info .content {
  background-color: rgba(10, 13, 24, 0.9) !important;
}
/* Moon Logic header has .theme-header (bg image) -> force transparent at top */
body[data-theme="elite"] #header-formula-moon-logic {
  background: transparent !important;
  background-image: none !important;
}
/* Header when scrolled -> 80% dark, no image */
body[data-theme="elite"] #tab-roi-setting.header-scrolled,
body[data-theme="elite"] #header-formula-moon-logic.header-scrolled,
body[data-theme="elite"] #fee-setting-information-header.header-scrolled,
body[data-theme="elite"] #fee-setting-buy-bnb-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
body[data-theme="elite"] #tab-profit-roi,
body[data-theme="elite"] #tab-profit-roi.header-scrolled {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="elite"] #tab-roi-setting .bi,
body[data-theme="elite"] #tab-profit-roi .bi,
body[data-theme="elite"] #user-roi-setting .bi,
body[data-theme="elite"] #vue-tab-info-profit .bi,
body[data-theme="elite"] #vue-tab-asset_credit_info .bi,
body[data-theme="elite"] #header-formula-moon-logic .bi,
body[data-theme="elite"] #fee-setting-information-header .bi,
body[data-theme="elite"] #fee-setting-buy-bnb-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards + inline white backgrounds -> Card/Table BG @80% */
body[data-theme="elite"] #roi-setting .card.card-style,
body[data-theme="elite"] #formula-moon-logic .card.card-style,
body[data-theme="elite"] #fee-setting-information-page .card.card-style,
body[data-theme="elite"] #fee-setting-buy-bnb-page .card.card-style,
body[data-theme="elite"] #roi-setting [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #roi-setting [style*="background-color: white"],
body[data-theme="elite"] #roi-setting [style*="background-color: #fff"],
body[data-theme="elite"] #formula-moon-logic [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #formula-moon-logic [style*="background-color: white"],
body[data-theme="elite"] #formula-moon-logic [style*="background-color: #fff"],
body[data-theme="elite"] #fee-setting-information-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #fee-setting-information-page [style*="background-color: white"],
body[data-theme="elite"] #fee-setting-information-page [style*="background-color: #fff"],
body[data-theme="elite"] #fee-setting-buy-bnb-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #fee-setting-buy-bnb-page [style*="background-color: white"],
body[data-theme="elite"] #fee-setting-buy-bnb-page [style*="background-color: #fff"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
  border-color: rgba(146, 75, 225, 0.3) !important;
}
body[data-theme="elite"] #collapse-list-5 {
  background-color: transparent !important;
}
/* Saving footer buttons -> force images (Hentikan = force-red, Edit = force-green)
   + glow border sesuai warna gambar */
body[data-theme="elite"] #stop-saving,
body[data-theme="elite"] #saving-setting {
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  color: #fff !important;
}
body[data-theme="elite"] #stop-saving {
  background-image: var(--th-btn-force-sell-img) !important; /* force-red.png */
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
}
body[data-theme="elite"] #saving-setting {
  background-image: var(--th-btn-force-buy-img) !important; /* force-green.png */
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 3px 5px rgba(255, 255, 255, 0.4),
              inset 0 -3px 5px rgba(0, 0, 0, 0.25),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
}
/* =========================================================================
   SAVING (#saving-page) — video bg + theme
   ========================================================================= */
/* Video background: FIXED to the panel viewport so it never scrolls with content */
body[data-theme="elite"] #saving-page #elite-bg-video {
  position: fixed;
  top: 0; left: 0;
  width: 100%; max-width: 450px; /* selebar panel */
  height: 100vh;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Cegah scroll nyambung ke halaman di belakang panel */
body[data-theme="elite"] #saving-page {
  overscroll-behavior: contain;
}
body[data-theme="elite"] #saving-page moonbot-bg {
  display: none !important;
}
/* Header when scrolled -> 80% dark, no image */
body[data-theme="elite"] #staking-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="elite"] #staking-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards + inline white backgrounds -> Card/Table BG @80% */
body[data-theme="elite"] #saving-page .card.card-style,
body[data-theme="elite"] #saving-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #saving-page [style*="background-color: white"],
body[data-theme="elite"] #saving-page [style*="background-color: #fff"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
  border-color: rgba(146, 75, 225, 0.3) !important;
}
/* Text -> light */
body[data-theme="elite"] #saving-page .color-black,
body[data-theme="elite"] #saving-page .color-theme,
body[data-theme="elite"] #saving-page [style*="color: rgb(33, 33, 33)"],
body[data-theme="elite"] #saving-page [style*="color:#212121"],
body[data-theme="elite"] #saving-page i[style*="color: rgb(33, 33, 33)"] {
  color: #f2effa !important;
}
/* =========================================================================
   SAVING HISTORY / KEUNTUNGAN HARIAN (#saving-history) — video bg + cards
   ========================================================================= */
body[data-theme="elite"] #saving-history #elite-bg-video {
  position: fixed;
  top: 0; left: 0;
  width: 100%; max-width: 450px;
  height: 100vh;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header: transparan di atas (rule global .top-header.sticky sudah menangani),
   solid 80% saat scroll */
body[data-theme="elite"] #vue-tab-saving-history.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
body[data-theme="elite"] #vue-tab-saving-history .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards seperti target: ada margin, rounded, jarak antar card, bg @80% */
body[data-theme="elite"] #vue-saving-history .card.card-style {
  background-color: rgba(27, 24, 43, 0.8) !important;
  margin: 12px 15px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(146, 75, 225, 0.25) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.15) !important;
}
/* Teks di card -> terang (kecuali yang punya warna inline: simbol ungu, profit hijau) */
body[data-theme="elite"] #vue-saving-history .color-black,
body[data-theme="elite"] #vue-saving-history .color-theme,
body[data-theme="elite"] #vue-saving-history p:not([style*="color"]) {
  color: #f2effa !important;
}
body[data-theme="elite"] #vue-saving-history .font-11:not(.color-black):not(.color-theme) {
  color: rgba(242, 239, 250, 0.6) !important;
}
/* Divider dalam card -> ungu halus */
body[data-theme="elite"] #vue-saving-history .divider {
  background-color: rgba(143, 109, 215, 0.25) !important;
}
/* =========================================================================
   BONUS (#bonus-page) + FEE DETAIL (#fee-setting-information-detail-page)
   ========================================================================= */
body[data-theme="elite"] #bonus-page #elite-bg-video,
body[data-theme="elite"] #fee-setting-information-detail-page #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
body[data-theme="elite"] #bonus-page moonbot-bg {
  display: none !important;
}
/* Header scrolled -> 80% dark */
body[data-theme="elite"] #user-bonus-header.header-scrolled,
body[data-theme="elite"] #fee-setting-information-detail-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Header icons gradient */
body[data-theme="elite"] #user-bonus-header .bi,
body[data-theme="elite"] #fee-setting-information-detail-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards + white backgrounds -> @80%, text light */
body[data-theme="elite"] #bonus-page .card.card-style,
body[data-theme="elite"] #bonus-page [style*="background-color: rgb(255, 255, 255)"],
/* body[data-theme="elite"] #bonus-page [style*="background-color: white"], */
body[data-theme="elite"] #bonus-page [style*="background-color: #fff"],
body[data-theme="elite"] #fee-setting-information-detail-page .card.card-style,
body[data-theme="elite"] #fee-setting-information-detail-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #fee-setting-information-detail-page [style*="background-color: white"],
body[data-theme="elite"] #fee-setting-information-detail-page [style*="background-color: #fff"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
  border-color: rgba(146, 75, 225, 0.3) !important;
}
body[data-theme="elite"] #bonus-page .color-black,
body[data-theme="elite"] #bonus-page [style*="color: rgb(33, 33, 33)"],
body[data-theme="elite"] #fee-setting-information-detail-page .color-black {
  color: #f2effa !important;
}
/* =========================================================================
   SUMMARY (#summary-page) — video bg + theme (mirror bonus)
   ========================================================================= */
body[data-theme="elite"] #summary-page #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="elite"] #tab-summary.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="elite"] #tab-summary .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Kartu + background putih inline -> gelap @80% */
body[data-theme="elite"] #user-summary .content,
body[data-theme="elite"] #user-summary [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #user-summary [style*="background-color: rgba(255, 255, 255, 1)"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
  border: 1px solid rgba(146, 75, 225, 0.3) !important;
}
/* Divider gelap -> terang */
body[data-theme="elite"] #user-summary .divider[style*="background-color: black"],
body[data-theme="elite"] #user-summary [style*="background-color: black"] {
  background-color: rgba(146, 75, 225, 0.4) !important;
}
/* Teks gelap -> terang */
body[data-theme="elite"] #user-summary [style*="color: black"],
body[data-theme="elite"] #user-summary .color-black {
  color: #f2effa !important;
}
/* =========================================================================
   TOP COIN SETTING (#top-coin-setting-page) — video bg + theme (mirror bonus)
   ========================================================================= */
body[data-theme="elite"] #top-coin-setting-page #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="elite"] #vue-tab-coin-setting.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="elite"] #vue-tab-coin-setting .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Strip putih (header tabel, baris koin, removed coin) -> gelap @80% */
body[data-theme="elite"] #top-coin-setting-page .bg-white {
  background-color: rgba(27, 24, 43, 0.8) !important;
  border-color: rgba(146, 75, 225, 0.3) !important;
}
/* Kartu list transparan agar tidak dobel dengan baris gelap */
body[data-theme="elite"] #vue-coin-setting .card.card-style {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Teks gelap -> terang */
body[data-theme="elite"] #top-coin-setting-page .color-theme,
body[data-theme="elite"] #top-coin-setting-page .color-black {
  color: #f2effa !important;
}
/* =========================================================================
   MENU DRAWER (#navigation) — video background
   ========================================================================= */
/* .nav-container video background dibuat absolute setinggi drawer agar tidak menyebabkan overflow scroll */
body[data-theme="elite"] #navigation #elite-bg-video {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center top;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
body[data-theme="elite"] #navigation moonbot-bg {
  display: none !important;
}
/* =========================================================================
   PROFIT SUMMARY (#profit-summary) & TRANSACTION (#transaction)
   — video bg + tema seperti coin detail (non-default saja)
   ========================================================================= */
body[data-theme="elite"] #profit-summary #elite-bg-video,
body[data-theme="elite"] #transaction #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="elite"] #tab-user-profit-summary.header-scrolled,
body[data-theme="elite"] #transaction .top-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="elite"] #tab-user-profit-summary .bi,
body[data-theme="elite"] #transaction .top-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Kartu -> 80% transparan seperti coin detail (menimpa rule solid #0f0a21 lama) */
body[data-theme="elite"] #user-profit-summary .content,
body[data-theme="elite"] #user-profit-summary .card,
body[data-theme="elite"] #vue-transaction-history .content.bg-theme,
body[data-theme="elite"] #vue-transaction-history .card {
  background-color: rgba(15, 10, 33, 0.80) !important;
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
/* Background putih inline -> 80% */
body[data-theme="elite"] #profit-summary [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #profit-summary [style*="background-color: white"],
body[data-theme="elite"] #profit-summary [style*="background-color: #fff"],
body[data-theme="elite"] #transaction [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #transaction [style*="background-color: white"],
body[data-theme="elite"] #transaction [style*="background-color: #fff"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
}
/* Teks gelap -> terang */
body[data-theme="elite"] #profit-summary .color-black,
body[data-theme="elite"] #profit-summary a[style*="color: black"],
body[data-theme="elite"] #transaction .color-black,
body[data-theme="elite"] #transaction a[style*="color: black"] {
  color: #f2effa !important;
}
/* =========================================================================
   NOTIFICATION MAINTENANCE (#notification-mt) — tema non-default
   ========================================================================= */
body[data-theme="elite"] #notification-mt .floating-maintenance {
  background-color: rgba(20, 18, 37, 0.97) !important; /* Modal BG */
  border: 1px solid rgba(164, 92, 255, 0.55) !important; /* Glow Purple */
  box-shadow: 0 0 18px rgba(164, 92, 255, 0.45),
              0 15px 25px rgba(0, 0, 0, 0.35) !important;
  color: #f2effa !important; /* Text Primary */
}
/* Make any inner text bright (to override backend inline grey styles) */
body[data-theme="elite"] #notification-mt .floating-maintenance p,
body[data-theme="elite"] #notification-mt .floating-maintenance div,
body[data-theme="elite"] #notification-mt .floating-maintenance span,
body[data-theme="elite"] #notification-mt .floating-maintenance h1,
body[data-theme="elite"] #notification-mt .floating-maintenance h2,
body[data-theme="elite"] #notification-mt .floating-maintenance h3,
body[data-theme="elite"] #notification-mt .floating-maintenance h4,
body[data-theme="elite"] #notification-mt .floating-maintenance h5,
body[data-theme="elite"] #notification-mt .floating-maintenance h6,
body[data-theme="elite"] #notification-mt .floating-maintenance b,
body[data-theme="elite"] #notification-mt .floating-maintenance i,
body[data-theme="elite"] #notification-mt .floating-maintenance [style*="color"] {
  color: #ffffff !important;
}
body[data-theme="elite"] #notification-mt .floating-maintenance a,
body[data-theme="elite"] #notification-mt .floating-maintenance a[style] {
  color: #ffd86b !important; /* Gold Accent (link @MoonbotCareBot) */
}
body[data-theme="elite"] #notification-mt .btn-close {
  filter: brightness(0) invert(1) !important;
  opacity: 1 !important;
}
/* =========================================================================
   ANNOUNCEMENT MODALS (.announcement-download-modal) — tema non-default
   ========================================================================= */
body[data-theme="elite"] .announcement-download-modal {
  background-color: #141225 !important; /* Modal BG */
  border: 1px solid rgba(164, 92, 255, 0.5) !important;
  box-shadow: 0 0 18px rgba(164, 92, 255, 0.4) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}
/* Judul & Checklist -> Putih Terang */
body[data-theme="elite"] .announcement-download-modal .announcement-download-title,
body[data-theme="elite"] .announcement-download-modal h2,
body[data-theme="elite"] .announcement-download-modal [style*="color: black"],
body[data-theme="elite"] .announcement-download-modal [style*="color:black"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="elite"] .announcement-download-modal .announcement-download-message,
body[data-theme="elite"] .announcement-download-modal .announcement-download-message li,
body[data-theme="elite"] .announcement-download-modal ul {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
/* Tombol Primary (btn-download) */
body[data-theme="elite"] .announcement-download-modal .btn-download {
  background: transparent !important;
  border: 1px solid rgba(146, 75, 225, 0.8) !important;
  color: var(--th-accent-2, #be86fb) !important;
  font-weight: 700 !important;
  box-shadow: 0 0 12px rgba(146, 75, 225, 0.4) !important;
  border-radius: 8px !important;
}
body[data-theme="elite"] .announcement-download-modal .btn-download,
body[data-theme="elite"] .announcement-download-modal .btn-download *,
body[data-theme="elite"] .announcement-download-modal .btn-download span {
  color: var(--th-accent-2, #be86fb) !important;
  -webkit-text-fill-color: var(--th-accent-2, #be86fb) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
}
/* Footer Modal Download App */
body[data-theme="elite"] .footer-container-download-app {
  background-color: #1b182b !important;
  border-top: 1px solid rgba(164, 92, 255, 0.2) !important;
}
body[data-theme="elite"] .footer-link-download-app {
  color: #a45cff !important;
}
/* =========================================================================
   POPUP WRAPPERS (#chose-exchanger, #announcement-download-app, #notification-change-top-coin, #feedback-from-user) — ELITE
   ========================================================================= */
body[data-theme="elite"] .popUp .card-style-banner,
body[data-theme="elite"] .popUp .card.card-style-banner,
body[data-theme="elite"] #chose-exchanger .card,
body[data-theme="elite"] #chose-exchanger .card-style-banner,
body[data-theme="elite"] #chose-exchanger .content,
body[data-theme="elite"] #chose-exchanger .popup-container,
body[data-theme="elite"] #announcement-download-app .card,
body[data-theme="elite"] #announcement-download-app .card-style-banner,
body[data-theme="elite"] #announcement-download-app .content,
body[data-theme="elite"] #announcement-download-app .popup-container,
body[data-theme="elite"] #notification-change-top-coin .card,
body[data-theme="elite"] #notification-change-top-coin .card-style-banner,
body[data-theme="elite"] #notification-change-top-coin .content,
body[data-theme="elite"] #notification-change-top-coin .popup-container,
body[data-theme="elite"] #feedback-from-user .card,
body[data-theme="elite"] #feedback-from-user .card-style-banner,
body[data-theme="elite"] #feedback-from-user .content,
body[data-theme="elite"] #feedback-from-user .popup-container {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
}
body[data-theme="elite"] #chose-exchanger .popUp,
body[data-theme="elite"] #announcement-download-app .popUp,
body[data-theme="elite"] #notification-change-top-coin .popUp,
body[data-theme="elite"] #feedback-from-user .popUp {
  overflow: visible !important;
  padding: 15px !important;
}
body[data-theme="elite"] .feedback-form-user-modal {
  background-color: #141225 !important;
  border: 1px solid rgba(164, 92, 255, 0.55) !important;
  box-shadow: 0 0 20px rgba(164, 92, 255, 0.45), 0 16px 36px rgba(0, 0, 0, 0.7) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}
/* Judul Quick Survey */
body[data-theme="elite"] #vue-feedback-form-user h2,
body[data-theme="elite"] #vue-feedback-form-user [style*="color: #9b82c4"],
body[data-theme="elite"] #vue-feedback-form-user [style*="color:#9b82c4"],
body[data-theme="elite"] #vue-feedback-form-user [style*="rgb(155, 130, 196)"],
body[data-theme="elite"] #vue-feedback-form-user [style*="rgb(155,130,196)"] {
  color: #a45cff !important;
  -webkit-text-fill-color: #a45cff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}
/* Pertanyaan */
body[data-theme="elite"] .feedback-form-user-modal p,
body[data-theme="elite"] .feedback-form-user-modal p[style*="color"],
body[data-theme="elite"] .feedback-form-user-modal .color-black {
  color: #d8d4e4 !important;
  -webkit-text-fill-color: #d8d4e4 !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
/* Tombol Tidak (Secondary) */
body[data-theme="elite"] .feedback-form-user-modal button[onclick="answerFeedback(0)"],
body[data-theme="elite"] .feedback-form-user-modal .btn-feedback-no {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(164, 92, 255, 0.45) !important;
  color: #f2effa !important;
  -webkit-text-fill-color: #f2effa !important;
  border-radius: 8px !important;
  height: 38px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}
body[data-theme="elite"] .feedback-form-user-modal button[onclick="answerFeedback(0)"]:hover,
body[data-theme="elite"] .feedback-form-user-modal .btn-feedback-no:hover {
  background: rgba(164, 92, 255, 0.15) !important;
  border-color: rgba(164, 92, 255, 0.7) !important;
}
/* Tombol Ya (Primary) */
body[data-theme="elite"] .feedback-form-user-modal button[onclick="answerFeedback(1)"],
body[data-theme="elite"] .feedback-form-user-modal .btn-feedback-yes {
  background: var(--th-accent-grad, linear-gradient(135deg, #a73bf2, #7a22cc)) !important;
  border: none !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 0 14px rgba(164, 92, 255, 0.5) !important;
  border-radius: 8px !important;
  height: 38px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}
body[data-theme="elite"] .feedback-form-user-modal button[onclick="answerFeedback(1)"]:hover,
body[data-theme="elite"] .feedback-form-user-modal .btn-feedback-yes:hover {
  filter: brightness(1.1) !important;
  box-shadow: 0 0 18px rgba(164, 92, 255, 0.7) !important;
}
/* =========================================================================
   CHOSE EXCHANGER (#chose-exchanger) — tema non-default
   ========================================================================= */
/* List exchanger */
body[data-theme="elite"] #chose-exchanger .dropdown {
  background: #1b182b !important; /* Card/Table BG */
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4) !important;
}
body[data-theme="elite"] #chose-exchanger .dropdown-item {
  border-bottom: 1px solid rgba(143, 109, 215, 0.25) !important;
}
body[data-theme="elite"] #chose-exchanger .dropdown-item:hover {
  background: rgba(164, 92, 255, 0.18) !important;
}
/* Nama exchanger -> terang (span berwarna brand, mis. Tokocrypto, tetap) */
body[data-theme="elite"] #chose-exchanger .dropdown-item .name {
  color: #f2effa;
}
/* =========================================================================
   NOTIF CHANGE TOP COIN — tombol "Pergi ke Pengaturan Moonbot"
   Saat tema aktif: gaya button-primary (gradient accent + glow); default tetap.
   ========================================================================= */
body[data-theme="elite"] #notification-change-top-coin .announcement-download-modal,
body[data-theme="elite"] #notification-change-top-coin .announcement-download-modal div,
body[data-theme="elite"] #notification-change-top-coin .announcement-download-modal [style*="color"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="elite"] #notification-change-top-coin a.btn.btn-download,
body[data-theme="elite"] #notification-change-top-coin a.btn.btn-download *,
body[data-theme="elite"] #notification-change-top-coin a.btn.btn-download span {
  background: var(--th-accent-grad, #924be1) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}
/* =========================================================================
   FORMULA (#formula), BATCH FORMULA (#batch-formula),
   BATCH MOON LOGIC (#batch-moon-logic) — video bg + tema seperti coin detail
   ========================================================================= */
body[data-theme="elite"] #formula #elite-bg-video,
body[data-theme="elite"] #batch-formula #elite-bg-video,
body[data-theme="elite"] #batch-moon-logic #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header batch moon logic punya .theme-header (bg image) -> transparan di atas */
body[data-theme="elite"] #header-batch-formula-moon-logic {
  background: transparent !important;
  background-image: none !important;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="elite"] #header-formula.header-scrolled,
body[data-theme="elite"] #header-batch-formula.header-scrolled,
body[data-theme="elite"] #header-batch-formula-moon-logic.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="elite"] #header-formula .bi,
body[data-theme="elite"] #header-batch-formula .bi,
body[data-theme="elite"] #header-batch-formula-moon-logic .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Kartu -> 80% transparan (menimpa rule solid #0f0a21 lama untuk formula) */
body[data-theme="elite"] #formula .card.card-style,
body[data-theme="elite"] #formula .content.bg-theme,
body[data-theme="elite"] #batch-formula .card.card-style,
body[data-theme="elite"] #batch-formula .content.bg-theme,
body[data-theme="elite"] #batch-moon-logic .card.card-style,
body[data-theme="elite"] #batch-moon-logic .content.bg-theme {
  background-color: rgba(15, 10, 33, 0.80) !important;
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
}
/* Teks gelap -> terang */
body[data-theme="elite"] #formula .color-black,
body[data-theme="elite"] #batch-formula .color-black,
body[data-theme="elite"] #batch-moon-logic .color-black {
  color: #f2effa !important;
}
/* =========================================================================
   TRADE PAGE — nama koin di list (inline color: black) -> terang
   ========================================================================= */
body[data-theme="elite"] #trade-page h1[style*="color: black"] {
  color: #f2effa !important; /* Text Primary */
}
body[data-theme="elite"] #trade-page h1 .color-gray-dark {
  color: #96929d !important; /* Text Secondary (/USDT) */
}
/* =========================================================================
   TRADING VOLUME HISTORY (#trading-volume-history) — video bg + tema
   ========================================================================= */
body[data-theme="elite"] #trading-volume-history #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="elite"] #trading-volume-history .top-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="elite"] #trading-volume-history .top-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Kartu -> rounded + berjarak + 80% gelap + border ungu (gaya target) */
body[data-theme="elite"] #vue-trading-history-body .card.card-style {
  background-color: rgba(27, 24, 43, 0.8) !important;
  margin: 12px 15px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(146, 75, 225, 0.25) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.15) !important;
}
/* Teks tanggal & label -> terang; nilai .color-purple biarkan */
body[data-theme="elite"] #vue-trading-history-body .color-black,
body[data-theme="elite"] #vue-trading-history-body p:not(.color-purple) {
  color: #f2effa !important;
}
/* Override black texts in Coin List (Ticker) */
body[data-theme="elite"] .ticker-content .color-black,
body[data-theme="elite"] .ticker-content [style*="color: black"],
body[data-theme="elite"] .ticker-content [style*="color:black"] {
    color: white !important;
}
body[data-theme="elite"] .ticker-content .color-gray,
body[data-theme="elite"] .ticker-content .color-gray-dark {
    color: rgba(255, 255, 255, 0.6) !important;
}
/* Label status AVG: ON/OFF di kartu coin — teks putih dengan outline gelap
   supaya tetap terbaca di bagian background yang terang (cincin planet, dll.) */
body[data-theme="elite"] .ticker-content .d-flex.ms-auto > .font-11 {
    color: #fff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), 0 0 6px rgba(0, 0, 0, 0.75) !important;
}
/* Divider dalam kartu -> abu tipis */
body[data-theme="elite"] #vue-trading-history-body .divider {
  display: block !important;
  height: 1px !important;
  background-color: rgba(150, 146, 157, 0.25) !important;
  opacity: 1 !important;
}
/* =========================================================================
   BATCH SETTINGS (Sekumpulan Pengaturan, #carousel-batch di trade) —
   semua icon pakai gradient ala menu (kecuali Moon Logic yang berupa <img>)
   ========================================================================= */
body[data-theme="elite"] #carousel-batch .icon,
body[data-theme="elite"] .icon.rounded-s {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 45px !important;
  height: 45px !important;
  line-height: normal !important;
  transform: none !important;
}
body[data-theme="elite"] #carousel-batch .icon i,
body[data-theme="elite"] .icon.rounded-s > i {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  vertical-align: 0 !important;
  margin: 0 !important;
}
body[data-theme="elite"] #carousel-batch .icon i::before,
body[data-theme="elite"] .icon.rounded-s > i::before {
  vertical-align: 0 !important;
  line-height: 1 !important;
}
body[data-theme="elite"] #carousel-batch .icon img,
body[data-theme="elite"] .icon.rounded-s > img {
  display: block !important;
  margin: auto !important;
}
/* =========================================================================
   KONFIGURASI PENYEIMBANGAN — single (#margin-configuration) &
   batch (#batch-margin-configuration) — video bg + tema seperti coin detail
   ========================================================================= */
body[data-theme="elite"] #margin-configuration #elite-bg-video,
body[data-theme="elite"] #batch-margin-configuration #elite-bg-video {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="elite"] #header-balancing-configuration.header-scrolled,
body[data-theme="elite"] #header-batch-balancing-configuration.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="elite"] #header-balancing-configuration .bi,
body[data-theme="elite"] #header-batch-balancing-configuration .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Body tabel (inline background: white) -> 80% gelap */
body[data-theme="elite"] #body-balancing-configuration .content,
body[data-theme="elite"] #body-batch-balancing-configuration .content {
  background: rgba(15, 10, 33, 0.80) !important;
}
/* Input angka -> gelap transparan, teks terang, border ungu */
body[data-theme="elite"] #body-balancing-configuration input,
body[data-theme="elite"] #body-batch-balancing-configuration input {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #f2effa !important;
  border: 1px solid rgba(168, 85, 247, 0.9) !important;
  box-shadow: 0 0 6px rgba(168, 85, 247, 0.5) !important;
  border-radius: 4px;
}
body[data-theme="elite"] #body-balancing-configuration input:disabled,
body[data-theme="elite"] #body-batch-balancing-configuration input:disabled {
  background: rgba(255, 255, 255, 0.04) !important;
  color: #96929d !important; /* Text Secondary */
}
/* Nomor langkah & satuan -> terang */
body[data-theme="elite"] #body-balancing-configuration .color-gray-dark,
body[data-theme="elite"] #body-batch-balancing-configuration .color-gray-dark,
body[data-theme="elite"] #body-balancing-configuration i.color-theme,
body[data-theme="elite"] #body-batch-balancing-configuration i.color-theme {
  color: #f2effa !important;
}
/* Divider antar baris -> ungu halus */
body[data-theme="elite"] #body-balancing-configuration .divider,
body[data-theme="elite"] #body-batch-balancing-configuration .divider {
  background-color: rgba(143, 109, 215, 0.25) !important;
}
/* ========================================================
   SAVING PAGE 
   ======================================================== */
body[data-theme="elite"] #elite-bg-video-saving {
  display: block !important;
}
body[data-theme="elite"] #saving-page .theme-light {
  position: relative;
  z-index: 0;
}
/* Translucent Cards */
body[data-theme="elite"] #saving-page .content,
body[data-theme="elite"] #user-saving .content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body[data-theme="elite"] #saving-page .card.card-style,
body[data-theme="elite"] #user-saving .card.card-style,
body[data-theme="elite"] #saving-information,
body[data-theme="elite"] #saving-setup,
body[data-theme="elite"] #saving-membership .card.card-style {
  background-color: var(--th-surface-glass, rgba(27, 24, 43, 0.80)) !important;
  border: 1px solid var(--th-border, rgba(64, 201, 214, 0.25)) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-radius: 12px;
}

/* Override .bg-theme if any */
body[data-theme="elite"] #saving-page .bg-theme,
body[data-theme="elite"] #user-saving .bg-theme {
  background: transparent !important;
  background-color: transparent !important;
}

/* Fix Header Scrolling Background */
body[data-theme="elite"] #staking-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}

/* All Text Colors & Titles inside Saving Page */
body[data-theme="elite"] #saving-page .color-theme,
body[data-theme="elite"] #user-saving .color-theme,
body[data-theme="elite"] #saving-page .color-black,
body[data-theme="elite"] #user-saving .color-black,
body[data-theme="elite"] #saving-page .saving-list .color-black,
body[data-theme="elite"] #user-saving .saving-list .color-black,
body[data-theme="elite"] #saving-page h5,
body[data-theme="elite"] #user-saving h5,
body[data-theme="elite"] #saving-page [style*="color: rgb(33, 33, 33)"],
body[data-theme="elite"] #user-saving [style*="color: rgb(33, 33, 33)"],
body[data-theme="elite"] #saving-page [style*="color: #212121"],
body[data-theme="elite"] #user-saving [style*="color: #212121"],
body[data-theme="elite"] #saving-page [style*="color:#212121"],
body[data-theme="elite"] #user-saving [style*="color:#212121"],
body[data-theme="elite"] #saving-page [style*="color: black"],
body[data-theme="elite"] #user-saving [style*="color: black"],
body[data-theme="elite"] #saving-page [style*="color:black"],
body[data-theme="elite"] #user-saving [style*="color:black"],
body[data-theme="elite"] #saving-page p.font-12.color-black,
body[data-theme="elite"] #user-saving p.font-12.color-black {
  color: #F2EFFA !important;
}

/* Secondary labels & info list */
body[data-theme="elite"] #saving-information li,
body[data-theme="elite"] #saving-information div,
body[data-theme="elite"] #saving-page h5.font-500.opacity-50,
body[data-theme="elite"] #user-saving h5.font-500.opacity-50,
body[data-theme="elite"] #saving-page h5[style*="color: #212121"],
body[data-theme="elite"] #user-saving h5[style*="color: #212121"] {
  color: rgba(242, 239, 250, 0.75) !important;
  opacity: 0.9 !important;
}

body[data-theme="elite"] #user-saving label.color-theme,
body[data-theme="elite"] #saving-page label.color-theme,
body[data-theme="elite"] #saving-page .form-custom label {
  display: none !important;
}

/* Gitbook link */
body[data-theme="elite"] #saving-information a,
body[data-theme="elite"] #user-saving a[onclick*="CallGitbook"] {
  color: var(--th-accent, #40c9d6) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}

/* Large numbers (Perkirakan Nilai Total) */
body[data-theme="elite"] #saving-page #saving-membership i.font-22,
body[data-theme="elite"] #user-saving #saving-membership i.font-22,
body[data-theme="elite"] #user-saving i.font-22 {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Daily Profit button */
body[data-theme="elite"] #saving-page .icon-button,
body[data-theme="elite"] #user-saving .icon-button,
body[data-theme="elite"] .icon-button {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  border: 1px solid var(--th-border, rgba(64, 201, 214, 0.45)) !important;
  border-radius: 20px !important;
  padding: 4px 14px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
  display: inline-flex !important;
  align-items: center !important;
}

body[data-theme="elite"] #saving-page .icon-button i,
body[data-theme="elite"] #user-saving .icon-button i {
  color: #ffffff !important;
}

/* Saving Transaction History List */
body[data-theme="elite"] #saving-page .saving-list .saving-item1,
body[data-theme="elite"] #user-saving .saving-list .saving-item1 {
  color: rgba(242, 239, 250, 0.75) !important;
  font-weight: 500 !important;
}

body[data-theme="elite"] #saving-page .saving-list .saving-item2,
body[data-theme="elite"] #user-saving .saving-list .saving-item2 {
  color: rgba(242, 239, 250, 0.5) !important;
}

body[data-theme="elite"] #saving-page .saving-list .saving-item3,
body[data-theme="elite"] #user-saving .saving-list .saving-item3,
body[data-theme="elite"] #saving-page .saving-list .saving-item4,
body[data-theme="elite"] #user-saving .saving-list .saving-item4 {
  color: #FFFFFF !important;
  font-weight: 600 !important;
}

/* Header line for Saving Transaction History */
body[data-theme="elite"] #saving-page [style*="border-bottom"],
body[data-theme="elite"] #user-saving [style*="border-bottom"] {
  border-bottom: 1px solid var(--th-border, rgba(64, 201, 214, 0.35)) !important;
}

body[data-theme="elite"] #saving-page p.font-600.color-theme,
body[data-theme="elite"] #user-saving p.font-600.color-theme {
  color: #FFFFFF !important;
}

/* Form inputs (Jumlah USDT) — borderless, wrapper .form-custom menyediakan satu-satunya border */
body[data-theme="elite"] #saving-page #saving-max-usdt,
body[data-theme="elite"] #user-saving #saving-max-usdt,
body[data-theme="elite"] #saving-setup #saving-max-usdt,
body[data-theme="elite"] #saving-max-usdt {
  background-color: transparent !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
  color: #FFFFFF !important;
  padding-left: 36px !important;
}

body[data-theme="elite"] #saving-page #saving-max-usdt:focus,
body[data-theme="elite"] #user-saving #saving-max-usdt:focus,
body[data-theme="elite"] #saving-setup #saving-max-usdt:focus,
body[data-theme="elite"] #saving-max-usdt:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Action Buttons (Mulai & Batal) */
body[data-theme="elite"] #saving-page .btn-investor-mode,
body[data-theme="elite"] #user-saving .btn-investor-mode {
  background-color: transparent !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  border: none !important;
  box-shadow: none !important;
}

body[data-theme="elite"] #saving-page #start-saving,
body[data-theme="elite"] #user-saving #start-saving,
body[data-theme="elite"] #saving-page #set-amount-to-start-saving,
body[data-theme="elite"] #user-saving #set-amount-to-start-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-elit/start.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
  border-radius: 20px !important;
  height: 38px !important;
  font-weight: 700 !important;
}

body[data-theme="elite"] #saving-page #cancel-edit-amount,
body[data-theme="elite"] #user-saving #cancel-edit-amount,
body[data-theme="elite"] #saving-page #stop-saving,
body[data-theme="elite"] #user-saving #stop-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-stop-img, url("../../assets/orbit-elit/stop.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
  border-radius: 20px !important;
  height: 38px !important;
  font-weight: 700 !important;
}

body[data-theme="elite"] #saving-page #saving-setting,
body[data-theme="elite"] #user-saving #saving-setting,
body[data-theme="elite"] #footer-bar-savings #saving-setting,
body[data-theme="elite"] #saving-started #saving-setting {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-elit/pause.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 190, 90, 0.75) !important;
  box-shadow: 0 0 16px rgba(247, 160, 30, 0.65),
              inset 0 0 8px rgba(255, 210, 130, 0.25) !important;
  border-radius: 20px !important;
  height: 38px !important;
  font-weight: 700 !important;
}

/* Dividers -> garis tipis abu-abu pemisah baris */
body[data-theme="elite"] #saving-page .divider,
body[data-theme="elite"] #user-saving .divider,
body[data-theme="elite"] #user-saving hr.divider {
  display: block !important;
  height: 1px !important;
  border: none !important;
  background-color: rgba(150, 146, 157, 0.25) !important;
  opacity: 1 !important;
}
/* Icon Gradients */
body[data-theme="elite"] #staking-header .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
}
/* Fix border-offset becoming 80% opacity due to inline style override */
body[data-theme="elite"] #asset-page .border-offset[style],
body[data-theme="elite"] #saving-page .border-offset[style],
body[data-theme="elite"] .border-offset[style] {
  background-color: transparent !important;
}
/* =========================================================================
   PROFIT SUMMARY (#profit-summary) — video bg + theme
   ========================================================================= */
/* Video background */
body[data-theme="elite"] #profit-summary #elite-bg-video {
  position: fixed;
  top: 0; left: 0;
  width: 100%; max-width: 450px;
  height: 100vh;
  object-fit: cover;
  z-index: -1;
  pointer-events: none;
  border: 0;
  display: block !important;
}
/* Stacking context for .theme-light */
body[data-theme="elite"] #profit-summary .theme-light {
  position: relative;
  z-index: 0;
}
body[data-theme="elite"] #profit-summary {
  overscroll-behavior: contain;
}
/* Header when scrolled -> 80% dark, no image */
body[data-theme="elite"] #profit-summary #tab-user-profit-summary.header-scrolled {
  background-image: none !important;
  background-color: rgba(11, 7, 22, 0.80) !important;
  background-size: auto !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="elite"] #profit-summary #tab-user-profit-summary .bi {
  background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Top offset gradient -> transparent */
body[data-theme="elite"] #profit-summary .top-offset {
  background: transparent !important;
  background-image: none !important;
}
body[data-theme="elite"] #profit-summary #tab-user-profit-summary {
  background: transparent !important;
}
/* Cards + inline white backgrounds -> Card/Table BG @80% with shiny border */
body[data-theme="elite"] #profit-summary .card.card-style,
body[data-theme="elite"] #profit-summary .content.my-0,
body[data-theme="elite"] #profit-summary [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="elite"] #profit-summary [style*="background-color: white"],
body[data-theme="elite"] #profit-summary [style*="background-color: rgba(255, 255, 255, 1)"],
body[data-theme="elite"] #profit-summary [style*="background-color: #fff"] {
  background-color: rgba(27, 24, 43, 0.8) !important;
  border: 1px solid rgba(146, 75, 225, 0.4) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.2) !important;
  backdrop-filter: blur(2px);
}
/* Text -> light */
body[data-theme="elite"] #profit-summary .color-black,
body[data-theme="elite"] #profit-summary [style*="color: black"],
body[data-theme="elite"] #profit-summary [style*="color: #212121"],
body[data-theme="elite"] #profit-summary h5[style*="color: rgb(33, 33, 33)"],
body[data-theme="elite"] #profit-summary i[style*="color: rgb(33, 33, 33)"] {
  color: #f2effa !important;
}
/* .color-purple in list (Date) */
body[data-theme="elite"] #profit-summary .color-purple {
  color: var(--th-accent-4) !important; 
}
/* Dividers -> transparent or subtle */
/* Hide bg-theme background for table header so it flows with the card */
body[data-theme="elite"] #profit-summary .bg-theme {
  background-color: transparent !important;
}
/* Filter box */
body[data-theme="elite"] #profit-summary .filter-box {
  background-color: rgba(255,255,255, 0.1) !important;
  border-radius: 8px;
  padding: 2px 8px;
}
/* Moon Logic Icon in Batch Settings */
body[data-theme="elite"] button[onclick="BatchMoonLogic()"] .icon img {
  width: 35px !important;
  height: 35px !important;
  margin-top: 0 !important;
}
/* Elite Theme Form Controls */
body[data-theme="elite"] .form-custom {
    border: 1px solid var(--th-border) !important;
    background-color: #000000 !important;
    background: #000000 !important;
    box-shadow: none !important;
    border-radius: 8px !important;
}
/* style.css base: `.form-control:focus{border:2px solid #924ce2!important}`
   app-wide (semua tema) — pas input di-fokus, border jadi ungu terang nimpa
   border tema. Input di dalam .form-custom tetap borderless pas fokus
   (wrapper-nya udah punya border sendiri). */
body[data-theme="elite"] .form-custom input:focus {
    border: none !important;
}
body[data-theme="elite"] .form-select,
body[data-theme="elite"] input.form-control:not(.form-custom input) {
    border: 1px solid rgba(146, 75, 225, 0.6) !important;
    background-color: transparent !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.25) !important;
    color: white !important;
    border-radius: 8px !important;
}
/* Global inputs inside .form-custom (make borderless, transparan biar
   background hitam si wrapper .form-custom yang kelihatan — sebelumnya cuma
   #otp-address yang ke-cover manual, input .form-custom lain (mis.
   #saving-max-usdt) jadi putih polos karena gak ada rule background-nya). */
body[data-theme="elite"] .form-custom input,
body[data-theme="elite"] .form-custom select,
body[data-theme="elite"] .form-custom textarea {
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: white !important;
}
body[data-theme="elite"]  .form-custom input#otp-address,
body[data-theme="elite"]  input#otp-address {
    background-color: #000000 !important;
    background: #000000 !important;
    border: 1px solid var(--th-border) !important;
    border-color: var(--th-border) !important;
    color: var(--th-text) !important;
    border-radius: 10px !important;
}
/* Phone Input Dialog (intl-tel-input) Layout Fixes */
body[data-theme="elite"] #pop-up-phone-input .form-custom {
    border: 1px solid rgba(146, 75, 225, 0.6) !important;
    background-color: transparent !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.2) !important;
    border-radius: 8px !important;
}
body[data-theme="elite"] #otp-phone-number {
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: white !important;
    width: 100% !important;
}
body[data-theme="elite"] #pop-up-phone-input .iti {
    width: 100% !important;
}
body[data-theme="elite"] select option {
    background-color: var(--th-surface, #1b182b) !important;
    color: white !important;
}
body[data-theme="elite"] #otp-address::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}
body[data-theme="elite"] .form-custom.form-icon i {
    color: var(--th-text-muted) !important;
}
/* =========================================================================
   KONVENSI TOMBOL GLOBAL (tema non-default):
   - Tombol UNGU (<a>/<button>) -> gaya button-primary (accent gradient + glow)
   - Tombol HIJAU -> banner start.png (gaya button-start)
   ========================================================================= */
/* --- UNGU -> button-primary --- */
body[data-theme="elite"] a[style*="background-color: #924be1"],
body[data-theme="elite"] button[style*="background-color: #924be1"],
body[data-theme="elite"] a[style*="background-color: rgb(146, 75, 225)"],
body[data-theme="elite"] button[style*="background-color: rgb(146, 75, 225)"],
body[data-theme="elite"] a[style*="background-color: #924ce2"],
body[data-theme="elite"] button[style*="background-color: #924ce2"],
body[data-theme="elite"] a[style*="background-color: rgb(146, 76, 226)"],
body[data-theme="elite"] button[style*="background-color: rgb(146, 76, 226)"],
body[data-theme="elite"] button.bg-purple:not(#saving-setting),
body[data-theme="elite"] a.bg-purple,
body[data-theme="elite"] button.submit-otp,
body[data-theme="elite"] button[onclick="BatchSave()"],
body[data-theme="elite"] button[onclick="ValidatePhone()"],
body[data-theme="elite"] .btn-uni[style*="background-color: rgb(92, 51, 181)"],
body[data-theme="elite"] .btn-uni[style*="background-color: rgba(92, 51, 181"],
body[data-theme="elite"] .offcanvas-footer .btn-full,
body[data-theme="elite"] .swal2-confirm,
body[data-theme="elite"] button[onclick="Save()"],
body[data-theme="elite"] .strategy-update {
  background: var(--th-accent-grad, #924be1) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
}
/* Change Password — gaya tema (sebelumnya inline di change_password.html;
   dipindah ke sini agar mode default tetap seperti desain asli yang hijau) */
body[data-theme="elite"] #vue-change-password .form-control {
  border-radius: 5px !important;
  backdrop-filter: blur(5px);
  background-color: rgba(0, 0, 0, 0.1) !important;
}
/* Ikon kiri (kunci/asterisk) digambar di bawah input yang ber-backdrop-blur;
   angkat ke atas input supaya tidak ikut terblur */
body[data-theme="elite"] #vue-change-password .form-custom.form-icon > i {
  z-index: 1;
}
body[data-theme="elite"] #vue-change-password .input-group-append {
  border-radius: 0 5px 5px 0 !important;
  background: var(--th-accent-grad, #924be1) !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
}
body[data-theme="elite"] #vue-change-password .input-group-append i {
  color: white !important;
}
body[data-theme="elite"] #vue-change-password a[onclick="DoChangePassword()"] {
  background: var(--th-accent-grad, #924be1) !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
}
/* Tombol toggle lihat/sembunyi password (eye) di modal SweetAlert (set/ubah
   password investor, dll.) — di mode tema pakai gradient tombol tema */
body[data-theme="elite"] .SwalBtn2.investor-button {
  background: var(--th-accent-grad, #924be1) !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
}
body[data-theme="elite"] .SwalBtn2.investor-button i {
  color: white !important;
}
/* Tombol sekunder "Kebali/Cancel" (div.submit-otp putih inline) — di mode
   tema jangan putih / abu-abu, buat transparan dengan teks aksen */
body[data-theme="elite"] div.submit-otp[style*="background-color: white"],
body[data-theme="elite"] div.submit-otp[style*="background: white"],
body[data-theme="elite"] div.submit-otp {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--th-accent, #A45CFF) !important;
  border: none !important;
  box-shadow: none !important;
}
/* Recharge Page Overrides */
body[data-theme="elite"] #recharge-now-page .color-black,
body[data-theme="elite"] #recharge-now-page [style*="color: black"] {
    color: white !important;
}
body[data-theme="elite"] #bep20_wallet {
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid rgba(146, 75, 225, 0.6) !important;
    color: white !important;
}
body[data-theme="elite"] #show-address-tutor-usdt {
    background-color: transparent !important;
    border: none !important;
    border-radius: 6px !important;
}
/* Profile Phone Verification Overrides */
body[data-theme="elite"] #bar-regis-phone .color-black {
    color: white !important;
}
/* intl-tel-input (Phone number country dropdown) Overrides */
body[data-theme="elite"] .iti__country-list {
    background-color: var(--th-surface, #1b182b) !important;
    border: 1px solid rgba(146, 75, 225, 0.5) !important;
    color: white !important;
}
body[data-theme="elite"] .iti__country-name,
body[data-theme="elite"] .iti__dial-code {
    color: white !important;
}
body[data-theme="elite"] .iti__country.iti__highlight,
body[data-theme="elite"] .iti__country:hover {
    background-color: rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] .iti__divider {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
/* --- HIJAU -> start.png (gaya button-start) --- */
body[data-theme="elite"] a[onclick="checkBnbFeeEnable()"],
body[data-theme="elite"] a[href="#fee-setting-buy-bnb-page"],
body[data-theme="elite"] button[style*="background-color: #36b693"],
body[data-theme="elite"] button[style*="background-color: rgb(54, 182, 147)"],
body[data-theme="elite"] button.color-green-dark,
body[data-theme="elite"] a.btn.color-green-dark,
body[data-theme="elite"] .btn-start-theme,
body[data-theme="elite"] .btn-trade-start,
body[data-theme="elite"] #strategy-start-theme,
body[data-theme="elite"] #set-amount-to-start-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, linear-gradient(135deg, #24c48d, #1a9e6f)) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  color: #ffffff !important;
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
}

body[data-theme="elite"] .modal button[id*="show-all"],
body[data-theme="elite"] #profit-show-all,
body[data-theme="elite"] #asset-show-all,
body[data-theme="elite"] #roi-show-all,
body[data-theme="elite"] #bonus-show-all {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-elit/start.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
}

/* Reset wrapper div if it contains button-pause */
body[data-theme="elite"] .btn-stop-theme:has(.btn-trade-pause),
body[data-theme="elite"] .btn-stop-theme:has(button-pause) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* --- MERAH -> stop.png (gaya button-stop) --- */
body[data-theme="elite"] button[style*="background-color: #f63c3c"],
body[data-theme="elite"] button[style*="background-color: rgb(246, 60, 60)"],
body[data-theme="elite"] button.color-red-dark,
body[data-theme="elite"] a.btn.color-red-dark,
body[data-theme="elite"] .btn-stop-theme,
/* `#strategy-stop-theme` DIKELUARKAN dari grup merah ini: elemennya
   memakai komponen <button-pause> (Pause / berhenti sementara), jadi warnanya
   harus kuning pause.png — hijau = Start, kuning = Pause, merah = Stop.
   Selector ber-ID di sini (1,1,1) mengalahkan `.btn-trade-pause` (0,2,1) dari
   grup kuning di bawah, sehingga tombol Pause di halaman Strategy selama ini
   tampil merah dan berbeda dari tombol Pause di coin_details.
   Nama id-nya sengaja dibiarkan (dipakai toggle .btn-trade-hidden di
   strategy.html). */
body[data-theme="elite"] .btn-trade-stop {
  background-color: transparent !important;
  background-image: var(--th-btn-stop-img, linear-gradient(135deg, #d84558, #a5303f)) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
}

/* --- KUNING -> pause.png (gaya button-pause) --- */
body[data-theme="elite"] .btn-pause-theme,
body[data-theme="elite"] .btn-trade-pause,
body[data-theme="elite"] button-pause,
body[data-theme="elite"] #strategy-pause-theme,
body[data-theme="elite"] button.color-yellow-dark,
body[data-theme="elite"] a.btn.color-yellow-dark {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-elit/pause.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 190, 90, 0.75) !important;
  box-shadow: 0 0 16px rgba(247, 160, 30, 0.65),
              inset 0 0 8px rgba(255, 210, 130, 0.25) !important;
  -webkit-text-stroke: 0.3px rgba(0, 0, 0, 0.3);
  paint-order: stroke fill;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}
/* =========================================================================
   FORM GLOBAL (tema non-default): semua <input>, <select>, <textarea>
   satu gaya — bg gelap + border ungu 1px. Checkbox/radio/range/button
   dikecualikan. Class .theme-input tersedia untuk pemakaian eksplisit.
   ========================================================================= */
body[data-theme="elite"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),
body[data-theme="elite"] select,
body[data-theme="elite"] textarea,
body[data-theme="elite"] .theme-input {
  border: 1px solid rgba(146, 75, 225, 0.6) !important;
  background-color: #1a113a !important;
  color: #f2effa !important;
}
/* Placeholder terbaca di gelap */
body[data-theme="elite"] input::placeholder,
body[data-theme="elite"] textarea::placeholder {
  color: #96929d !important; /* Text Secondary */
}
/* Fokus: border lebih terang + glow tipis */
body[data-theme="elite"] input:focus,
body[data-theme="elite"] select:focus,
body[data-theme="elite"] textarea:focus {
  border-color: rgba(164, 92, 255, 0.9) !important;
  box-shadow: 0 0 8px rgba(164, 92, 255, 0.35) !important;
  outline: none !important;
}
/* Addon input-group (mis. "Alamat", "BEP20") ikut satu gaya */
body[data-theme="elite"] .input-group-text {
  background: var(--th-accent-grad, #924be1) !important;
  border: 1px solid rgba(146, 75, 225, 0.6) !important;
  color: #ffffff !important;
}
/* Badge Buy/Force Buy (hijau) & Sell/Force Sell (merah) di riwayat
   transaksi -> banner force tema; match hex & serialisasi rgb() Vue */
body[data-theme="elite"] #vue-transaction-history span[style*="#33c48d"],
body[data-theme="elite"] #vue-transaction-history span[style*="51, 196, 141"] {
    background: var(--th-btn-force-buy-img, url("../../assets/orbit-elit/force-green.png")) no-repeat center / 100% 100% !important;
    color: #ffffff !important;
}
body[data-theme="elite"] #vue-transaction-history span[style*="#d5465b"],
body[data-theme="elite"] #vue-transaction-history span[style*="213, 70, 91"] {
    background: var(--th-btn-force-sell-img, url("../../assets/orbit-elit/force-red.png")) no-repeat center / 100% 100% !important;
    color: #ffffff !important;
}
/* Angka profit positif di riwayat transaksi (inline #36b693) -> hijau tema */
body[data-theme="elite"] #vue-transaction-history p[style*="#36b693"],
body[data-theme="elite"] #vue-transaction-history p[style*="54, 182, 147"] {
    color: var(--th-green, #4EBA5D) !important;
}
/* --- Beli & Batal Buttons for Fee Setting --- */
body[data-theme="elite"] #btn-buy-bnb-confirm {
  background-color: transparent !important;
  background-image: var(--th-btn-force-buy-img) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  color: #fff !important;
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65), inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
}
body[data-theme="elite"] #btn-buy-bnb-cancel {
  background-color: transparent !important;
  background-image: var(--th-btn-force-sell-img) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: cover !important;
  color: #fff !important;
  border: 1px solid rgba(230, 78, 98, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65), inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
}
/* =========================================================================
   SELECT DALAM WRAPPER (.myselect/.myselectasset .form-custom):
   border digambar oleh wrapper -> samakan ke gaya form standar.
   Select di dalamnya tetap tanpa border & transparan.
   ========================================================================= */
body[data-theme="elite"] .myselect.form-custom,
body[data-theme="elite"] .myselectasset.form-custom,
body[data-theme="elite"] .custom-ta .myselect.form-custom {
  border: 1px solid rgba(146, 75, 225, 0.6) !important;
  background-color: transparent !important;
}
body[data-theme="elite"] .myselect.form-custom select,
body[data-theme="elite"] .myselectasset.form-custom select,
body[data-theme="elite"] .custom-ta .myselect.form-custom select {
  border: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: #f2effa !important;
}
/* Stacking Contexts for Home Page & Trade Page (Themed) */
body[data-theme="elite"] #user-info-profile,
body[data-theme="elite"] #trade-page {
    position: relative !important;
    z-index: 1 !important;
}
body[data-theme="elite"] #trade-page .bg-binance-tick {
    background-color: transparent !important;
}
/* Home Page & Trade Page Background Video (Themed): Max Height 550px & Bottom Fade Overlay (Desktop only) */
@media (min-width: 768px) {
body[data-theme="elite"] #user-info-profile moonbot-bg,
body[data-theme="elite"] #trade-page moonbot-bg {
        position: absolute !important;
        top: 0px !important;
        left: 0px !important;
        width: 100% !important;
        height: 550px !important;
        max-height: 550px !important;
        overflow: hidden !important;
        display: block !important;
    }

/* Home Page z-index configuration */
body[data-theme="elite"] #user-info-profile moonbot-bg {
        z-index: 0 !important;
    }

/* Trade Page z-index configuration */
body[data-theme="elite"] #trade-page moonbot-bg {
        z-index: 0 !important;
    }

/* Elite Theme Top Fade using bg-4.png */
body[data-theme="elite"] #user-info-profile moonbot-bg::before,
body[data-theme="elite"] #trade-page moonbot-bg::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 160px;
        /* bg-4.png tidak pernah ada di repo (404) — pakai gradient fade setara */
        background: linear-gradient(to bottom, var(--th-bg, #01000E), transparent) !important;
        z-index: 1;
        pointer-events: none;
    }

body[data-theme="elite"] #user-info-profile .top-offset {
        height: 550px !important;
    }

}
/* Elite Theme: background.mp4 fades out at its bottom (home & trade) */
body[data-theme="elite"] #user-info-profile moonbot-bg video,
body[data-theme="elite"] #trade-page moonbot-bg video {
    -webkit-mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
}
/* Secondary Background Video (bg-3.mp4) for Elite Theme */
body[data-theme="elite"] .moonbot-bg-secondary-wrapper {
    position: absolute !important;
    left: 0px !important;
    width: 100% !important;
    z-index: -1 !important;
    pointer-events: none !important;
    overflow: hidden !important;
}
body[data-theme="elite"] .moonbot-bg-secondary-wrapper video {
    /* Tinggi dikunci ke viewport (bukan tinggi halaman) supaya crop/zoom
       object-fit: cover identik di semua halaman (home & trade) */
    width: 100% !important;
    height: 100vh !important;
    object-fit: cover !important;
    object-position: center top !important;
    display: block !important;
    /* bg-3.mp4 fade masuk dari atas, fade keluar di bawah */
    -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 160px, #000 calc(100% - 160px), transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0, #000 160px, #000 calc(100% - 160px), transparent 100%);
}
/* Mobile Layout: Hidden on Mobile */
@media (max-width: 767px) {
body[data-theme="elite"] .moonbot-bg-secondary-wrapper {
        display: none !important;
    }

}
/* Desktop Layout: satu video gabungan `background-dekstop.mp4` (1280x1110,
   planet + bg-3 + fade sudah di-bake di dalam video), jadi bg-3 terpisah
   dimatikan dan `moonbot-bg` mengikuti rasio video, bukan dikunci 550px. */
@media (min-width: 768px) {
body[data-theme="elite"] .moonbot-bg-secondary-wrapper {
        display: none !important;
    }

body[data-theme="elite"] #user-info-profile moonbot-bg,
body[data-theme="elite"] #trade-page moonbot-bg {
        /* Setinggi rasio video di lebar viewport, tapi tidak lebih tinggi
           dari halaman — elemen absolute ikut menentukan area scroll, jadi
           jangan sampai memaksa halaman pendek bisa di-scroll kosong. */
        height: min(calc(100vw * 1110 / 1280), 100%) !important;
        max-height: none !important;
    }

body[data-theme="elite"] #user-info-profile moonbot-bg video,
body[data-theme="elite"] #trade-page moonbot-bg video {
        /* Halaman pendek: potong dari bawah, bukan zoom */
        object-fit: cover !important;
        object-position: center top !important;
        /* Fade bawah sudah ada di dalam video */
        -webkit-mask-image: none !important;
        mask-image: none !important;
    }

}
/* =========================================================================
   GLOBAL CARD BACKGROUND (tema gelap)
   Semua card TANPA background image/video memakai background seragam ini.
   Card dengan bg image inline, bg url, atau berisi video/overlay dikecualikan.
   Rule per-halaman dengan selector ber-ID tetap menang bila ada.
   ========================================================================= */
body[data-theme="elite"] .card.card-style:not([style*="background-image"]):not([style*="background: url"]):not([style*="background:url"]):not(:has(> video)):not(:has(> .card-overlay)):not(.balance-card):not(.pt-2 > *):not(.bg-transparent):not([style*="background-color: transparent"]):not([style*="background: transparent"]) {
    background-color: rgba(10, 13, 24, 0.9) !important;
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* =========================================================================
   DYNAMIC THEME: RISK AWARENESS QUIZ (COIN GROUP QUESTIONNAIRE)
   ========================================================================= */
body[data-theme="elite"] .dialog-ovelay-2 .popUp {
    background-color: rgba(10, 13, 24, 0.9) !important;
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
    border-radius: 20px !important;
    overflow: hidden !important;
}
body[data-theme="elite"] #vue-coin-group-quisioner .header-container {
    background-image: var(--th-bg-api-ip) !important;
    background-size: cover !important;
    background-position: center !important;
}
/* Badan kuisioner. Base-nya `background-color: white`
   (coin-group-quisioner.html:30) dan di sini dulu dipaksa TRANSPARAN — padahal
   tidak ada satu pun lapisan di belakangnya yang berwarna: pembungkusnya
   `.content.announcment-content` tidak punya aturan background di tema mana
   pun, dan `.popUp` di markup ini bukan `.card.card-style` sehingga aturan
   pop-up biasa tidak mengenainya. Hasilnya halaman di belakang pop-up tembus
   dan teks pertanyaan bertumpuk dengan isi halaman.
   Diberi permukaan kartu tema yang OPAK; header di atasnya sudah punya
   background image sendiri, jadi keduanya menyatu jadi satu panel. */
body[data-theme="elite"] #vue-coin-group-quisioner .popup-container-coin-group {
    background-color: var(--th-surface, #070817) !important;
    background-image: none !important;
    color: var(--th-text) !important;
}
/* Reset dark/black inline colors for text inside the quiz */
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-description,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-description span,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-description li,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-container,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-container-step,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-question-list,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-question-list li,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-question-list strong,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner ol,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner li,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner strong,
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner label {
    color: var(--th-text, #f2effa) !important;
}
/* Scroll containers background override */
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(146, 75, 225, 0.2) !important;
}
/* Scroll bar styles for dark mode compatibility */
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner::-webkit-scrollbar {
    width: 6px;
}
body[data-theme="elite"] #vue-coin-group-quisioner .quiz-scroll-inner::-webkit-scrollbar-thumb {
    background-color: rgba(146, 75, 225, 0.4);
    border-radius: 3px;
}
/* Exit button style */
body[data-theme="elite"] #vue-coin-group-quisioner .exit-btn {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--th-text, #f2effa) !important;
    border: 1px solid var(--th-border) !important;
}
body[data-theme="elite"] #vue-coin-group-quisioner .exit-btn:hover {
    background-color: rgba(255, 255, 255, 0.2) !important;
}
/* Main action buttons (Let's get started / Next / Submit / Finish).
   Berbasis class (bukan [style*=...]) supaya tidak bergantung pada cara Vue
   menserialisasi inline style (hex vs rgb). */
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-button,
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-button-step,
body[data-theme="elite"] #vue-coin-group-quisioner button.responsive-button-back-next,
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-step3-container button {
    background: var(--th-accent-grad, #924be1) !important;
    color: white !important;
    border: none !important;
    box-shadow: 0 0 10px var(--th-shadow) !important;
}
/* Back button in quiz (secondary; inline background-color: white statis) —
   attribute selector di sini lebih spesifik dari rule dasar di atas */
body[data-theme="elite"] #vue-coin-group-quisioner button.responsive-button-back-next[style*="background-color: white"],
body[data-theme="elite"] #vue-coin-group-quisioner button.responsive-button-back-next[style*="background-color:white"] {
    background: transparent !important;
    color: var(--th-text, #ffffff) !important;
    border: 1px solid var(--th-border, rgba(255, 255, 255, 0.2)) !important;
}
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-button:disabled,
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-button-step:disabled,
body[data-theme="elite"] #vue-coin-group-quisioner button.responsive-button-back-next:disabled {
    background: rgba(255, 255, 255, 0.15) !important;
    color: rgba(255, 255, 255, 0.35) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
}
/* Layar hasil (Score + badan teks) — teks inline gelap #1a1a1a -> terang.
   Judul fail (merah #e53935) dan span aksen ungu dibiarkan apa adanya. */
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-score-title,
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-score-value,
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-result-title:not([style*="#e53935"]),
body[data-theme="elite"] #vue-coin-group-quisioner .responsive-result-description {
    color: var(--th-text, #f2effa) !important;
}
/* Progress bar wrapper background */
body[data-theme="elite"] #vue-coin-group-quisioner div[style*="background-color: #f3f3f3"],
body[data-theme="elite"] #vue-coin-group-quisioner div[style*="background-color:#f3f3f3"] {
    background-color: rgba(255, 255, 255, 0.1) !important;
}
/* Remove default margin of .content inside all themed popups so they fill the popup boundaries fully */
body[data-theme="elite"] .popUp .content {
    margin: 0px !important;
}
/* Regular card popups (e.g. change password) get padding back so inner spacing matches the default theme.
   Banner-style popups (.card-style-banner: rank/leaderboard, banner, tnc, area) stay full-bleed. */
body[data-theme="elite"] .popUp .card.card-style > .content {
    padding: 15px 15px 10px 15px !important;
}
/* Popup alamat penarikan: beri ruang kiri-kanan.
   (Tanpa text-align: center — itu menggeser ikon .form-icon ke tengah input;
   judul/subtitle sudah center dari class text-center masing-masing.) */
body[data-theme="elite"] .popUp #vue-insert-address,
body[data-theme="elite"] .popUp #vue-show-address,
body[data-theme="elite"] .popUp #vue-insert-phone,
body[data-theme="elite"] .popUp #vue-otp-verification {
    padding-left: 18px !important;
    padding-right: 18px !important;
    padding-bottom: 10px !important;
}
/* =========================================================================
   AREA & TNC POP-UP — container putih inline -> surface gelap bertema
   ========================================================================= */
body[data-theme="elite"] #vue-chose-area .popup-container,
body[data-theme="elite"] #vue-tnc-pop-up .popup-container {
    background-color: rgba(10, 13, 24, 0.95) !important;
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* Icon globe (area) & kertas legal (TNC): img mono -> gradient seperti icon
   lain. Bitmap asli diganti pixel transparan, bentuk icon dipakai sebagai
   mask, lalu diisi gradient. */
body[data-theme="elite"] #vue-chose-area .popup-container img[src*="country-64"],
body[data-theme="elite"] #vue-tnc-pop-up .popup-container img[src*="legal-paper-64"] {
    content: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");
    width: 50px !important;
    height: 50px !important;
    background: linear-gradient(180deg, #ffffff 0%, #2a7b9b 100%) !important;
    filter: none !important;
    border-radius: 0 !important;
}
body[data-theme="elite"] #vue-chose-area .popup-container img[src*="country-64"] {
    -webkit-mask: url("../../../images/pictures/country-64.png") center / contain no-repeat;
    mask: url("../../../images/pictures/country-64.png") center / contain no-repeat;
}
body[data-theme="elite"] #vue-tnc-pop-up .popup-container img[src*="legal-paper-64"] {
    -webkit-mask: url("../../../images/pictures/legal-paper-64.png") center / contain no-repeat;
    mask: url("../../../images/pictures/legal-paper-64.png") center / contain no-repeat;
}
/* Teks pertanyaan/subtitle (inline color: #000) */
body[data-theme="elite"] #vue-chose-area .popup-container p,
body[data-theme="elite"] #vue-tnc-pop-up .popup-container > div > p {
    color: var(--th-text, #E3E0EC) !important;
}
body[data-theme="elite"] #vue-tnc-pop-up .popup-container p[style*="font-size: 12px"] {
    color: var(--th-text-muted, #9897A2) !important;
}
/* Box scroll isi TNC (inline background putih, color hitam) -> panel gelap;
   match hex, keyword, DAN serialisasi rgb() Vue. Konten HTML dari backend
   dipaksa terang */
body[data-theme="elite"] #vue-tnc-pop-up .popup-container div[style*="background: #fff"],
body[data-theme="elite"] #vue-tnc-pop-up .popup-container div[style*="background: white"],
body[data-theme="elite"] #vue-tnc-pop-up .popup-container div[style*="background: rgb(255, 255, 255)"] {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(146, 75, 225, 0.2) !important;
    color: var(--th-text, #E3E0EC) !important;
}
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html,
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html * {
    color: var(--th-text, #E3E0EC) !important;
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html a {
    color: var(--th-accent-2, #A354E6) !important;
}
/* Judul section TNC (inline #8a4dff) tetap warna aksen, termasuk turunannya */
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html [style*="8a4dff"],
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html [style*="8a4dff"] *,
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html [style*="138, 77, 255"],
body[data-theme="elite"] #vue-tnc-pop-up #tnc-html [style*="138, 77, 255"] * {
    color: var(--th-accent-2, #A354E6) !important;
}
/* Tombol utama (Ya/Setuju, ungu hardcode) -> accent gradient tema */
body[data-theme="elite"] #vue-chose-area button[onclick="areYouCitizen(true)"],
body[data-theme="elite"] #vue-tnc-pop-up button[onclick="agreeTnc()"] {
    background: var(--th-accent-grad, #924be1) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: var(--th-btn-primary-shadow, none) !important;
}
/* Tombol "No": warna teal seperti default, tapi bergaya button primer tema
   (gradient halus + glow) */
body[data-theme="elite"] #vue-chose-area button[onclick="areYouCitizen(false)"] {
    background: linear-gradient(135deg, #2ed3d3, #1ba9a9) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 0 15px rgba(35, 197, 197, 0.7), inset 0 0 5px rgba(255, 255, 255, 0.3) !important;
}
/* Scrollbar isi TNC di mode gelap */
body[data-theme="elite"] #vue-tnc-pop-up .scroll-visible::-webkit-scrollbar-thumb {
    background-color: rgba(146, 75, 225, 0.4) !important;
}
/* Icon menu Moon Logic -> aset tema (orbit-elit/moonlogic.png),
   sedikit lebih besar dari icon default (35px) */
body[data-theme="elite"]  img[src*="moon-logic.png"] {
    content: url("../../assets/orbit-elit/moonlogic.png");
    width: 42px !important;
    height: 42px !important;
}
/* Countdown Timer Modal inside SweetAlert2 (Themed Overrides) */
body[data-theme="elite"] .swal2-popup #countdown-timer {
    color: var(--th-accent, #924be1) !important;
}
body[data-theme="elite"] .swal2-popup div[style*="color: #374151"],
body[data-theme="elite"] .swal2-popup div[style*="color:#374151"] {
    color: var(--th-text, #f2effa) !important;
}
body[data-theme="elite"] .swal2-popup div[style*="background-color: #f9fafb"],
body[data-theme="elite"] .swal2-popup div[style*="background-color:#f9fafb"] {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(146, 75, 225, 0.2) !important;
}
body[data-theme="elite"] .swal2-popup div[style*="color: #6b7280"],
body[data-theme="elite"] .swal2-popup div[style*="color:#6b7280"] {
    color: var(--th-text-muted, #898989) !important;
}
/* Upgrade Coupon Modal (.modal-create-note) Theming */
body[data-theme="elite"] .swal2-popup.modal-create-note {
    background-image: none !important;
    background-color: var(--th-surface) !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
    box-shadow: 0 0 20px var(--th-shadow),
                inset 0 0 20px 5px rgba(0, 0, 0, 0.65),
                inset 0 0 15px var(--th-border) !important;
}
body[data-theme="elite"] .swal2-popup.modal-create-note {
    background-image: none !important;
    background-color: rgba(10, 13, 24, 0.9) !important;
    border: 1px solid hsl(252 37% 37% / 1) !important;
    box-shadow: 0 0 7px rgba(146, 75, 225, 0.4), inset 6px 3px 30px 5px rgba(146, 84, 230, 0.14) !important;
}
/* Coupon Voucher punch-holes matching themed backgrounds */
body[data-theme="elite"] .swal2-popup.modal-create-note .voucher-border-left:before,
body[data-theme="elite"] .swal2-popup.modal-create-note .voucher-border-right:before {
    background: var(--th-surface, #1e1e2d) !important;
    border-color: var(--th-border) !important;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.5) !important;
}
body[data-theme="elite"] .swal2-popup.modal-create-note .voucher-border-left:before,
body[data-theme="elite"] .swal2-popup.modal-create-note .voucher-border-right:before {
    background: rgb(10, 13, 24) !important;
    border-color: hsl(252 37% 37% / 1) !important;
}
/* Input & Paste/Tempel Button inside the coupon modal — seragam dengan pola
   input-group bertema (withdrawal/ROI): box border aksen + glow, radius 8,
   tombol pakai accent gradient */
body[data-theme="elite"] .swal2-popup.modal-create-note #swal2-input-coupon {
    background-color: var(--th-surface-2, rgba(255, 255, 255, 0.05)) !important;
    color: var(--th-text, #ffffff) !important;
    border: 1px solid rgba(146, 75, 225, 0.6) !important;
    border-right: none !important;
    border-radius: 8px 0 0 8px !important;
    box-shadow: 0 0 10px rgba(146, 75, 225, 0.2) !important;
    height: 2.625em;
}
body[data-theme="elite"] .swal2-popup.modal-create-note #swal2-input-coupon::placeholder {
    color: var(--th-text-hint, rgba(255, 255, 255, 0.5)) !important;
}
body[data-theme="elite"] .swal2-popup.modal-create-note .pasteCoupon {
    background: var(--th-accent-grad, var(--th-accent)) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 0 8px 8px 0 !important;
    box-shadow: var(--th-btn-primary-shadow, 0 0 10px var(--th-shadow)) !important;
    height: 2.625em;
}
/* Main UI Upgrade Button Theming */
body[data-theme="elite"] .upgrade-button {
    background-color: var(--th-accent) !important;
    color: #fff !important;
}
body[data-theme="elite"] .upgrade-button {
    background: linear-gradient(135deg, #a73bf2, #7a22cc) !important;
    box-shadow: 0 0 8px rgba(167, 59, 242, 0.4) !important;
}
/* Custom SweetAlert Verification Buttons */
body[data-theme="elite"] .swal2-popup .btn-start-bg {
  background: var(--th-btn-start-img, url("../../assets/orbit-elit/start.png")) no-repeat center center !important;
  background-size: 100% 100% !important;
  color: white !important;
  border: none !important;
}
body[data-theme="elite"] .swal2-popup .btn-stop-bg {
  background: var(--th-btn-stop-img, url("../../assets/orbit-elit/stop.png")) no-repeat center center !important;
  background-size: 100% 100% !important;
  color: white !important;
  border: none !important;
}
/* Profile Email Confirmation Button */
body[data-theme="elite"] #send-email-confirmation-profile.gradient-green {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-elit/start.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
}
body[data-theme="elite"] #send-email-confirmation-profile.bg-yellow-dark {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-elit/pause.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: none !important;
}
/* Remove borders and shadows around the profit summary table content and cards */
body[data-theme="elite"]  #user-profit-summary .card.card-style,
body[data-theme="elite"]  #user-profit-summary .content,
body[data-theme="elite"]  #user-profit-summary .card {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}
/* Style text headers to use secondary text color and opacity inside profit summary */
body[data-theme="elite"]  #user-profit-summary .searchBar-container p {
    color: var(--th-text-muted) !important;
    opacity: 0.8 !important;
}

/* =========================================================================
   SAVING PAGE ACTION BUTTONS (Start, Stop, Edit, Cancel)
   Guard block di bawah untuk memastikan tidak ada aturan umum/offcanvas/utility
   (seperti .btn-investor-mode, button.bg-purple, button.color-red-dark)
   yang menimpa border glow, border-radius, maupun image button tema.
   ========================================================================= */
body[data-theme="elite"] #saving-page #start-saving,
body[data-theme="elite"] #user-saving #start-saving,
body[data-theme="elite"] #saving-setup #start-saving,
body[data-theme="elite"] #saving-page #set-amount-to-start-saving,
body[data-theme="elite"] #user-saving #set-amount-to-start-saving,
body[data-theme="elite"] #footer-bar-savings #set-amount-to-start-saving,
body[data-theme="elite"] #saving-stopped #set-amount-to-start-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-elit/start.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(78, 230, 175, 0.75) !important;
  box-shadow: 0 0 16px rgba(36, 196, 141, 0.65),
              inset 0 0 8px rgba(120, 255, 205, 0.25) !important;
  border-radius: 20px !important;
  height: 38px !important;
  font-weight: 700 !important;
}

body[data-theme="elite"] #saving-page #stop-saving,
body[data-theme="elite"] #user-saving #stop-saving,
body[data-theme="elite"] #footer-bar-savings #stop-saving,
body[data-theme="elite"] #saving-started #stop-saving,
body[data-theme="elite"] #saving-page #cancel-edit-amount,
body[data-theme="elite"] #user-saving #cancel-edit-amount,
body[data-theme="elite"] #saving-setup #cancel-edit-amount {
  background-color: transparent !important;
  background-image: var(--th-btn-stop-img, url("../../assets/orbit-elit/stop.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 110, 130, 0.75) !important;
  box-shadow: 0 0 16px rgba(216, 69, 88, 0.65),
              inset 0 0 8px rgba(255, 150, 165, 0.25) !important;
  border-radius: 20px !important;
  height: 38px !important;
  font-weight: 700 !important;
}

body[data-theme="elite"] #saving-page #saving-setting,
body[data-theme="elite"] #user-saving #saving-setting,
body[data-theme="elite"] #footer-bar-savings #saving-setting,
body[data-theme="elite"] #saving-started #saving-setting {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-elit/pause.png")) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% 100% !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 190, 90, 0.75) !important;
  box-shadow: 0 0 16px rgba(247, 160, 30, 0.65),
              inset 0 0 8px rgba(255, 210, 130, 0.25) !important;
  border-radius: 20px !important;
  height: 38px !important;
  font-weight: 700 !important;
}

/* "Contact Customer Care" di bawah form OTP ikut diputihkan oleh aturan pop-up
   umum (`.popUp .card.card-style a` -> --th-text), padahal itu tautan, bukan
   teks biasa — jadi tidak lagi terbaca sebagai sesuatu yang bisa diklik.
   Dikembalikan ke biru tautan aplikasi (.color-blue-light / #5d9cec), sama
   seperti tema black (black/theme.css:6259). */
body[data-theme="elite"] #otp-contact a,
body[data-theme="elite"] #vue-otp-verification #otp-contact a {
  color: #5d9cec !important;
}

/* =========================================================================
   INPUT-GROUP — SUDUT YANG MENEMPEL KE ADDON HARUS SIKU
   ========================================================================= */
/* Bootstrap sudah punya reset sudut untuk elemen bersebelahan di dalam
   `.input-group`, tapi aturan itu TIDAK pakai `!important` — sementara tema ini
   memasang `border-radius: ... !important` pada `.form-control`. Akibatnya
   input tetap membulat di sisi yang menempel ke addon dan muncul celah bulan
   sabit antara addon dan input (mis. #recommendation-total-invest yang
   didahului <span class="input-group-text">).

   Dua bentuk markup dipakai di app ini dan dua-duanya perlu disebut:
     - Bootstrap 5: addon jadi ANAK LANGSUNG .input-group
     - Bootstrap 4: addon dibungkus .input-group-prepend / .input-group-append
       (pembungkusnya yang jadi anak langsung, radius-nya ada di span di dalam)

   Pengecualian mengikuti daftar Bootstrap: dropdown menu & elemen feedback
   validasi memang tidak ikut menempel. */
body[data-theme="elite"] .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.invalid-tooltip):not(.valid-feedback):not(.invalid-feedback),
body[data-theme="elite"] .input-group-append > .input-group-text,
body[data-theme="elite"] .input-group-append > .btn {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
body[data-theme="elite"] .input-group > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.valid-tooltip):not(.invalid-tooltip):not(.valid-feedback):not(.invalid-feedback),
body[data-theme="elite"] .input-group-prepend > .input-group-text,
body[data-theme="elite"] .input-group-prepend > .btn {
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

/* =========================================================================
   MODAL — PERMUKAAN WAJIB OPAK
   -------------------------------------------------------------------------
   Semua pop-up melayang (`.popUp`, selalu berpasangan dengan `.bg-overlay`
   penuh layar; plus swal2 / .modal-content / .dialog-ovelay) TIDAK BOLEH
   tembus pandang: isi halaman di belakangnya ikut terbaca menembus panel.

   Drawer/offcanvas SENGAJA tidak ikut aturan ini — di sana permukaan glass
   memang dipakai supaya video latar tetap terlihat.

   Rantai `:not(...)` pada selector kartu disalin PERSIS dari blok
   "GLOBAL CARD BACKGROUND" di atas; itu satu-satunya cara menang dari rule
   tersebut (spesifisitasnya tinggi karena rantai :not). Kalau rantai di sana
   diubah, ubah juga di sini. Pengecualian yang sama tetap berlaku: kartu
   dengan background image/video atau yang sengaja dibuat transparan lewat
   inline style tidak disentuh.
   ========================================================================= */
body[data-theme="elite"] .popUp .card.card-style:not([style*="background-image"]):not([style*="background: url"]):not([style*="background:url"]):not(:has(> video)):not(:has(> .card-overlay)):not(.balance-card):not(.pt-2 > *):not(.bg-transparent):not([style*="background-color: transparent"]):not([style*="background: transparent"]) {
    background-color: #0a0d18 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
/* Sisanya sebelumnya beralpha 0.9 / 0.95 — warnanya dipertahankan, hanya
   alpha-nya dibuang supaya tidak ada lagi yang tembus. */
body[data-theme="elite"] .swal2-popup,
body[data-theme="elite"] .modal-content,
body[data-theme="elite"] .dialog-ovelay .dialog,
body[data-theme="elite"] .dialog-ovelay-2 .dialog,
body[data-theme="elite"] .dialog-ovelay-2 .popUp {
    background-color: #0a0d18 !important;
}
body[data-theme="elite"] #vue-chose-area .popup-container,
body[data-theme="elite"] #vue-tnc-pop-up .popup-container {
    background-color: #0a0d18 !important;
}




/* =========================================================================
   WITHDRAW HISTORY (#asset-page #tab-withdraw) — layout disamakan dengan galaxy
   (galaxy:2872-2907): baris tanpa bingkai/divider, teks putih terang dengan
   line-height lega (tanggal turun 2 baris rapi), header kolom terang.
   Warna tetap mengikuti token elite.
   ========================================================================= */
body[data-theme="elite"] #asset-page #tab-withdraw > .pt-1 > div {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
body[data-theme="elite"] #asset-page #tab-withdraw #tab-group-profit > .d-flex.py-1.my-1 {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body[data-theme="elite"] #asset-page #tab-withdraw .divider {
  display: none !important;
}
body[data-theme="elite"] #asset-page #tab-withdraw a.font-500 {
  color: var(--th-text) !important;
  -webkit-text-fill-color: var(--th-text) !important;
}
body[data-theme="elite"] #asset-page #tab-withdraw .d-flex.py-1.my-1 p.font-12,
body[data-theme="elite"] #asset-page #tab-withdraw .d-flex.py-1.my-1 h5.color-theme {
  color: var(--th-text) !important;
  -webkit-text-fill-color: var(--th-text) !important;
  opacity: 1 !important;
  line-height: 1.45 !important;
  margin-bottom: 0 !important;
}
body[data-theme="elite"] #asset-page #tab-withdraw .searchBar-container p {
  color: var(--th-text) !important;
  -webkit-text-fill-color: var(--th-text) !important;
  opacity: 0.9 !important;
}

/* CREDIT LIST (#asset-page #tab-credit) — sama dengan galaxy & Withdraw History
   di atas: wrapper, isi list, dan tiap baris tanpa background / bingkai / garis
   bawah. Separator bulan (.month-summary-separator) tidak ikut. */
body[data-theme="elite"] #asset-page #tab-credit > .pt-1 > div,
body[data-theme="elite"] #asset-page #tab-credit #tab-group-profit,
body[data-theme="elite"] #asset-page #tab-credit #tab-group-profit > .d-flex:not(.month-summary-separator) {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
body[data-theme="elite"] #asset-page #tab-credit .divider {
  display: none !important;
}

/* ASSET PAGE — panel list dipanjangkan sampai dasar layar.
   `.border-offset` (absolute, top:95%, tinggi 160px) menjorok keluar dari
   `.top-offset` dan menambah area scroll kosong di bawah kartu -> tampak pita
   video + hitam di bawah list. Strip itu disembunyikan, lalu rantai
   .top-offset > #user-asset > .pt-2 > .card dibuat flex supaya kartu mengisi
   sisa tinggi layar. Video dipatok fixed agar tetap menutup layar saat digulir. */
body[data-theme="elite"] #asset-page .border-offset {
  display: none !important;
}
body[data-theme="elite"] #asset-page #elite-bg-video {
  position: fixed !important;
  top: 0; left: 0;
  width: 100%; max-width: 450px;
  height: 100vh;
}
body[data-theme="elite"] #asset-page > .top-offset {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-theme="elite"] #asset-page #user-asset,
body[data-theme="elite"] #asset-page #user-asset > .pt-2 {
  flex: 1 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-theme="elite"] #asset-page #user-asset > .pt-2 > .card.card-style {
  flex: 1 0 auto !important;
  margin-bottom: 0 !important;
}

/* =========================================================================
   TABLE HEADER SEPARATOR (semua tabel di drawer/offcanvas)
   Header kolom `.searchBar-container` yang diikuti `.divider.mt-0.mb-1`
   (Withdraw History, Cashback, Profit, Credit, Orbit Jackpot, dst) diberi
   garis bawah warna tema — pola yang sama dengan Withdraw History di black.
   `.divider` hitam bawaannya disembunyikan supaya garisnya tidak dobel.
   ========================================================================= */
body[data-theme="elite"] .offcanvas .searchBar-container:has(+ .divider.mt-0.mb-1) {
  border-bottom: 1px solid rgba(164, 92, 255, 0.4) !important;
  border-radius: 0 !important;
  margin-bottom: 4px !important;
}
body[data-theme="elite"] .offcanvas .searchBar-container + .divider.mt-0.mb-1 {
  display: none !important;
}

/* =========================================================================
   CASHBACK — KARTU SUMMARY (Total Cashback & Tersedia/Diklaim)
   Disamakan dengan kartu utama Profit/Credit (elit:846): semi transparan + blur,
   bukan transparan penuh. Dipilih lewat class `.bonus-summary-card` (bonus.html),
   BUKAN lewat [style*=...]: Vue 2 menulis ulang inline style statis, sehingga
   `rgba(255, 255, 255, 1)` di HTML berubah jadi `rgb(255, 255, 255)` di DOM.
   Selector ini (2 ID + 3 atribut/kelas) lebih spesifik dari aturan `#bonus-page
   [style*=...]` / `#bonus-page .content:not(:has(...))` yang menimpanya.
   ========================================================================= */
body[data-theme="elite"] #bonus-page #user-bonus .content.bonus-summary-card {
  background-color: rgba(15, 10, 33, 0.5) !important;
  border: 1px solid rgba(146, 75, 225, 0.8) !important;
  box-shadow: 0 0 15px rgba(146, 75, 225, 0.5) !important;
  backdrop-filter: blur(5px);
  -webkit-backdrop-filter: blur(5px);
}