/* =========================================================================
   theme.css — GALAXY 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.
   ========================================================================= */

/* =========================================================================
   2) GALAXY — Silver / Dark Futuristic Theme
   ========================================================================= */
body[data-theme="galaxy"] {
  /* ---- BACKGROUND & EFFECT ---- */
  --th-bg:                  #050708;               /* Background Utama */
  --th-surface:             #121416;               /* Background Card */
  --th-surface-2:           #25282B;               /* Background Card Highlight */
  --th-surface-glass:       rgba(18, 20, 22, 0.72);/* Background Card + transparansi & blur */
  --th-divider:             rgba(77, 80, 84, 0.5); /* Divider #4D5054 opacity 40-55% */

  /* ---- TEXT ---- */
  --th-text:                #F4F4F5;               /* Text Utama */
  --th-text-white:          #FFFFFF;               /* Text Putih Netral */
  --th-text-secondary:      #C5C4C7;               /* Text Sekunder */
  --th-text-muted:          #9C9BA0;               /* Text Muted */
  --th-text-hint:           #68696D;               /* Text Disabled */

  /* ---- SILVER & ACCENT ---- */
  --th-accent:              #D9DBDE;               /* Accent Silver */
  --th-accent-2:            #C9CACE;               /* Text Silver */
  --th-silver-highlight:    #FFFFFF;               /* Titik highlight & pantulan paling terang */
  --th-border-silver-1:     #F7F8F8;               /* Border Silver 1 */
  --th-border-silver-2:     #989BA0;               /* Border Silver 2 */
  --th-border-silver-grad:  linear-gradient(135deg, #F7F8F8, #989BA0);
  --th-accent-grad:         radial-gradient(ellipse 80% 70% at 50% 50%, #3a3d43 0%, #484b52 28%, #62656d 52%, #86898f 74%, #b8babf 88%, #ecedec 100%);

  /* Border Silver Glow #E9EBED digabung dengan transparansi */
  --th-border:              rgba(233, 235, 237, 0.45);
  --th-border-solid:        #E9EBED;
  --th-border-glow:         rgba(233, 235, 237, 0.55);
  --th-shadow:              0 0 12px rgba(233, 235, 237, 0.25);

  /* ---- HEADER ---- */
  --th-header-bg:           #050708;
  --th-header-solid-bg:     #050708;
  --th-header-silver:       #EEF0F2;               /* Header Silver / Glow */
  --th-header-white:        #FFFFFF;               /* Header White */
  --th-header-bg-img:       url("../../assets/bg-galaxy.jpg");

  /* ---- STATUS & SECONDARY ACCENT ---- */
  --th-status-positive:     #4ED58B;               /* Positive Green */
  --th-status-negative:     #FF5664;               /* Negative Red */
  --th-status-info:         #35D5D8;               /* Info Cyan */
  --th-status-warning:      #F8C400;               /* Warning Gold */

  --th-btn-start-img:       url("../../assets/orbit-galaxy/start.png");
  --th-btn-stop-img:        url("../../assets/orbit-galaxy/stop.png");
  --th-btn-pause-img:       url("../../assets/orbit-galaxy/pause.png");
  --th-logo:                none;
  --th-bg-api-ip:           url("../../assets/orbit-galaxy/bg-pg-api-1.png");
  --th-bg-api-btn:          url("../../assets/orbit-galaxy/bg-pg-api-3.png?v=2");
  --th-bg-api-status:       url("../../assets/orbit-galaxy/bg-pg-api-2.png?v=2");

  /* ---- ICON FILTER (#A9ABAE → #F5F6F7) ---- */
  --th-icon-filter:         brightness(0) saturate(100%) invert(90%) sepia(2%) saturate(225%) hue-rotate(187deg) brightness(98%) contrast(92%);
  --th-icon-filter-light:   brightness(0) saturate(100%) invert(98%) sepia(1%) saturate(542%) hue-rotate(188deg) brightness(103%) contrast(96%);
}
/* =========================================================================
   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="galaxy"] {
  background-color: var(--th-bg) !important;
}
/* Elite, Galaxy, Black: video background — matikan image agar tidak overlap */
body[data-theme="galaxy"] .top-offset:not(#capture),
body[data-theme="galaxy"] .gradient-purple {
  background-image: none !important;
  background-color: transparent !important;
}
body[data-theme="galaxy"] .elite-video-bg,
body[data-theme="galaxy"] #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="galaxy"] #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="galaxy"] #coin-setting .bg-theme {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.50)) !important;
}
/* ---- 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="galaxy"] {
  background-color: var(--th-bg) !important;
}
body[data-theme="galaxy"] .bg-theme {
  background-color: var(--th-surface) !important;
}
body[data-theme="galaxy"] .card {
  border-color: var(--th-border) !important;
  box-shadow: var(--th-shadow) !important;
}
/* --- Aksen: menimpa sistem 'highlight' bawaan template (SEMUA tema) --- */
body[data-theme="galaxy"] .color-highlight {
  color: var(--th-accent) !important;
}
body[data-theme="galaxy"] .bg-highlight {
  background-color: var(--th-accent) !important;
}
body[data-theme="galaxy"] .border-highlight {
  border-color: var(--th-accent) !important;
}
body[data-theme="galaxy"] .gradient-highlight {
  background-image: var(--th-accent-grad) !important;
}
/* Footer-bar nav aktif (mengikuti pola styles/highlights/*.css) */
body[data-theme="galaxy"] .footer-bar-1 .active-nav i,
body[data-theme="galaxy"] .footer-bar-1 .active-nav span {
  background: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
  font-weight: 600 !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="galaxy"] .icon > img,
body[data-theme="galaxy"] .icon-highlight img,
body[data-theme="galaxy"] .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="galaxy"] .orbit-icon,
body[data-theme="galaxy"] img[src*="theme-engine/assets/orbit-"],
/* Quick-action Home (Konfigurasi API, Kredit, Keuntungan, Tanya Jawab):
   tampilkan gambar asli tanpa di-tint ungu. */
body[data-theme="galaxy"] .icon > img,
body[data-theme="galaxy"] .icon-highlight img,
body[data-theme="galaxy"] #quick-action-fee,
body[data-theme="galaxy"] #quick-action-fee2 {
  filter: none !important;
}
/* CSS explicit asset assignment for menu quick action icons in Galaxy theme */
body[data-theme="galaxy"] #quick-action-api,
body[data-theme="galaxy"] .quick-action-api {
  content: url("../../assets/orbit-galaxy/api-configuration.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-credit {
  content: url("../../assets/orbit-galaxy/credit.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-profit {
  content: url("../../assets/orbit-galaxy/profit.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-faq {
  content: url("../../assets/orbit-galaxy/faq.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-saving {
  content: url("../../assets/orbit-galaxy/saving.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-bonus {
  content: url("../../assets/orbit-galaxy/cashback.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-strategy {
  content: url("../../assets/orbit-galaxy/moonbot-rocket.png") !important;
  filter: none !important;
}
body[data-theme="galaxy"] #quick-action-fee,
body[data-theme="galaxy"] #quick-action-fee2 {
  content: url("../../assets/orbit-galaxy/bnb-fee.png") !important;
  filter: none !important;
}

/* Quick Action Home reset agar tidak terpengaruh style tombol atau flex container */
body[data-theme="galaxy"] #quick-action-card .icon,
body[data-theme="galaxy"] #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="galaxy"] .sort-trade-header {
  border-top: 1px solid var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
  border-bottom: 1px solid var(--th-divider, rgba(77, 80, 84, 0.5)) !important;

}
/* Sorting bar (Trade): transparan saat di atas, gelap saat list di-scroll */
body[data-theme="galaxy"] #sorting-bar {
  background: transparent !important;
  transition: background-color 0.25s ease;
}
body[data-theme="galaxy"] #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="galaxy"] #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="galaxy"] #trade-page .page-content {
  min-height: 0 !important;
  height: 100vh !important;
  padding-bottom: 0 !important;
  overflow: hidden !important;
}
body[data-theme="galaxy"] #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="galaxy"] .coin-status:has(> .coin-status-dot[style*="#d5465b"]) .font-11,
body[data-theme="galaxy"] .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, */
/* Nav bawah (Home, Trade, dll.): non-aktif = lebih terang & jelas terbaca, aktif = glowing silver/white */
body[data-theme="galaxy"] #footer-bar a {
  transition: all 0.2s ease-in-out !important;
}

body[data-theme="galaxy"] #footer-bar a:not(.active-nav) i,
body[data-theme="galaxy"] #footer-bar a:not(.active-nav) span {
  background: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: rgba(255, 255, 255, 0.55) !important;
  color: rgba(255, 255, 255, 0.55) !important;
  font-weight: 500 !important;
  opacity: 0.75 !important;
}

body[data-theme="galaxy"] #footer-bar a:hover:not(.active-nav) i,
body[data-theme="galaxy"] #footer-bar a:hover:not(.active-nav) span {
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
  opacity: 1 !important;
}

body[data-theme="galaxy"] #footer-bar .active-nav i,
body[data-theme="galaxy"] #footer-bar .active-nav span {
  background: none !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  opacity: 1 !important;
  text-shadow: 0 0 4px rgba(255, 255, 255, 0.35) !important;
}

/* Nav bawah: icon Home & Trade -> aset tema (orbit-galaxy/home.png & trade.png) */
body[data-theme="galaxy"] #footer-bar .bi-house-fill::before,
body[data-theme="galaxy"] #footer-bar .bi-graph-up::before {
  content: "" !important;
  display: inline-block;
  width: 20px;
  height: 20px;
  background: url("../../assets/orbit-galaxy/home.png") center / contain no-repeat;
  vertical-align: middle;
  transition: all 0.2s ease-in-out !important;
}
body[data-theme="galaxy"] #footer-bar .bi-graph-up::before {
  background-image: url("../../assets/orbit-galaxy/trade.png");
}

/* State Aktif: Terang berkilau (glow lembut/halus) */
body[data-theme="galaxy"] #footer-bar .active-nav .bi-house-fill::before,
body[data-theme="galaxy"] #footer-bar .active-nav .bi-graph-up::before {
  filter: brightness(1.15) drop-shadow(0 0 3px rgba(255, 255, 255, 0.45)) !important;
  opacity: 1 !important;
}

/* State Non-Aktif: Sedikit lebih redup, tetap jelas terlihat */
body[data-theme="galaxy"] #footer-bar a:not(.active-nav) .bi-house-fill::before,
body[data-theme="galaxy"] #footer-bar a:not(.active-nav) .bi-graph-up::before {
  filter: grayscale(1) brightness(1.05) !important;
  opacity: 0.6 !important;
}

body[data-theme="galaxy"] #footer-bar a:hover:not(.active-nav) .bi-house-fill::before,
body[data-theme="galaxy"] #footer-bar a:hover:not(.active-nav) .bi-graph-up::before {
  filter: grayscale(0.4) brightness(1.4) !important;
  opacity: 0.95 !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="galaxy"] #legal-modal .toggle-arrow {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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;
}
/* Floating Certificates (Galaxy Theme - Cosmic Metallic Glass Capsule) */
body[data-theme="galaxy"] .floating-certificates {
  background: linear-gradient(180deg, rgba(38, 42, 48, 0.9) 0%, rgba(18, 20, 24, 0.95) 100%) !important;
  border: 1px solid rgba(233, 235, 237, 0.6) !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6), 0 0 10px rgba(233, 235, 237, 0.25) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border-radius: 50px !important;
}
body[data-theme="galaxy"] .floating-certificates .my-floating-certificates {
  color: #F4F4F5 !important;
  font-weight: 500 !important;
}
body[data-theme="galaxy"] .floating-certificates .badge.text-bg-danger {
  background: linear-gradient(135deg, #c91836 0%, #870b20 100%) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  font-weight: 600 !important;
  box-shadow: 0 0 6px rgba(201, 24, 54, 0.4) !important;
}
body[data-theme="galaxy"] .floating-certificates span[onclick="CloseCertificate()"] {
  background-color: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3) !important;
}
body[data-theme="galaxy"] .floating-certificates span[onclick="CloseCertificate()"] i,
body[data-theme="galaxy"] span[onclick="CloseCertificate()"] i {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
  background: none !important;
}
/* Icon header (gear/help/refresh/bell) ikut warna teks tema biar terbaca. */
body[data-theme="galaxy"] .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="galaxy"] .menu i,
body[data-theme="galaxy"] .list-group i,
body[data-theme="galaxy"] .theme-icon i,
body[data-theme="galaxy"] .color-highlight i {
  color: var(--th-accent) !important;
}
/* Pengaman: jangan ubah icon status berwarna (sukses/gagal/peringatan). */
body[data-theme="galaxy"] .text-success,
body[data-theme="galaxy"] .text-danger,
body[data-theme="galaxy"] .text-warning,
body[data-theme="galaxy"] .color-green,
body[data-theme="galaxy"] .color-red,
body[data-theme="galaxy"] .color-yellow {
  filter: none !important;
}
/* Navigation menu themes support */
body[data-theme="galaxy"] .nav-container {
  background-color: var(--th-surface-2) !important;
  border-left: 1px solid var(--th-divider);
  box-shadow: 0 0 12px rgba(233, 235, 237, 0.15);
}
body[data-theme="galaxy"] .nav a {
  color: var(--th-text) !important;
}
/* border-offset (background di bawah header) -> ikut tema, bukan putih hardcoded */
body[data-theme="galaxy"] .border-offset {
  background-color: transparent !important;
}
/* Dropdown exchange selector (.select_wrap) — Metallic Silver Gradient Border */
body[data-theme="galaxy"] .select_wrap .default_option {
  position: relative !important;
  background-color: var(--th-surface, #121416) !important;
  background-image: 
    linear-gradient(#121416, #121416),
    linear-gradient(135deg, #FFFFFF 0%, #D9DBDE 20%, #8A8D93 45%, rgba(104, 105, 109, 0.25) 65%, #C5C4C7 85%, #FFFFFF 100%) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  border: 1.5px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5), 0 0 10px rgba(255, 255, 255, 0.1) !important;
  color: var(--th-text, #FFFFFF) !important;
}
body[data-theme="galaxy"] .select_wrap .default_option p {
  color: var(--th-text, #FFFFFF) !important;
  font-weight: 500 !important;
}
body[data-theme="galaxy"] .select_wrap .default_option::before {
  border-color: transparent transparent #FFFFFF #FFFFFF !important;
}
body[data-theme="galaxy"] .select_wrap .select_ul {
  position: absolute !important;
  background-color: var(--th-surface, #121416) !important;
  background-image: 
    linear-gradient(#121416, #121416),
    linear-gradient(135deg, #FFFFFF 0%, #D9DBDE 20%, #8A8D93 45%, rgba(104, 105, 109, 0.25) 65%, #C5C4C7 85%, #FFFFFF 100%) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  border: 1.5px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.7), 0 0 12px rgba(255, 255, 255, 0.12) !important;
  overflow: hidden !important;
}
body[data-theme="galaxy"] .select_wrap .select_ul li {
  background-color: transparent !important;
  color: var(--th-text, #FFFFFF) !important;
}
body[data-theme="galaxy"] .select_wrap .select_ul li p {
  color: var(--th-text, #FFFFFF) !important;
  font-weight: 500 !important;
}
body[data-theme="galaxy"] .select_wrap .select_ul li:hover {
  background-color: var(--th-surface-2, rgba(255, 255, 255, 0.1)) !important;
}
body[data-theme="galaxy"] .select_wrap .divider {
  background-color: var(--th-border, rgba(233, 235, 237, 0.2)) !important;
}
/* "Isi Ulang Sekarang" — Vivid Emerald Green (kontras tinggi di background gelap maupun terang) */
body[data-theme="galaxy"] .recharge-now-link {
  color: #00C076 !important;
  font-weight: 700 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.9), 0 0 4px rgba(0, 0, 0, 0.6) !important;
}
/* =========================================================================
   7) BALANCE CARD — kartu USDT + Coin Asset + Trading Volume
   ========================================================================= */
/* Background card — Galaxy: glassmorphic surface + subtle clean shadow */
body[data-theme="galaxy"] .balance-card {
  position: relative !important;
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  filter: none !important;
}

/* Galaxy: Animated rotating metallic silver shine gradient border */
body[data-theme="galaxy"] .balance-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 16px !important;
  padding: 1.5px !important;
  background: conic-gradient(
      from var(--glow-angle, 0deg),
      #FFFFFF 0%,
      #D9DBDE 18%,
      #68696D 38%,
      rgba(18, 20, 22, 0.1) 50%,
      #68696D 62%,
      #D9DBDE 82%,
      #FFFFFF 100%
    ) !important;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0) !important;
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0) !important;
  -webkit-mask-composite: xor !important;
  mask-composite: exclude !important;
  pointer-events: none !important;
  z-index: 1 !important;
  animation: spin-border-pulse 4s linear infinite !important;
}

/* Style for the inner shadow inside the balance card */
body[data-theme="galaxy"] .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: inset 0 0 14px rgba(0, 0, 0, 0.5) !important;
  pointer-events: none !important;
  display: block !important;
  background: transparent !important;
  z-index: 2 !important;
}

/* Make wallet balance transparent */
body[data-theme="galaxy"] .balance-card .wallet-balance {
  background-color: transparent !important;
}

/* Teks nilai utama (h4) */
body[data-theme="galaxy"] .balance-card h4 {
  color: var(--th-text-white, #FFFFFF) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.2) !important;
}

/* Label (h6 USDT, Coin Asset) — Pure Silver */
body[data-theme="galaxy"] .balance-card h6 {
  color: #D9DBDE !important;
  opacity: 1 !important;
  font-weight: 600 !important;
  letter-spacing: 0.5px !important;
  font-size: 12px !important;
}

/* Icon info circle & question circle — Pure Silver */
body[data-theme="galaxy"] .balance-card .bi-info-circle-fill,
body[data-theme="galaxy"] .bi-info-circle-fill,
body[data-theme="galaxy"] .bi-question-circle-fill,
body[data-theme="galaxy"] .bi-question-circle,
body[data-theme="galaxy"] i.bi-question-circle-fill,
body[data-theme="galaxy"] i.bi-question-circle-fill.color-theme,
body[data-theme="galaxy"] a i.bi-question-circle-fill,
body[data-theme="galaxy"] #recharge-tutor i.bi-question-circle-fill,
body[data-theme="galaxy"] .color-theme.bi-question-circle-fill {
  color: #D9DBDE !important;
  -webkit-text-fill-color: #D9DBDE !important;
  opacity: 0.9 !important;
}

/* Icon copy (clipboard) — inline style="color: black" (mis. tombol copy
   alamat withdrawal) jadi ilang di atas surface gelap. */
body[data-theme="galaxy"] .bi-clipboard {
  color: var(--th-text) !important;
}

/* Refresh button — Original (biarkan asli tanpa ditimpa warna) */
body[data-theme="galaxy"] .balance-card .refreshBtn-home,
body[data-theme="galaxy"] .refreshBtn-home {
  filter: none !important;
}

/* 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="galaxy"] input.key,
body[data-theme="galaxy"] .key input,
body[data-theme="galaxy"] .key input:focus,
body[data-theme="galaxy"] input.key:focus,
body[data-theme="galaxy"] #copy_wd_address,
body[data-theme="galaxy"] #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="galaxy"] div.key,
body[data-theme="galaxy"] .form-custom:has(#otp-address) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Teks Trading Volume row */
body[data-theme="galaxy"] .balance-card .font-12,
body[data-theme="galaxy"] .balance-card .font-13 {
  color: var(--th-text-secondary, #C5C4C7) !important;
}

/* Nilai Trading Volume (color-theme link) — Pure Silver Glow */
body[data-theme="galaxy"] .balance-card .color-theme {
  color: #FFFFFF !important;
  font-weight: 600 !important;
  text-shadow: 0 0 8px rgba(233, 235, 237, 0.4) !important;
}

/* HR pemisah horizontal */
body[data-theme="galaxy"] .balance-card hr {
  border-color: rgba(233, 235, 237, 0.2) !important;
  opacity: 1 !important;
}

/* Pemisah vertikal USDT | Coin Asset */
body[data-theme="galaxy"] .balance-card .v-divider,
body[data-theme="galaxy"] .balance-card .content > div:not(.wallet-balance) {
  background-color: rgba(233, 235, 237, 0.25) !important;
  opacity: 1 !important;
}
/* =========================================================================
   8) PROFILE INFO CARD — Telepon, Tingkat Bintang, Alamat Penarikan, Voucher Plan
   ========================================================================= */
/* Card background dark themes - Galaxy: dark surface + animated metallic silver shine border */
body[data-theme="galaxy"] .profile-info-card {
  position: relative !important;
  background-color: var(--th-surface, #121416) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  overflow: hidden !important;
}

body[data-theme="galaxy"] .profile-info-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  border-radius: 16px !important;
  padding: 1.5px !important;
  background: linear-gradient(
      135deg,
      #FFFFFF 0%,
      #D9DBDE 20%,
      #8A8D93 45%,
      rgba(104, 105, 109, 0.25) 65%,
      #C5C4C7 85%,
      #FFFFFF 100%
    ) !important;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0) !important;
  mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0) !important;
  -webkit-mask-composite: xor !important;
  mask-composite: exclude !important;
  pointer-events: none !important;
  z-index: 1 !important;
  animation: none !important;
}

body[data-theme="galaxy"] .profile-info-card > .content,
body[data-theme="galaxy"] .profile-info-card .content {
  position: relative !important;
  z-index: 2 !important;
  background: transparent !important;
}
/* Label kiri (h5.font-13): abu-abu --th-text-muted */
body[data-theme="galaxy"] .profile-info-card h5 {
  color: var(--th-text-muted) !important;
}
/* Nilai kanan (h4): teks terang (kecuali teks status hijau) */
body[data-theme="galaxy"] .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="galaxy"] .profile-info-card h4 span {
  opacity: 1 !important;
}
/* Divider pemisah antar baris */
body[data-theme="galaxy"] .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="galaxy"] .profile-info-card .color-black {
  color: var(--th-text) !important;
}
/* Profile info card icons (Star Level, Verified Check, Tooltip, Telegram) — pastikan tidak gepeng / garis */
body[data-theme="galaxy"] .profile-info-card i,
body[data-theme="galaxy"] .profile-info-card .fa,
body[data-theme="galaxy"] .profile-info-card .fas,
body[data-theme="galaxy"] .profile-info-card .bi {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: initial !important;
  display: inline-block !important;
  filter: none !important;
  height: auto !important;
  line-height: inherit !important;
  vertical-align: middle !important;
}
body[data-theme="galaxy"] .profile-info-card .fa-star {
  color: #ffc83d !important;
  -webkit-text-fill-color: #ffc83d !important;
}
body[data-theme="galaxy"] .profile-info-card .fa-check-circle {
  color: #47a5f2 !important;
  -webkit-text-fill-color: #47a5f2 !important;
}
body[data-theme="galaxy"] .profile-info-card img,
body[data-theme="galaxy"] .profile-info-card img[src*="telegram"] {
  width: 35px !important;
  height: 35px !important;
  min-width: 35px !important;
  min-height: 35px !important;
  max-width: 35px !important;
  max-height: 35px !important;
  object-fit: contain !important;
  aspect-ratio: 1 / 1 !important;
  flex-shrink: 0 !important;
}
/* Fix inline color: black for dark themes in Profit Page */
body[data-theme="galaxy"] .profit-top-card [style*="color: black"],
body[data-theme="galaxy"] .profit-list-card [style*="color: black"] {
  color: var(--th-text) !important;
}
/* Fix backgrounds for black & galaxy themes */
body[data-theme="galaxy"] .profit-top-card,
body[data-theme="galaxy"] .profit-list-card {
  background-color: var(--th-surface) !important;
  border: 1px solid var(--th-border) !important;
}
body[data-theme="galaxy"] .profit-list-card {
  margin: 0 !important;
}
body[data-theme="galaxy"] .profit-list-card .bg-theme {
  background-color: var(--th-surface) !important;
}
body[data-theme="galaxy"] .profit-summary-row {
  background-color: var(--th-surface) !important;
  border: 1px solid var(--th-border) !important;
}
/* =========================================================================
   6) TRADE PAGE HEADER STYLES (Elite, Galaxy, Black)
   ========================================================================= */
body[data-theme="galaxy"] .top-sort {
  position: relative !important;
  z-index: 1 !important;
}
/* =========================================================================
   TRADE PAGE — Galaxy Cosmic Glass & Metallic Silver Styling
   ========================================================================= */
/* Search Bar Container & Glass Capsule Input */
body[data-theme="galaxy"] #trade-page .searchBar-container:not(.sort-content-tabel) {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

body[data-theme="galaxy"] #trade-page .searchBar-container form#search_form,
body[data-theme="galaxy"] #trade-page .searchBar-content {
  background: rgba(18, 20, 26, 0.45) !important;
  background-color: rgba(18, 20, 26, 0.45) !important;
  border-radius: 30px !important;
  border: 0.5px solid rgba(255, 255, 255, 0.35) !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.4),
    0 0 8px rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: blur(15px) !important;
  -webkit-backdrop-filter: blur(15px) !important;
  display: flex !important;
  align-items: center !important;
  height: 38px !important;
  overflow: hidden !important;
}

body[data-theme="galaxy"] #trade-page .searchBar-content .searchBar,
body[data-theme="galaxy"] #trade-page input#filter_coin {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  color: #FFFFFF !important;
  font-size: 14px !important;
  height: 100% !important;
}

body[data-theme="galaxy"] #trade-page .searchBar-content .searchBar::placeholder,
body[data-theme="galaxy"] #trade-page input#filter_coin::placeholder {
  color: #A0A3A8 !important;
}

body[data-theme="galaxy"] #trade-page .searchBar-content i,
body[data-theme="galaxy"] #trade-page #search_form i,
body[data-theme="galaxy"] .bi-filter,
body[data-theme="galaxy"] .bi-funnel,
body[data-theme="galaxy"] .bi-funnel-fill,
body[data-theme="galaxy"] [class*="filter"]:not(.filter-box) i:not(.bi-question-circle-fill):not(.bi-info-circle-fill):not(.fa-calendar):not(.bi-calendar) {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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;
}

/* Calendar icon (Credit, Profit, Cashback, Profit Summary) -> Solid White samakan dengan Credit */
body[data-theme="galaxy"] .fa-calendar,
body[data-theme="galaxy"] .bi-calendar,
body[data-theme="galaxy"] .filter-box i,
body[data-theme="galaxy"] #asset-page .filter-box i,
body[data-theme="galaxy"] #profit-page .filter-box i,
body[data-theme="galaxy"] #bonus-page .filter-box i,
body[data-theme="galaxy"] #profit-summary .filter-box i {
  background: none !important;
  -webkit-background-clip: unset !important;
  background-clip: unset !important;
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
  display: inline-block !important;
  opacity: 1 !important;
}

body[data-theme="galaxy"] #trade-page .searchBar-content .cancelBtn,
body[data-theme="galaxy"] #trade-page .searchBar-content input.cancelSearch {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  color: #FFFFFF !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  padding: 0 10px 0 0 !important;
}

/* Inactive Sort Buttons (Price, Change, Profit) */
body[data-theme="galaxy"] .sort-content button:not([style*="924be1"]):not([style*="background-color: rgb(146, 75, 225)"]) {
  background-color: rgba(18, 20, 22, 0.8) !important;
  color: #F4F4F5 !important;
  border: 1px solid rgba(233, 235, 237, 0.35) !important;
  border-radius: 1rem !important;
  box-shadow: none !important;
}
body[data-theme="galaxy"] .sort-content button:not([style*="924be1"]):not([style*="background-color: rgb(146, 75, 225)"]) i {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
  opacity: 1 !important;
}

/* Active Sort Button (Selected filter) */
body[data-theme="galaxy"] .sort-content button[style*="924be1"],
body[data-theme="galaxy"] .sort-content button[style*="background-color: rgb(146, 75, 225)"],
body[data-theme="galaxy"] .sort-content button[style*="background-color:#924be1"] {
  background-color: rgba(255, 255, 255, 0.15) !important;
  color: #FFFFFF !important;
  border: 1.5px solid #FFFFFF !important;
  border-radius: 1rem !important;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.6), inset 0 0 4px rgba(255, 255, 255, 0.3) !important;
  font-weight: 600 !important;
}
body[data-theme="galaxy"] .sort-content button[style*="924be1"] i,
body[data-theme="galaxy"] .sort-content button[style*="background-color: rgb(146, 75, 225)"] i,
body[data-theme="galaxy"] .sort-content button[style*="background-color:#924be1"] i {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
  opacity: 1 !important;
}

/* Exchanger Pills (Binance, Tokocrypto, OKX) */
body[data-theme="galaxy"] .sort-content > div[style*="0.04"],
body[data-theme="galaxy"] .sort-content > div.noselect {
  background-color: rgba(18, 20, 22, 0.8) !important;
  border: 1px solid rgba(233, 235, 237, 0.35) !important;
  border-radius: 1rem !important;
  color: #F4F4F5 !important;
  padding: 2px 8px !important;
}
body[data-theme="galaxy"] .sort-content > div p {
  color: #F4F4F5 !important;
}
body[data-theme="galaxy"] .sort-content > div i {
  color: rgba(255, 255, 255, 0.8) !important;
}

/* Table Column Headers with Primary Metallic Border & Rounded Top Corners */
body[data-theme="galaxy"] .searchBar-container.bg-theme.sort-content-tabel,
body[data-theme="galaxy"] .sort-content-tabel {
  position: relative !important;
  height: 30px !important;
  padding: 3px 0px 6px 0px !important;
  border-left: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-right: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-top: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.2) !important;
  border-top-left-radius: 12px !important;
  border-top-right-radius: 12px !important;
  max-width: 400px !important;
  margin: 0 auto !important;
  background-color: #000000 !important;
  box-shadow: 
    0 -2px 10px rgba(233, 235, 237, 0.15),
    -2px 0 10px rgba(233, 235, 237, 0.15),
    2px 0 10px rgba(233, 235, 237, 0.15) !important;
}

body[data-theme="galaxy"] .sort-content-tabel::before,
body[data-theme="galaxy"] .sort-content-tabel::after {
  display: none !important;
}

body[data-theme="galaxy"] .sort-content-tabel p,
body[data-theme="galaxy"] .sort-content-tabel .color-theme {
  color: #C5C4C7 !important;
  opacity: 1 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

/* Ticker Cards & Coin Table List */
body[data-theme="galaxy"] #trade-page #binanceTicker {
  margin-top: 0 !important;
}
body[data-theme="galaxy"] #trade-page .bg-binance-tick .ticker-card {
  border-left: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-right: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.15) !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
  max-width: 400px !important;
  margin: 0 auto !important;
  background-color: #000000 !important;
  box-shadow: -2px 0 10px rgba(233, 235, 237, 0.12), 2px 0 10px rgba(233, 235, 237, 0.12) !important;
}
body[data-theme="galaxy"] #trade-page .bg-binance-tick #binanceTicker > div > *:last-child .ticker-card,
body[data-theme="galaxy"] #trade-page .bg-binance-tick .ticker-card:last-child,
body[data-theme="galaxy"] #trade-page .bg-binance-tick .ticker-card:last-of-type {
  border-bottom: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-bottom-left-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
  box-shadow: -2px 0 10px rgba(233, 235, 237, 0.15), 2px 0 10px rgba(233, 235, 237, 0.15), 0 3px 10px rgba(233, 235, 237, 0.2) !important;
}

/* Ticker Card Content Typography & Colors */
body[data-theme="galaxy"] #trade-page .ticker-card h1[style*="color: black"],
body[data-theme="galaxy"] #trade-page .ticker-card h1[style*="color:black"],
body[data-theme="galaxy"] #trade-page .ticker-card h1 {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}
body[data-theme="galaxy"] #trade-page .ticker-card h1 .color-gray-dark {
  color: #8A8D93 !important;
  font-weight: 400 !important;
}
body[data-theme="galaxy"] #trade-page .ticker-card .color-black,
body[data-theme="galaxy"] #trade-page .ticker-card [style*="color: black"],
body[data-theme="galaxy"] #trade-page .ticker-card [style*="color:black"] {
  color: #FFFFFF !important;
}
body[data-theme="galaxy"] #trade-page .ticker-card .coin-status .font-11,
body[data-theme="galaxy"] #trade-page .ticker-card .font-11 {
  color: #A0A3A8 !important;
}
body[data-theme="galaxy"] #trade-page .ticker-card .coin-status.color-orange,
body[data-theme="galaxy"] #trade-page .ticker-card .coin-status.color-orange * {
  color: #FFC83D !important;
}
body[data-theme="galaxy"] #trade-page .ticker-card [style*="color: #36b693"],
body[data-theme="galaxy"] #trade-page .ticker-card [style*="color:#36b693"] {
  color: #4ED58B !important;
}
body[data-theme="galaxy"] #trade-page .ticker-card [style*="color: #ED5565"],
body[data-theme="galaxy"] #trade-page .ticker-card [style*="color:#ED5565"] {
  color: #FF5664 !important;
}

/* Trade Footer Bar Capsule Line */
body[data-theme="galaxy"] #trade-footer-bar {
  position: relative !important;
  background: linear-gradient(180deg, #0d0f12, #181a1f, #0d0f12) !important;
  border: none !important;
  box-shadow: none !important;
}
body[data-theme="galaxy"] #trade-footer-bar::before,
body[data-theme="galaxy"] #trade-footer-bar::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, 
    #3a3d43 0%, #62656d 10%, #989ba0 20%,
    #ffffff 30%, #ecedec 50%, #989ba0 70%,
    #62656d 85%, #3a3d43 100%) !important;
  z-index: 2 !important;
}
body[data-theme="galaxy"] #trade-footer-bar::before {
  top: 0 !important;
}
body[data-theme="galaxy"] #trade-footer-bar::after {
  bottom: 0 !important;
}
body[data-theme="galaxy"] #trade-footer-bar,
body[data-theme="galaxy"] #trade-footer-bar i,
body[data-theme="galaxy"] #trade-footer-bar div,
body[data-theme="galaxy"] #trade-footer-bar span {
  color: var(--th-border-solid, #E9EBED) !important;
}

/* Fix Offcanvas / Drawer backgrounds for dark themes */
body[data-theme="galaxy"] .offcanvas {
  background-color: var(--th-bg) !important;
}
/* =========================================================
   ELITE THEME: FIX STICKY HEADERS OVERLAPPING CARDS
   ========================================================= */
body[data-theme="galaxy"] .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="galaxy"] .top-header.sticky.header-scrolled {
    background-image: var(--th-header-bg-img) !important;
    background-color: #000000 !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="galaxy"] #coin-details-header.header-scrolled {
    background-image: none !important;
    background-color: rgba(10, 13, 24, 0.85) !important;
    background-size: auto !important;
}
/* =========================================================================
   GALAXY THEME: UNIFIED ICON STYLING (METALLIC SILVER GRADIENT)
   ========================================================================= */

/* 1. Page Header Chevrons (Back buttons) & Navigation Chevrons */
body[data-theme="galaxy"] .page-title a .bi-chevron-left,
body[data-theme="galaxy"] .page-title .bi-chevron-left,
body[data-theme="galaxy"] #coin-details-header .bi-chevron-left,
body[data-theme="galaxy"] #dismiss-coin-details i,
body[data-theme="galaxy"] a[id^="dismiss-"] i.bi-chevron-left,
body[data-theme="galaxy"] a[id^="dismiss-"] i,
body[data-theme="galaxy"] .bi-chevron-right,
body[data-theme="galaxy"] .bi-chevron-double-right,
body[data-theme="galaxy"] .toggle-arrow,
body[data-theme="galaxy"] .bi-chevron-down,
body[data-theme="galaxy"] .bi-chevron-up,
body[data-theme="galaxy"] .bi-caret-right-fill,
body[data-theme="galaxy"] .bi-caret-down-fill,
body[data-theme="galaxy"] .bi-caret-up-fill {
    background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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;
}

/* 2. Header Right Action Icons (Refresh, Info, Question, Download, Gear, CSV) */
body[data-theme="galaxy"] .page-title .bi-question-circle-fill,
body[data-theme="galaxy"] .page-title .bi-info-circle-fill,
body[data-theme="galaxy"] .page-title .bi-arrow-repeat,
body[data-theme="galaxy"] .page-title .refreshBtn i,
body[data-theme="galaxy"] .page-title .bi-download,
body[data-theme="galaxy"] .page-title .bi-gear,
body[data-theme="galaxy"] .page-title .bi-gear-fill,
body[data-theme="galaxy"] .page-title .bi-pie-chart-fill,
body[data-theme="galaxy"] #vue-download-csv-asset-credit i,
body[data-theme="galaxy"] #vue-download-csv-asset-credit .bi,
body[data-theme="galaxy"] #vue-download-csv-trasaction i,
body[data-theme="galaxy"] #vue-download-csv-trasaction .bi,
body[data-theme="galaxy"] #button-credit-downloads i,
body[data-theme="galaxy"] #button-credit-downloads .bi,
body[data-theme="galaxy"] button-new-tab-url-icon i,
body[data-theme="galaxy"] button-download i,
body[data-theme="galaxy"] .refreshBtn i,
body[data-theme="galaxy"] a.refresh i,
body[data-theme="galaxy"] .refreshBtn:not(.refreshBtn-home) i {
    background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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;
}

/* 3. Bootstrap Action & Status Icons */
body[data-theme="galaxy"] .bi-arrow-up-circle-fill,
body[data-theme="galaxy"] .bi-arrow-up-circle,
body[data-theme="galaxy"] .bi-arrow-down-circle-fill,
body[data-theme="galaxy"] .bi-arrow-down-circle,
body[data-theme="galaxy"] .bi-arrow-left-right,
body[data-theme="galaxy"] .bi-arrow-repeat,
body[data-theme="galaxy"] .bi-arrows-angle-expand,
body[data-theme="galaxy"] .bi-arrows-fullscreen,
body[data-theme="galaxy"] .bi-person-circle,
body[data-theme="galaxy"] .bi-shield-check,
body[data-theme="galaxy"] .bi-lock-fill,
body[data-theme="galaxy"] .bi-key-fill,
body[data-theme="galaxy"] .bi-code-square,
body[data-theme="galaxy"] .bi-pencil-fill,
body[data-theme="galaxy"] .bi-megaphone {
    background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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;
}

/* 4. Action icons (PNG): fill the icon shape with silver gradient via mask */
body[data-theme="galaxy"] #coin-details-header .justify-end a:has(> img),
body[data-theme="galaxy"] .page-title .justify-end a:has(> img) {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    filter: none !important;
}
body[data-theme="galaxy"] #coin-details-header .justify-end a:has(> img) > img,
body[data-theme="galaxy"] .page-title .justify-end a:has(> img) > img {
    visibility: hidden;
}
body[data-theme="galaxy"] #coin-details-header a:has(> img[src*="graph-icon"]),
body[data-theme="galaxy"] .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="galaxy"] #coin-details-header a:has(> img[src*="profit-summary-icon"]),
body[data-theme="galaxy"] .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="galaxy"] #coin-details-header a:has(> img[src*="transaction-icon"]),
body[data-theme="galaxy"] .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");
}
/* Galaxy Theme Cards: #user-asset, #user-profit, #user-bonus, etc. */
body[data-theme="galaxy"] #user-asset > .content:first-child,
body[data-theme="galaxy"] #user-bonus > div > .content,
body[data-theme="galaxy"] #flush-one .content,
body[data-theme="galaxy"] #user-bonus > .content,
body[data-theme="galaxy"] #user-profit > .content,
body[data-theme="galaxy"] #user-history-credit > .content,
body[data-theme="galaxy"] #user-recharge > .content {
    background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
    border-radius: 12px !important;
}

body[data-theme="galaxy"] #user-asset > .content:first-child,
body[data-theme="galaxy"] #user-profit > .content:first-child {
    background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
    border: 1px solid var(--th-border-solid, #E9EBED) !important;
    box-shadow: 0 0 15px rgba(233, 235, 237, 0.25) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Fix text colors inside profit and asset cards (override hardcoded inline color: black) */
body[data-theme="galaxy"] #user-asset > .content:first-child h5.color-theme,
body[data-theme="galaxy"] #user-bonus > div > .content h6,
body[data-theme="galaxy"] #flush-one .content h6,
body[data-theme="galaxy"] #user-bonus > div > .content i,
body[data-theme="galaxy"] #flush-one .content i,
body[data-theme="galaxy"] #user-profit > .content h6,
body[data-theme="galaxy"] #user-profit > .content i,
body[data-theme="galaxy"] #user-profit [style*="color: black"],
body[data-theme="galaxy"] #user-profit [style*="color:black"],
body[data-theme="galaxy"] #user-profit [style*="color: #212121"],
body[data-theme="galaxy"] #user-profit [style*="color:#212121"],
body[data-theme="galaxy"] #user-history-credit > .content h6,
body[data-theme="galaxy"] #user-history-credit > .content p,
body[data-theme="galaxy"] #user-recharge > .content h6,
body[data-theme="galaxy"] #user-profit-summary [style*="color: black"],
body[data-theme="galaxy"] #user-profit-summary [style*="color:black"],
body[data-theme="galaxy"] #profit-summary [style*="color: black"],
body[data-theme="galaxy"] #profit-summary [style*="color:black"] {
    color: var(--th-text, #F4F4F5) !important;
}

/* Big profit value amounts -> Pure White Bold */
body[data-theme="galaxy"] #user-profit > .content i.font-16,
body[data-theme="galaxy"] #user-profit > .content i.font-1000,
body[data-theme="galaxy"] #user-profit-summary i.font-16,
body[data-theme="galaxy"] #user-profit-summary i.font-1000 {
    color: #FFFFFF !important;
    font-weight: 700 !important;
}

/* Subtitle & Labels inside profit cards */
body[data-theme="galaxy"] #user-profit > .content h6,
body[data-theme="galaxy"] #user-profit-summary > .content h6 {
    color: var(--th-text-secondary, #C5C4C7) !important;
    opacity: 1 !important;
}

/* Dividers inside cards */
body[data-theme="galaxy"] #user-profit .divider,
body[data-theme="galaxy"] #user-profit-summary .divider {
    background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
    opacity: 0.7 !important;
}

/* Global .color-purple override for galaxy theme: map to metallic silver accent */
body[data-theme="galaxy"] .color-purple,
body[data-theme="galaxy"] h5.color-purple,
body[data-theme="galaxy"] p.color-purple,
body[data-theme="galaxy"] span.color-purple,
body[data-theme="galaxy"] i.color-purple,
body[data-theme="galaxy"] a.color-purple {
    color: var(--th-accent, #D9DBDE) !important;
}

body[data-theme="galaxy"] #div-withdrawal-asset,
body[data-theme="galaxy"] #div-withdrawal-bonus {
    background-color: var(--th-surface) !important;
    border: 1px solid var(--th-border) !important;
    padding: 15px !important;
}
body[data-theme="galaxy"] #div-withdrawal-asset .input-group,
body[data-theme="galaxy"] #div-withdrawal-bonus .input-group {
    background-color: #000000 !important;
    background: #000000 !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="galaxy"] #div-withdrawal-asset .input-group:focus-within,
body[data-theme="galaxy"] #div-withdrawal-bonus .input-group:focus-within {
    border-color: var(--th-border-solid, #E9EBED) !important;
    box-shadow: 0 0 10px var(--th-border-glow, rgba(233, 235, 237, 0.4)) !important;
}
body[data-theme="galaxy"] #div-withdrawal-asset .input-group-text,
body[data-theme="galaxy"] #div-withdrawal-bonus .input-group-text {
    background-color: transparent !important;
    border: none !important;
    color: var(--th-text) !important;
}
body[data-theme="galaxy"] #div-withdrawal-asset .input-group-prepend .input-group-text,
body[data-theme="galaxy"] #div-withdrawal-bonus .input-group-prepend .input-group-text {
    border-right: 1px solid var(--th-border) !important;
    border-radius: 0 !important;
}
body[data-theme="galaxy"] #div-withdrawal-asset .input-group-append .input-group-text:not(.btn-uni),
body[data-theme="galaxy"] #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="galaxy"] #div-withdrawal-asset .form-control,
body[data-theme="galaxy"] #div-withdrawal-bonus .form-control {
    background-color: #000000 !important;
    background: #000000 !important;
    border: none !important;
    color: var(--th-text) !important;
    box-shadow: none !important;
}
body[data-theme="galaxy"] #div-withdrawal-asset .form-control::placeholder,
body[data-theme="galaxy"] #div-withdrawal-bonus .form-control::placeholder {
    color: var(--th-text-muted) !important;
}
/* Tombol "Send Code" */
body[data-theme="galaxy"] #div-withdrawal-asset .btn-uni#basic-addon2,
body[data-theme="galaxy"] #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="galaxy"] #div-withdrawal-asset h5,
body[data-theme="galaxy"] #div-withdrawal-bonus h5,
body[data-theme="galaxy"] #div-withdrawal-bonus p.color-gray {
    color: var(--th-text) !important;
}
body[data-theme="galaxy"] #div-withdrawal-asset p.color-purple,
body[data-theme="galaxy"] #div-withdrawal-bonus p.color-purple {
    color: var(--th-accent) !important;
}
/* =========================================================
   GALAXY THEME: API CONFIGURATION / CONNECT PAGES
   ========================================================= */
/* General text colors & icons */
body[data-theme="galaxy"] #api-connect-page h3.color-theme,
body[data-theme="galaxy"] #api-connect-okx-page h3.color-theme,
body[data-theme="galaxy"] #api-connect-tokocrypto-page h3.color-theme {
    color: #ffffff !important;
}
body[data-theme="galaxy"] #api-connect-page .bi-question-circle-fill,
body[data-theme="galaxy"] #api-connect-okx-page .bi-question-circle-fill,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .bi-question-circle-fill {
    color: var(--th-accent, #D9DBDE) !important;
}
/* Status text overrides */
body[data-theme="galaxy"] #api-connect-page h3.color-white,
body[data-theme="galaxy"] #api-connect-okx-page h3.color-white,
body[data-theme="galaxy"] #api-connect-tokocrypto-page h3.color-white {
    color: #ffffff !important;
}
/* Guidelines body text & headings */
body[data-theme="galaxy"] #guide-api-connect-binance,
body[data-theme="galaxy"] #guide-api-connect-tokocrypto,
body[data-theme="galaxy"] #guide-api-connect-okx {
    background-color: var(--th-surface, #121416) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 10px rgba(233, 235, 237, 0.15) !important;
}
body[data-theme="galaxy"] #guide-api-connect-binance strong,
body[data-theme="galaxy"] #guide-api-connect-tokocrypto strong,
body[data-theme="galaxy"] #guide-api-connect-okx strong {
    color: var(--th-accent, #D9DBDE) !important;
}
body[data-theme="galaxy"] #api-connect-page i[style*="font-style: normal"],
body[data-theme="galaxy"] #api-connect-okx-page i[style*="font-style: normal"],
body[data-theme="galaxy"] #api-connect-tokocrypto-page i[style*="font-style: normal"] {
    color: var(--th-text-muted, #9C9BA0) !important;
}

/* Inputs wrapper — Pitch black / surface with subtle metallic rim */
body[data-theme="galaxy"] #api-connect-page .content,
body[data-theme="galaxy"] #api-connect-okx-page .content,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .content {
    background-color: var(--th-surface, #121416) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 12px rgba(233, 235, 237, 0.15), inset 0 0 8px rgba(233, 235, 237, 0.1) !important;
    padding-bottom: 16px !important;
}
body[data-theme="galaxy"] #api-connect-page [class*="input-screate-key"],
body[data-theme="galaxy"] #api-connect-okx-page [class*="input-screate-key"],
body[data-theme="galaxy"] #api-connect-tokocrypto-page [class*="input-screate-key"],
body[data-theme="galaxy"] #api-connect-page [class*="input-secret-key"],
body[data-theme="galaxy"] #api-connect-okx-page [class*="input-secret-key"],
body[data-theme="galaxy"] #api-connect-tokocrypto-page [class*="input-secret-key"] {
    margin-bottom: 8px !important;
    padding-bottom: 4px !important;
}
body[data-theme="galaxy"] #api-connect-page .content::before,
body[data-theme="galaxy"] #api-connect-okx-page .content::before,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .content::before {
    display: none !important;
    box-shadow: none !important;
}
/* .content yg cuma bungkus teks "Don't have account? Register now" */
body[data-theme="galaxy"] #api-connect-page .content:has(> .key > .color-theme),
body[data-theme="galaxy"] #api-connect-okx-page .content:has(> .key > .color-theme),
body[data-theme="galaxy"] #api-connect-tokocrypto-page .content:has(> .key > .color-theme) {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}

/* The actual text inputs */
body[data-theme="galaxy"] #api-connect-page input.key,
body[data-theme="galaxy"] #api-connect-okx-page input.key,
body[data-theme="galaxy"] #api-connect-tokocrypto-page input.key {
    background: #000000 !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    color: var(--th-text, #F4F4F5) !important;
    border-radius: 8px !important;
    padding: 0 10px !important;
    box-shadow: none !important;
}
body[data-theme="galaxy"] #api-connect-page input.key::placeholder,
body[data-theme="galaxy"] #api-connect-okx-page input.key::placeholder,
body[data-theme="galaxy"] #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="galaxy"] #api-connect-page .btn-copy,
body[data-theme="galaxy"] #api-connect-okx-page .btn-copy,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .btn-copy {
    background: linear-gradient(135deg, #4A4D53 0%, #2A2D33 50%, #1E2024 100%) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    color: #ffffff !important;
    border-radius: 6px !important;
    box-shadow: 0 0 10px rgba(233, 235, 237, 0.2) !important;
}

/* Connect / Disconnect / Replace Buttons */
body[data-theme="galaxy"] .bottomButton a,
body[data-theme="galaxy"] .bottomButton .btn,
body[data-theme="galaxy"] .bottomButton button,
body[data-theme="galaxy"] #api-connect-page .bottomButton .btn,
body[data-theme="galaxy"] #api-connect-okx-page .bottomButton .btn,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .bottomButton .btn,
body[data-theme="galaxy"] .btn-connect-api-binance,
body[data-theme="galaxy"] .btn-connect-api-okx,
body[data-theme="galaxy"] .btn-connect-api-tokocrypto {
    background-image: var(--th-bg-api-btn, url("../../assets/orbit-galaxy/bg-pg-api-3.png?v=2")) !important;
    background-size: cover !important;
    background-position: center !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.5)) !important;
    color: #0c0e12 !important;
    -webkit-text-fill-color: #0c0e12 !important;
    font-weight: 700 !important;
    box-shadow: 0 0 12px rgba(233, 235, 237, 0.3) !important;
}
body[data-theme="galaxy"] .bottomButton a *,
body[data-theme="galaxy"] .bottomButton .btn *,
body[data-theme="galaxy"] #api-connect-page .bottomButton .btn *,
body[data-theme="galaxy"] #api-connect-okx-page .bottomButton .btn *,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .bottomButton .btn * {
    color: #0c0e12 !important;
    -webkit-text-fill-color: #0c0e12 !important;
    font-weight: 700 !important;
}
/* Back button */
body[data-theme="galaxy"] .bottomButton-back a,
body[data-theme="galaxy"] .bottomButton-back .btn,
body[data-theme="galaxy"] #api-connect-page .bottomButton-back .btn,
body[data-theme="galaxy"] #api-connect-okx-page .bottomButton-back .btn,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .bottomButton-back .btn {
    background-color: transparent !important;
    border: none !important;
    color: var(--th-accent, #D9DBDE) !important;
    -webkit-text-fill-color: var(--th-accent, #D9DBDE) !important;
}

/* Box for Spotlution IPs / Status Box */
body[data-theme="galaxy"] #api-connect-page .gradient-purple-2,
body[data-theme="galaxy"] #api-connect-okx-page .gradient-purple-2,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .gradient-purple-2 {
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 10px rgba(233, 235, 237, 0.3) !important;
    background-clip: padding-box !important;
}
body[data-theme="galaxy"] #api-connect-form-binance .gradient-purple-2,
body[data-theme="galaxy"] #api-connect-form-okx .gradient-purple-2,
body[data-theme="galaxy"] #api-connect-form-tokocrypto .gradient-purple-2 {
    background-image: var(--th-bg-api-ip, url("../../assets/orbit-galaxy/bg-pg-api-1.png")) !important;
    background-size: cover !important;
    background-position: center !important;
}
body[data-theme="galaxy"] #api-connect-page > .gradient-purple-2,
body[data-theme="galaxy"] #api-connect-okx-page > .gradient-purple-2,
body[data-theme="galaxy"] #api-connect-tokocrypto-page > .gradient-purple-2 {
    background-image: var(--th-bg-api-status, url("../../assets/orbit-galaxy/bg-pg-api-2.png?v=2")) !important;
    background-size: cover !important;
    background-position: center !important;
    background-clip: padding-box !important;
}
body[data-theme="galaxy"] #api-connect-page .color-theme,
body[data-theme="galaxy"] #api-connect-okx-page .color-theme,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .color-theme {
    color: var(--th-text-muted, #9C9BA0) !important;
}
body[data-theme="galaxy"] #api-connect-page .color-theme a,
body[data-theme="galaxy"] #api-connect-okx-page .color-theme a,
body[data-theme="galaxy"] #api-connect-tokocrypto-page .color-theme a {
    color: var(--th-accent, #D9DBDE) !important;
}
/* Menu drawer icons -> putih (bukan ungu) di semua tema gelap */
body[data-theme="galaxy"] .nav-container .nav li a i {
    color: #ffffff !important;
}
body[data-theme="galaxy"] .dropdown-menu {
    background-color: var(--th-surface-2, #25282B) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] .dropdown-menu .dropdown-item {
    color: var(--th-text, #F4F4F5) !important;
    border-bottom: 1px solid var(--th-divider) !important;
}
body[data-theme="galaxy"] .dropdown-menu .dropdown-item:last-child {
    border-bottom: none !important;
}
body[data-theme="galaxy"] .dropdown-menu .dropdown-item:hover,
body[data-theme="galaxy"] .dropdown-menu .dropdown-item:focus,
body[data-theme="galaxy"] .dropdown-menu .dropdown-item.active {
    background-color: var(--th-accent, #D9DBDE) !important;
    color: #050708 !important;
}
/* =========================================================
   GALAXY THEME: KEUNTUNGAN HARIAN (INFO-PROFIT) CARDS
   ========================================================= */
body[data-theme="galaxy"] #vue-tab-info-profit {
    background: transparent !important;
    background-image: none !important;
}
body[data-theme="galaxy"] #vue-tab-info-profit.header-scrolled {
    background-image: none !important;
    background-color: rgba(5, 7, 8, 0.95) !important;
}
body[data-theme="galaxy"] #vue-info-profit .card.card-style {
    background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
    margin: 12px 15px !important;
    border-radius: 12px !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 15px rgba(233, 235, 237, 0.12) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}
body[data-theme="galaxy"] #vue-info-profit .divider {
    background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
    opacity: 0.6 !important;
}
body[data-theme="galaxy"] #vue-info-profit p {
    color: var(--th-text, #F4F4F5) !important;
}
body[data-theme="galaxy"] #vue-info-profit .font-11:not(.color-black):not(.color-theme) {
    color: var(--th-text-muted, #9C9BA0) !important;
}
body[data-theme="galaxy"] #vue-info-profit .color-black,
body[data-theme="galaxy"] #vue-info-profit .color-theme,
body[data-theme="galaxy"] #vue-info-profit [style*="color: black"],
body[data-theme="galaxy"] #vue-info-profit [style*="color:black"] {
    color: #FFFFFF !important;
    font-weight: 600 !important;
}
body[data-theme="galaxy"] #vue-info-profit [style*="color: rgb(146, 76, 227)"],
body[data-theme="galaxy"] #vue-info-profit [style*="color:rgb(146, 76, 227)"],
body[data-theme="galaxy"] #vue-info-profit [style*="color: rgb(146,76,227)"],
body[data-theme="galaxy"] #vue-info-profit [style*="color:rgb(146,76,227)"],
body[data-theme="galaxy"] #vue-info-profit [style*="color: #924ce3"],
body[data-theme="galaxy"] #vue-info-profit [style*="color:#924ce3"] {
    color: var(--th-accent, #D9DBDE) !important;
    font-weight: 700 !important;
}
body[data-theme="galaxy"] #vue-info-profit [style*="color: #36b693"],
body[data-theme="galaxy"] #vue-info-profit [style*="color: rgb(54, 182, 147)"],
body[data-theme="galaxy"] #vue-info-profit [style*="color:rgb(54, 182, 147)"] {
    color: var(--th-status-positive, #4ED58B) !important;
    font-weight: 700 !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="galaxy"] #body-formula [id^="collapse-list"].bg-theme,
body[data-theme="galaxy"] #body-batch-formula [id^="collapse-list"].bg-theme,
body[data-theme="galaxy"] #collapse-moon-logic-formula.bg-theme,
body[data-theme="galaxy"] #collapse-moon-logic-batch-formula.bg-theme {
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}
/* Coin detail cards: translucent glass + metallic silver border */
body[data-theme="galaxy"] #coin-setting .content.bg-theme {
    background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: inset 0 0 10px rgba(233, 235, 237, 0.15), 0 0 12px rgba(233, 235, 237, 0.1) !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Coin Detail Text Colors */
body[data-theme="galaxy"] #coin-setting [style*="color:black"],
body[data-theme="galaxy"] #coin-setting [style*="color: black"],
body[data-theme="galaxy"] #coin-setting .color-black {
    color: #FFFFFF !important;
}
body[data-theme="galaxy"] #coin-setting .color-gray-dark {
    color: #A0A3A8 !important;
}
body[data-theme="galaxy"] #coin-setting .color-theme {
    color: #FFFFFF !important;
}
body[data-theme="galaxy"] #coin-setting h5,
body[data-theme="galaxy"] #coin-setting h6,
body[data-theme="galaxy"] #coin-setting span:not(.badge):not(.badge-new-2),
body[data-theme="galaxy"] #coin-setting p,
body[data-theme="galaxy"] #coin-setting label {
    color: #FFFFFF !important;
}

/* Coin Detail Change text in Galaxy theme: pastikan teks tidak terkena gradient ikon dan tampil putih */
body[data-theme="galaxy"] #coin-setting p[style*="54, 182, 147"],
body[data-theme="galaxy"] #coin-setting p[style*="54,182,147"],
body[data-theme="galaxy"] #coin-details p[style*="54, 182, 147"],
body[data-theme="galaxy"] #coin-details p[style*="54,182,147"] {
    color: #FFFFFF !important;
    background: none !important;
    -webkit-text-fill-color: #FFFFFF !important;
}

/* Galaxy Blue-Silver Gradient (#F5F6F7 -> #6c8eb4) to all icons in coin-setting and details cards */
body[data-theme="galaxy"] #coin-setting i:not(.bi-question-circle-fill):not(.bi-info-circle-fill),
body[data-theme="galaxy"] #coin-setting .settings-item i,
body[data-theme="galaxy"] #coin-setting .settings-grid i,
body[data-theme="galaxy"] #coin-setting .settings-grid2 i,
body[data-theme="galaxy"] #coin-setting [class*="fa-"],
body[data-theme="galaxy"] #coin-setting .fas,
body[data-theme="galaxy"] #coin-setting .fa,
body[data-theme="galaxy"] #coin-setting .far,
body[data-theme="galaxy"] #coin-setting .d-flex i,
body[data-theme="galaxy"] #coin-setting .content i,
body[data-theme="galaxy"] #coin-setting i[style*="color: #924be1"],
body[data-theme="galaxy"] #coin-setting i[style*="color:#924be1"],
body[data-theme="galaxy"] #coin-setting i[style*="146, 75, 225"],
body[data-theme="galaxy"] #coin-setting i[style*="146,75,225"],
body[data-theme="galaxy"] #coin-setting i[style*="color: #36b693"],
body[data-theme="galaxy"] #coin-setting i[style*="color:#36b693"],
body[data-theme="galaxy"] #coin-setting i[style*="54, 182, 147"],
body[data-theme="galaxy"] #coin-setting i[style*="54,182,147"],
body[data-theme="galaxy"] #coin-setting i[style*="color: #d84558"],
body[data-theme="galaxy"] #coin-setting i[style*="color:#d84558"],
body[data-theme="galaxy"] #coin-setting i[style*="216, 69, 88"],
body[data-theme="galaxy"] #coin-setting i[style*="216,69,88"],
body[data-theme="galaxy"] #coin-setting i[style*="146, 75, 225"],
body[data-theme="galaxy"] #coin-setting i[style*="146,75,225"],
body[data-theme="galaxy"] #coin-setting i[style*="924be1"],
body[data-theme="galaxy"] #coin-setting i.fas,
body[data-theme="galaxy"] #coin-setting i.fa,
body[data-theme="galaxy"] #coin-details i:not(.bi-question-circle-fill):not(.bi-info-circle-fill),
body[data-theme="galaxy"] #coin-details [class*="fa-"],
body[data-theme="galaxy"] #coin-details .fas,
body[data-theme="galaxy"] #coin-details .fa,
body[data-theme="galaxy"] #coin-details .far,
body[data-theme="galaxy"] #coin-details .d-flex i,
body[data-theme="galaxy"] #coin-details .content i,
body[data-theme="galaxy"] #coin-details i[style*="color: #924be1"],
body[data-theme="galaxy"] #coin-details i[style*="color:#924be1"],
body[data-theme="galaxy"] #coin-details i[style*="146, 75, 225"],
body[data-theme="galaxy"] #coin-details i[style*="146,75,225"],
body[data-theme="galaxy"] #coin-details i[style*="146, 75, 225"],
body[data-theme="galaxy"] #coin-details i[style*="146,75,225"],
body[data-theme="galaxy"] #coin-details i[style*="924be1"],
body[data-theme="galaxy"] #coin-details i.fas,
body[data-theme="galaxy"] #coin-details i.fa,
body[data-theme="galaxy"] #top-coin-setting-page i:not(.bi-question-circle-fill):not(.bi-info-circle-fill),
body[data-theme="galaxy"] #top-coin-setting-page [class*="fa-"],
body[data-theme="galaxy"] #top-coin-setting-page .fas,
body[data-theme="galaxy"] #top-coin-setting-page .fa,
body[data-theme="galaxy"] .fas.fa-step-forward,
body[data-theme="galaxy"] .fas.fa-arrow-circle-down,
body[data-theme="galaxy"] .fas.fa-dollar-sign,
body[data-theme="galaxy"] .fas.fa-percentage,
body[data-theme="galaxy"] .fas.fa-wallet,
body[data-theme="galaxy"] .fas.fa-layer-group,
body[data-theme="galaxy"] .fa.fa-balance-scale,
body[data-theme="galaxy"] .fas.fa-tools,
body[data-theme="galaxy"] .fas.fa-traffic-light,
body[data-theme="galaxy"] .fas.fa-box {
    background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    display: inline-block !important;
    filter: none !important;
}

/* Settings labels in coin-setting ("Avg: ON", "Moon Logic", "Formula", "Non-Stop", "Mode: All", etc.) */
body[data-theme="galaxy"] #coin-setting .settings-item h6,
body[data-theme="galaxy"] #coin-setting .settings-grid h6,
body[data-theme="galaxy"] #coin-setting .settings-grid2 h6 {
    background: none !important;
    -webkit-text-fill-color: #E4E6EA !important;
    color: #E4E6EA !important;
    font-weight: 500 !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) !important;
}

/* FORCE BUY & FORCE SELL buttons in Galaxy theme */
body[data-theme="galaxy"] #btn-force-buy {
    background: linear-gradient(135deg, rgba(27, 138, 90, 0.85), rgba(13, 82, 52, 0.85)) !important;
    border: 1px solid rgba(233, 235, 237, 0.5) !important;
    box-shadow: inset 0 0 10px rgba(233, 235, 237, 0.35), 0 0 12px rgba(54, 182, 147, 0.3) !important;
}
body[data-theme="galaxy"] #btn-force-sell {
    background: linear-gradient(135deg, rgba(168, 46, 62, 0.85), rgba(99, 23, 34, 0.85)) !important;
    border: 1px solid rgba(233, 235, 237, 0.5) !important;
    box-shadow: inset 0 0 10px rgba(233, 235, 237, 0.35), 0 0 12px rgba(216, 69, 88, 0.3) !important;
}

/* Coin Detail Footer Bar & Start / Pause Button */
body[data-theme="galaxy"] #footer-bar-coin-detail {
    background-color: rgba(10, 13, 24, 0.95) !important;
    border-top: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 -4px 15px rgba(0, 0, 0, 0.6) !important;
}
body[data-theme="galaxy"] #footer-bar-coin-detail .btn-start-default,
body[data-theme="galaxy"] #footer-bar-coin-detail .btn-start-theme button-start {
    background: linear-gradient(135deg, #28a745, #1e7e34) !important;
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    border-radius: 8px !important;
    box-shadow: 0 0 12px rgba(40, 167, 69, 0.4) !important;
    color: #FFFFFF !important;
    font-weight: 600 !important;
}
body[data-theme="galaxy"] #footer-bar-coin-detail .btn-stop-default,
body[data-theme="galaxy"] #footer-bar-coin-detail .btn-stop-theme button-pause {
    background: var(--th-accent-grad, linear-gradient(135deg, #FFFFFF 0%, #D9DBDE 30%, #8A8D93 70%, #FFFFFF 100%)) !important;
    border: 1px solid rgba(255, 255, 255, 0.6) !important;
    border-radius: 8px !important;
    box-shadow: 0 0 15px rgba(233, 235, 237, 0.3) !important;
    color: #000000 !important;
    font-weight: 700 !important;
}

body[data-theme="galaxy"] #body-formula .form-control,
body[data-theme="galaxy"] #body-batch-formula .form-control,
body[data-theme="galaxy"] #coin-setting .form-control,
body[data-theme="galaxy"] #vue-transaction-history .form-control,
body[data-theme="galaxy"] #user-summary .form-control,
body[data-theme="galaxy"] #user-profit-summary .form-control,
body[data-theme="galaxy"] #user-roi-setting .form-control,
body[data-theme="galaxy"] #vue-trading-history-body .form-control,
body[data-theme="galaxy"] #body-balancing-configuration .form-control {
    background-color: transparent !important;
    border: 0.5px solid rgba(233, 235, 237, 0.35) !important;
    color: white !important;
}
body[data-theme="galaxy"] #user-roi-setting .input-group {
    background-color: var(--th-surface-2, #181b20) !important;
    border: 1px solid rgba(233, 235, 237, 0.5) !important;
    border-radius: 8px !important;
    box-shadow: 0 0 10px rgba(233, 235, 237, 0.2) !important;
    overflow: hidden;
}
body[data-theme="galaxy"] #user-roi-setting .input-group:focus-within {
    border-color: var(--th-border-solid, #E9EBED) !important;
    box-shadow: 0 0 10px var(--th-border-glow, rgba(233, 235, 237, 0.4)) !important;
}
body[data-theme="galaxy"] #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(233, 235, 237, 0.3) !important;
}
body[data-theme="galaxy"] #user-roi-setting .input-group .form-control,
body[data-theme="galaxy"] #user-roi-setting #roi-setting-capital,
body[data-theme="galaxy"] #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="galaxy"] #user-roi-setting .input-group .form-control::placeholder,
body[data-theme="galaxy"] #user-roi-setting #roi-setting-capital::placeholder {
    color: var(--th-text-muted, rgba(255, 255, 255, 0.4)) !important;
}
/* Fix checkboxes/radios visibility in Galaxy Mode */
body[data-theme="galaxy"] .form-check-input {
    border-color: #cccccc !important;
    background-color: transparent !important;
    border-radius: 50% !important;
}
/* Centang digambar GELAP (#121416), bukan putih seperti tema lain.
   Isian kotaknya di galaxy adalah gradasi perak terang (#F7F8F8 -> #989BA0);
   centang putih di atasnya praktis tidak terlihat. Black dan elite tetap putih
   karena isian mereka emas tua dan ungu tua.
   Warna centang ini juga harus tetap kontras di ujung gelap gradasi (#989BA0)
   — #121416 lolos di kedua ujung. */
body[data-theme="galaxy"] .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='%23121416' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e"), linear-gradient(135deg, #F7F8F8 0%, #989BA0 100%) !important;
    background-size: 80% 80%, 100% 100% !important;
    background-position: center, center !important;
    background-repeat: no-repeat !important;
    /* Warna dasar kalau background-image gagal dimuat. Digabung ke sini dari
       aturan duplikat yang dulu berdiri sendiri di bawah (berlabel "Radio
       buttons inside strategy mode" padahal selektornya global dan bertabrakan
       dengan aturan ini). */
    background-color: var(--th-accent, #D9DBDE) !important;
    border-color: var(--th-border-solid, #E9EBED) !important;
}
/* =========================================================
   DYNAMIC THEME: SWEETALERT & MODALS & DRAWER OFFCANVAS
   ========================================================= */
body[data-theme="galaxy"] .offcanvas,
body[data-theme="galaxy"] .offcanvas-footer {
    background-color: #000000 !important;
}

body[data-theme="galaxy"] .swal2-popup,
body[data-theme="galaxy"] .modal-content,
body[data-theme="galaxy"] .offcanvas,
body[data-theme="galaxy"] .dialog-ovelay .dialog,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog,
body[data-theme="galaxy"] .popUp .card.card-style {
    background-color: #080808 !important;
    border: 1px solid rgba(233, 235, 237, 0.35) !important;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.9),
                inset 0 0 6px rgba(233, 235, 237, 0.2) !important;
}
/* Custom styling for SweetAlert custom dialog elements */
body[data-theme="galaxy"] #swal-confirm-btn,
body[data-theme="galaxy"] #swal-confirm-btn-set-recomendation {
    background: var(--th-accent-grad) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    box-shadow: 
      inset 0 1px 1px rgba(255, 255, 255, 0.85),
      inset 0 -1px 2px rgba(0, 0, 0, 0.45),
      inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
      inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
body[data-theme="galaxy"] #swal-confirm-btn *,
body[data-theme="galaxy"] #swal-confirm-btn-set-recomendation * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="galaxy"] #swal-cancel-btn {
    background: var(--th-surface-2, #181b20) !important;
    color: var(--th-text, #F4F4F5) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}
body[data-theme="galaxy"] .swal2-popup .text-xl-coin-group {
    color: var(--th-text) !important;
}
body[data-theme="galaxy"] .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="galaxy"] .swal2-popup .bg-red-box-coin-group p,
body[data-theme="galaxy"] .swal2-popup .bg-red-box-coin-group ul,
body[data-theme="galaxy"] .swal2-popup .bg-red-box-coin-group li {
    color: #fca5a5 !important;
}
body[data-theme="galaxy"] .swal2-popup div[style*="background-color: #eef2ff"],
body[data-theme="galaxy"] .swal2-popup div[style*="background-color:#eef2ff"] {
    background-color: rgba(233, 235, 237, 0.12) !important;
    color: var(--th-text) !important;
}
body[data-theme="galaxy"] .swal2-popup div[style*="background-color: #eef2ff"] strong,
body[data-theme="galaxy"] .swal2-popup div[style*="background-color:#eef2ff"] strong {
    color: var(--th-accent) !important;
}

/* =========================================================================
   POPUP SweetAlert "Wallet Credit Fee" (.warning-box / .content-recharge)
   ========================================================================= */
body[data-theme="galaxy"] .warning-box {
    background-color: rgba(255, 152, 0, 0.12) !important;
    border: 1px solid rgba(255, 152, 0, 0.6) !important;
    border-radius: 8px !important;
    box-shadow: 0 0 12px rgba(255, 152, 0, 0.2) !important;
    padding: 8px 12px !important;
}
body[data-theme="galaxy"] .warning-box span {
    color: #FFAA00 !important;
}

body[data-theme="galaxy"] .content-recharge {
    background-color: var(--th-surface-2, #181b20) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 15px rgba(233, 235, 237, 0.15) !important;
    border-radius: 10px !important;
    padding: 14px 16px !important;
    text-align: left !important;
}
body[data-theme="galaxy"] .content-recharge h2,
body[data-theme="galaxy"] .content-recharge h2 *,
body[data-theme="galaxy"] .content-recharge [style*="color: #d9534f"],
body[data-theme="galaxy"] .content-recharge [style*="color: #d9534f"] *,
body[data-theme="galaxy"] .content-recharge [style*="color:#d9534f"],
body[data-theme="galaxy"] .content-recharge [style*="color:#d9534f"] * {
    color: #FF5664 !important;
    text-align: center !important;
    text-shadow: 0 0 10px rgba(255, 86, 100, 0.3) !important;
}
body[data-theme="galaxy"] .content-recharge p,
body[data-theme="galaxy"] .content-recharge ul,
body[data-theme="galaxy"] .content-recharge li,
body[data-theme="galaxy"] .content-recharge [style*="color: #333"],
body[data-theme="galaxy"] .content-recharge [style*="color:#333"] {
    color: var(--th-text, #F4F4F5) !important;
}
body[data-theme="galaxy"] .content-recharge p strong,
body[data-theme="galaxy"] .content-recharge p b,
body[data-theme="galaxy"] .content-recharge ul strong,
body[data-theme="galaxy"] .content-recharge ul b,
body[data-theme="galaxy"] .content-recharge li strong,
body[data-theme="galaxy"] .content-recharge li b {
    color: #FFFFFF !important;
}
body[data-theme="galaxy"] [style*="color:red"],
body[data-theme="galaxy"] [style*="color: red"] {
    color: #FF5664 !important;
}
body[data-theme="galaxy"] .content-recharge a,
body[data-theme="galaxy"] .content-recharge a[style*="color: #314db4"],
body[data-theme="galaxy"] .content-recharge a[style*="color:#314db4"] {
    color: #5d9cec !important;
    text-decoration: underline !important;
}
/* Global Cards Glossy Glow Override */
body[data-theme="galaxy"] .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="galaxy"] .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;
}
/* Prevent transparent wrappers from getting borders and shadows */
body[data-theme="galaxy"] .pt-2 > .card.card-style,
body[data-theme="galaxy"] .card.card-style.bg-transparent,
body[data-theme="galaxy"] .card.card-style[style*="background-color: transparent"],
body[data-theme="galaxy"] .card.card-style[style*="background: transparent"],
body[data-theme="galaxy"] #quick-action-card {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
}
body[data-theme="galaxy"] .swal2-title,
body[data-theme="galaxy"] .swal2-html-container,
body[data-theme="galaxy"] .swal2-content,
body[data-theme="galaxy"] .modal-title,
body[data-theme="galaxy"] .modal-body,
body[data-theme="galaxy"] .modal-header h2,
body[data-theme="galaxy"] .swal2-popup .color-black,
body[data-theme="galaxy"] .swal2-popup [style*="color: black"],
body[data-theme="galaxy"] .swal2-popup [style*="color:black"] {
    color: white !important;
}
body[data-theme="galaxy"] .modal-content h1,
body[data-theme="galaxy"] .modal-content h2,
body[data-theme="galaxy"] .modal-content h3,
body[data-theme="galaxy"] .modal-content h4,
body[data-theme="galaxy"] .modal-content h5,
body[data-theme="galaxy"] .modal-content h6,
body[data-theme="galaxy"] .offcanvas-title,
body[data-theme="galaxy"] .offcanvas-body,
body[data-theme="galaxy"] .dialog-ovelay .dialog header h2,
body[data-theme="galaxy"] .dialog-ovelay .dialog header h3,
body[data-theme="galaxy"] .dialog-ovelay .dialog .dialog-msg p,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog header h2,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog header h3,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog .dialog-msg p,
body[data-theme="galaxy"] .popUp .card.card-style div,
body[data-theme="galaxy"] .popUp .card.card-style p,
body[data-theme="galaxy"] .popUp .card.card-style span,
body[data-theme="galaxy"] .popUp .card.card-style a,
body[data-theme="galaxy"] .popUp .card.card-style .color-black {
    color: var(--th-text) !important;
}
body[data-theme="galaxy"] .dialog-ovelay .dialog header,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog header {
    background-color: transparent !important;
    border-bottom: 1px solid var(--th-border) !important;
}
body[data-theme="galaxy"] .modal-header,
body[data-theme="galaxy"] .modal-footer {
    border: none !important;
}
body[data-theme="galaxy"] .swal2-popup select,
body[data-theme="galaxy"] .swal2-popup input,
body[data-theme="galaxy"] .modal-content select,
body[data-theme="galaxy"] .modal-content input,
body[data-theme="galaxy"] .offcanvas select,
body[data-theme="galaxy"] .offcanvas input,
body[data-theme="galaxy"] .popUp .card.card-style select,
body[data-theme="galaxy"] .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="galaxy"] .swal2-popup .swal2-input,
body[data-theme="galaxy"] #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(233, 235, 237, 0.45)) !important;
    box-shadow: var(--th-shadow, 0 0 10px rgba(233, 235, 237, 0.25)) !important;
    border-radius: 8px !important;
}
body[data-theme="galaxy"] .swal2-popup .swal2-input::placeholder,
body[data-theme="galaxy"] #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="galaxy"] #swal2-input-recovery:focus {
    border-color: #FFFFFF !important;
    box-shadow: 0 0 12px rgba(233, 235, 237, 0.5) !important;
    outline: none !important;
}
body[data-theme="galaxy"] #swal2-input-password,
body[data-theme="galaxy"] #swal2-input-confirm-password {
    background-color: #000000 !important;
    background: #000000 !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
    border-right: none !important;
}
body[data-theme="galaxy"] #swal2-input-password::placeholder,
body[data-theme="galaxy"] #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="galaxy"] #swal-drop-rate,
body[data-theme="galaxy"] #swal-buy-amount,
body[data-theme="galaxy"] #swal-take-profit {
    background-color: #000000 !important;
    background: #000000 !important;
    color: var(--th-text) !important;
    border: 1px solid var(--th-border) !important;
}
body[data-theme="galaxy"] .form-custom {
    border-color: var(--th-border) !important;
}
body[data-theme="galaxy"] .buy-modal-content {
  background-color: #121416 !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.8), 0 0 15px rgba(233, 235, 237, 0.2) !important;
  border-radius: 12px !important;
}

body[data-theme="galaxy"] .buy-modal-content .color-theme {
  color: #ffffff !important;
}

body[data-theme="galaxy"] .list-group-item.list-cycle,
body[data-theme="galaxy"] .list-group-item.list-partial,
body[data-theme="galaxy"] .list-group-item.list-active {
  background-color: transparent !important;
  color: var(--th-text, #F4F4F5) !important;
  border-color: var(--th-divider, rgba(77, 80, 84, 0.4)) !important;
}

body[data-theme="galaxy"] .list-group-item.list-cycle.active,
body[data-theme="galaxy"] .list-group-item.list-partial.active,
body[data-theme="galaxy"] .list-group-item.list-active.active {
  background-color: rgba(233, 235, 237, 0.16) !important;
  color: #ffffff !important;
  border-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}

body[data-theme="galaxy"] .swal2-popup .swal2-confirm,
body[data-theme="galaxy"] .dialog-ovelay .dialog .button-danger,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog .button-danger,
body[data-theme="galaxy"] .buy-modal-content button[onclick*="Confirm"] {
    background: var(--th-accent-grad) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 600 !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    box-shadow: 
      inset 0 1px 1px rgba(255, 255, 255, 0.85),
      inset 0 -1px 2px rgba(0, 0, 0, 0.45),
      inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
      inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
body[data-theme="galaxy"] .swal2-popup .swal2-cancel,
body[data-theme="galaxy"] .dialog-ovelay .dialog .button-default,
body[data-theme="galaxy"] .dialog-ovelay-2 .dialog .button-default,
body[data-theme="galaxy"] .popUp .card.card-style .border-dark-dark,
body[data-theme="galaxy"] .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="galaxy"] .swal2-validation-message,
body[data-theme="galaxy"] .swal2-popup .swal2-validation-message {
    background: rgba(233, 235, 237, 0.08) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    color: var(--th-text, #F4F4F5) !important;
    -webkit-text-fill-color: var(--th-text, #F4F4F5) !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(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] .swal2-validation-message::before,
body[data-theme="galaxy"] .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 -> Galaxy Silver */
body[data-theme="galaxy"] #recharge-recovery-swal a,
body[data-theme="galaxy"] #recharge-recovery-swal a[onclick*="CallGitbook"],
body[data-theme="galaxy"] #recharge-recovery-swal [style*="924be1"],
body[data-theme="galaxy"] .swal2-popup a[onclick*="CallGitbook"],
body[data-theme="galaxy"] .recovery-gitbook-link {
    color: var(--th-border-solid, #E9EBED) !important;
    -webkit-text-fill-color: var(--th-border-solid, #E9EBED) !important;
    text-decoration: underline !important;
}
body[data-theme="galaxy"] .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;
}
/* --- GALAXY THEME BUTTONS --- */
body[data-theme="galaxy"] .btn-primary {
    background: var(--th-accent-grad) !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    box-shadow: 
      inset 0 1px 1px rgba(255, 255, 255, 0.85),
      inset 0 -1px 2px rgba(0, 0, 0, 0.45),
      inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
      inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 600 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
body[data-theme="galaxy"] .btn-fail {
    background: linear-gradient(135deg, rgba(160, 40, 40, 0.8) 0%, rgba(220, 60, 60, 0.8) 100%) !important;
    border: 1px solid rgba(220, 60, 60, 0.8) !important;
    box-shadow: 0 0 10px rgba(220, 60, 60, 0.3) !important;
}
/* =========================================
   CAROUSEL BATCH THEME FIXES 
   ========================================= */
body[data-theme="galaxy"] #carousel-batch .carousel-item {
  background-color: transparent !important;
}
/* =========================================
   TRADE PAGE THEME FIXES 
   ========================================= */
body[data-theme="galaxy"] #trade-top-divider {
  display: none !important;
}
body[data-theme="galaxy"] #vue-tab-asset_credit_info {
  background-image: var(--th-header-bg-img) !important;
  background-color: #000000 !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="galaxy"] .btn-start-theme,
body[data-theme="galaxy"] .btn-stop-theme {
  display: inline-block !important; /* inline-block matches button */
  width: 100%;
}
body[data-theme="galaxy"] .btn-start-default,
body[data-theme="galaxy"] .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="galaxy"] .btn-start-theme.btn-trade-hidden,
body[data-theme="galaxy"] .btn-stop-theme.btn-trade-hidden {
  display: none !important;
}
body[data-theme="galaxy"] .reset-formula-avg,
body[data-theme="galaxy"] .batch-reset-formula-avg,
body[data-theme="galaxy"] button[onclick*="InsertNewAddress"],
body[data-theme="galaxy"] #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="galaxy"] .change-all-btn,
body[data-theme="galaxy"] .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="galaxy"] .alert-warning,
body[data-theme="galaxy"] .alert-success,
body[data-theme="galaxy"] .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="galaxy"] .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="galaxy"] .alert-warning span,
body[data-theme="galaxy"] .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="galaxy"] .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="galaxy"] .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;
}
/* Moon Logic icon — themed swap (default untouched).
   Global: semua img moon-logic-icon diganti versi tema, ukuran ikut konteks masing-masing. */
body[data-theme="galaxy"] img[src*="moon-logic-icon"] {
  content: url("../../assets/orbit-galaxy/moonlogic.png?v=1");
  object-fit: contain;
}
/* Ukuran khusus di settings coin detail */
body[data-theme="galaxy"] .settings-item img[src*="moon-logic-icon"] {
  width: 40px !important;
  height: 40px !important;
}
/* Coin detail setting icons — themed swap (galaxy 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="galaxy"] .settings-item i.fa-balance-scale[style*="36b693"],
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="54, 182, 147"],
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="d84558"],
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="216, 69, 88"],
body[data-theme="galaxy"] .settings-item i.fa-tools,
body[data-theme="galaxy"] .settings-item i.fa-traffic-light,
body[data-theme="galaxy"] .settings-item i.fa-box {
  display: inline-block;
  width: 48px;
  height: 48px;
  object-fit: contain;
  vertical-align: middle;
}
/* Galaxy */
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="36b693"],
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="54, 182, 147"] {
  content: url("../../assets/orbit-galaxy/coin-detail/avg-on.png");
}
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="d84558"],
body[data-theme="galaxy"] .settings-item i.fa-balance-scale[style*="216, 69, 88"] {
  content: url("../../assets/orbit-galaxy/coin-detail/avg-off.png");
}
body[data-theme="galaxy"] .settings-item i.fa-tools {
  content: url("../../assets/orbit-galaxy/coin-detail/formula.png");
}
body[data-theme="galaxy"] .settings-item i.fa-traffic-light {
  content: url("../../assets/orbit-galaxy/coin-detail/nonstop.png");
}
body[data-theme="galaxy"] .settings-item i.fa-box {
  content: url("../../assets/orbit-galaxy/coin-detail/partial.png");
}
body[data-theme="galaxy"] img[src*="setting.png"] {
  content: url("../../assets/orbit-galaxy/setting.png?v=2");
}
body[data-theme="galaxy"] img[src*="star-coin"] {
  content: url("../../assets/orbit-galaxy/star-coin.png");
}
/* =========================================================================
   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="galaxy"] #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="galaxy"] #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="galaxy"] #user-profit-summary h5[style*="#36b693"],
body[data-theme="galaxy"] #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="galaxy"] .modal .datepicker .datepicker-switch,
body[data-theme="galaxy"] .modal .datepicker .prev,
body[data-theme="galaxy"] .modal .datepicker .next,
body[data-theme="galaxy"] .modal .datepicker .dow,
body[data-theme="galaxy"] .modal .datepicker table tr td,
body[data-theme="galaxy"] .modal .datepicker table tr td span {
    color: var(--th-text, #E3E0EC) !important;
}
body[data-theme="galaxy"] .modal-header h2[style*="color: rgb(84, 84, 84)"],
body[data-theme="galaxy"] .modal-header h2[style*="color:#545454"] {
    color: var(--th-text, #E3E0EC) !important;
}
/* Tanggal bulan lain / disabled -> muted */
body[data-theme="galaxy"] .modal .datepicker table tr td.old,
body[data-theme="galaxy"] .modal .datepicker table tr td.new,
body[data-theme="galaxy"] .modal .datepicker table tr td span.old,
body[data-theme="galaxy"] .modal .datepicker table tr td span.new,
body[data-theme="galaxy"] .modal .datepicker table tr td.disabled,
body[data-theme="galaxy"] .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="galaxy"] .modal .datepicker table tr td.day:hover,
body[data-theme="galaxy"] .modal .datepicker table tr td.day.focused,
body[data-theme="galaxy"] .modal .datepicker table tr td span:hover,
body[data-theme="galaxy"] .modal .datepicker table tr td span.focused,
body[data-theme="galaxy"] .modal .datepicker .datepicker-switch:hover,
body[data-theme="galaxy"] .modal .datepicker .prev:hover,
body[data-theme="galaxy"] .modal .datepicker .next:hover,
body[data-theme="galaxy"] .modal .datepicker tfoot tr th:hover {
    background: rgba(233, 235, 237, 0.55) !important;
    background-image: none !important;
    color: #ffffff !important;
    border-radius: 6px !important;
}
body[data-theme="galaxy"] .modal .datepicker table tr td.day:hover,
body[data-theme="galaxy"] .modal .datepicker table tr td.day.focused,
body[data-theme="galaxy"] .modal .datepicker table tr td span:hover,
body[data-theme="galaxy"] .modal .datepicker table tr td span.focused,
body[data-theme="galaxy"] .modal .datepicker .datepicker-switch:hover,
body[data-theme="galaxy"] .modal .datepicker .prev:hover,
body[data-theme="galaxy"] .modal .datepicker .next:hover {
    background: rgba(233, 235, 237, 0.2) !important;
}
/* Cell terpilih (active) -> aksen gradient tema penuh */
body[data-theme="galaxy"] .modal .datepicker table tr td.active,
body[data-theme="galaxy"] .modal .datepicker table tr td.active:hover,
body[data-theme="galaxy"] .modal .datepicker table tr td.active.active,
body[data-theme="galaxy"] .modal .datepicker table tr td span.active,
body[data-theme="galaxy"] .modal .datepicker table tr td span.active:hover {
    background: var(--th-accent-grad) !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="galaxy"] .asset-filter-date .col-form-label.active,
body[data-theme="galaxy"] .profit-filter-date .col-form-label.active,
body[data-theme="galaxy"] .profit-summary-filter-date .col-form-label.active,
body[data-theme="galaxy"] .history-credit-filter-date .col-form-label.active {
    background: var(--th-accent-grad) !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="galaxy"] .asset-filter-date .col-form-label,
body[data-theme="galaxy"] .profit-filter-date .col-form-label,
body[data-theme="galaxy"] .profit-summary-filter-date .col-form-label,
body[data-theme="galaxy"] .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="galaxy"] #roiLoader {
  background: rgba(0, 0, 0, 0.9) !important;
}
body[data-theme="galaxy"] #roiLoader .spinner-border-custom {
  color: var(--th-accent) !important;
}
body[data-theme="galaxy"] .roi-powered-by {
  background-color: var(--th-surface-deep, var(--th-surface, var(--th-bg))) !important;
}
/* =========================================
   ROI BACKGROUND & LOGO DYNAMIC THEME
   ========================================= */
body[data-theme="galaxy"] #capture {
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4)),
                    url("../../assets/orbit-galaxy/bg-pg-roi.png?v=2") !important;
  background-size: cover, cover !important;
  background-position: center, center !important;
  background-repeat: no-repeat, no-repeat !important;
}
body[data-theme="galaxy"] .roi-card-logo {
  content: url("../../assets/orbit-galaxy/moonbot-roi-icon.png?v=2");
  filter: drop-shadow(0 0 8px rgba(233, 235, 237, 0.65)) drop-shadow(0 0 16px rgba(255, 255, 255, 0.35)) !important;
}
body[data-theme="galaxy"] #capture h1 {
  color: #F4F4F5 !important;
  text-shadow: 0 0 10px #FFFFFF, 0 0 4px #D9DBDE !important;
}
/* =========================================
   ROI CARDS — Galaxy Cosmic Silver Glass
   ========================================= */
body[data-theme="galaxy"] #capture .card-roi-bg {
  background: transparent !important;
  border-radius: 14px !important;
  padding: 0 !important;
  border: 1px solid rgba(233, 235, 237, 0.7) !important;
  box-shadow: 0 0 6px rgba(233, 235, 237, 0.28),
              0 0 14px rgba(233, 235, 237, 0.16),
              inset 0 0 30px rgba(233, 235, 237, 0.25),
              inset 0 0 60px rgba(233, 235, 237, 0.15) !important;
}
body[data-theme="galaxy"] #capture .card-content {
  background: rgba(10, 13, 20, 0.88) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 0 40px rgba(233, 235, 237, 0.08) !important;
}
/* Text Styles */
body[data-theme="galaxy"] #capture .roi-title-text,
body[data-theme="galaxy"] #capture .main-roi-title,
body[data-theme="galaxy"] #capture .roi-value-text,
body[data-theme="galaxy"] #capture .roi-total-title,
body[data-theme="galaxy"] #capture .roi-asset-title {
  background-image: linear-gradient(to top, #A1A1AA 0%, #FFFFFF 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  text-shadow: none !important;
}
body[data-theme="galaxy"] #capture .roi-summary-text {
  color: #A1A1AA !important;
}
body[data-theme="galaxy"] #capture .roi-value-text {
  filter: drop-shadow(0 0 6px rgba(233, 235, 237, 0.5));
}
body[data-theme="galaxy"] #capture .main-roi-title {
  filter: drop-shadow(0 0 6px rgba(0, 0, 0, 1))
          drop-shadow(0 0 16px rgba(0, 0, 0, 0.9))
          drop-shadow(0 0 2px rgba(255, 255, 255, 0.25));
}
body[data-theme="galaxy"] #capture .roi-notes {
  font-size: 11px !important;
  list-style: none !important;
}
body[data-theme="galaxy"] #capture .roi-notes li {
  position: relative;
  background-image: linear-gradient(to top, #A1A1AA 0%, #FFFFFF 100%) !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  line-height: 1.6 !important;
  background-size: 100% 1.6em !important;
  background-repeat: repeat-y !important;
}
body[data-theme="galaxy"] #capture .roi-notes li::before {
  content: "•";
  position: absolute;
  left: -0.9rem;
  top: 0;
  color: #E4E6EA;
  -webkit-text-fill-color: #E4E6EA;
  font-size: 14px;
  line-height: inherit;
  text-shadow: 0 0 5px rgba(233, 235, 237, 0.95),
               0 0 11px rgba(233, 235, 237, 0.7);
}
body[data-theme="galaxy"] #capture .card-content [style*="margin-bottom: 0.5rem"] {
  background: rgba(0, 0, 0, 0.5) !important;
  border: 1px solid rgba(233, 235, 237, 0.35) !important;
  border-radius: 8px !important;
  overflow: hidden !important;
}
body[data-theme="galaxy"] #capture .card-content [style*="margin-bottom: 0.5rem"]:not(:has(> div)) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Sel bulan/tahun: garis pemisah di kiri */
body[data-theme="galaxy"] #capture .card-content [style*="linear-gradient(0deg, #c8e3fa"],
body[data-theme="galaxy"] #capture .card-content [style*="linear-gradient(0deg, rgb(200, 227, 250)"] {
  background: transparent !important;
  border: none !important;
  border-left: 1px solid rgba(233, 235, 237, 0.25) !important;
  border-radius: 0 !important;
  padding: 4px 0 !important;
  box-shadow: none !important;
}
body[data-theme="galaxy"] #capture .card-content [style*="linear-gradient(0deg, #c8e3fa"]:first-child,
body[data-theme="galaxy"] #capture .card-content [style*="linear-gradient(0deg, rgb(200, 227, 250)"]:first-child {
  border-left: none !important;
}
body[data-theme="galaxy"] #capture .card-content [style*="background: #2b0099"],
body[data-theme="galaxy"] #capture .card-content [style*="background: rgb(43, 0, 153)"] {
  background: transparent !important;
  border: none !important;
  border-radius: 4px !important;
}
body[data-theme="galaxy"] #capture .card-content [style*="height: 30px"] {
  background-image: linear-gradient(to top, #A1A1AA 0%, #FFFFFF 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  font-weight: 600 !important;
}
body[data-theme="galaxy"] #capture .card-content [style*="background: #270186"],
body[data-theme="galaxy"] #capture .card-content [style*="background: rgb(39, 1, 134)"] {
  background: transparent !important;
  color: #E4E6EA !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.25) !important;
  padding-bottom: 3px !important;
  margin: 0 6px 4px 6px !important;
}
body[data-theme="galaxy"] #capture .card-content [style*="border: 2px solid rgb(156, 99, 216)"] {
  border-width: 1px !important;
  border-color: rgba(233, 235, 237, 0.85) !important;
  color: #FFFFFF !important;
  box-shadow: 0 0 8px rgba(233, 235, 237, 0.4) !important;
}
body[data-theme="galaxy"] #capture .card-content svg {
  color: #E4E6EA !important;
  fill: currentColor !important;
  filter: none !important;
}
/* =========================================
   HEADER MOONBOT LOGO DYNAMIC THEME
   ========================================= */
/* =========================================
   MOON LOGIC DROPDOWNS DYNAMIC THEME
   ========================================= */
body[data-theme="galaxy"] .custom-ta .myselect.form-custom {
  border-color: var(--th-accent) !important;
  background-color: transparent !important;
  margin-top: -2px !important;
}
body[data-theme="galaxy"] .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="galaxy"] 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="galaxy"] select.form-select-center {
  text-align: center !important;
}
body[data-theme="galaxy"] 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="galaxy"] select {
  color-scheme: dark;
}
body[data-theme="galaxy"] select option,
/* kalahkan .custom-ta .form-select option { background: #fff !important } di style.min.css */
body[data-theme="galaxy"] .custom-ta .form-select option {
  background-color: var(--th-surface-2, #25282B) !important;
  color: var(--th-text, #F4F4F5) !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="galaxy"] select.form-select,
body[data-theme="galaxy"] select.swal2-select {
  appearance: base-select;
}
body[data-theme="galaxy"] select.form-select::picker(select),
body[data-theme="galaxy"] select.swal2-select::picker(select) {
  appearance: base-select;
  background-color: var(--th-surface-2, #25282B);
  color: var(--th-text, #F4F4F5);
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45));
  border-radius: 10px;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2);
  padding: 8px 0;
}
/* Panah bawaan base-select tidak perlu: chevron sudah digambar .form-select */
body[data-theme="galaxy"] select.form-select::picker-icon {
  display: none;
}
body[data-theme="galaxy"] select.form-select option,
body[data-theme="galaxy"] select.swal2-select option {
  padding: 6px 12px;
}
body[data-theme="galaxy"] select.form-select option:hover,
body[data-theme="galaxy"] select.form-select option:focus,
body[data-theme="galaxy"] select.swal2-select option:hover,
body[data-theme="galaxy"] select.swal2-select option:focus {
  background-color: rgba(233, 235, 237, 0.15) !important;
}
/* =========================================
   GLOWING COMPONENTS (FOOTER & CARDS)
   ========================================= */
body[data-theme="galaxy"] #moon-logic-card-theme,
body[data-theme="galaxy"] #strategy-mode-card-theme,
body[data-theme="galaxy"] #ta-card-theme,
body[data-theme="galaxy"] #batch-ta-card-theme,
body[data-theme="galaxy"] #grouping-container,
body[data-theme="galaxy"] #money-management-card-theme {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 12px rgba(233, 235, 237, 0.25) !important;
}
body[data-theme="galaxy"] #money-management-card-theme .form-check[style*="border"] {
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.15) !important;
}
body[data-theme="galaxy"] #money-management-card-theme div[style*="color: rgb(0, 0, 0)"],
body[data-theme="galaxy"] #money-management-card-theme div[style*="color: #000"] {
  color: #ffffff !important;
}
body[data-theme="galaxy"] #moon-logic-card-theme p,
body[data-theme="galaxy"] #moon-logic-card-theme span {
  color: #ffffff !important;
}
/* iOS Switch — off-state */
body[data-theme="galaxy"] .ios-switch label::before,
body[data-theme="galaxy"] .ios-switch .custom-control-label::before {
  background-color: #2b2e35 !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
}
body[data-theme="galaxy"] .ios-switch label::after,
body[data-theme="galaxy"] .ios-switch .custom-control-label::after {
  background-color: #C0C3C8 !important;
  border: 1px solid rgba(0, 0, 0, 0.2) !important;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4) !important;
}
/* iOS Switch — on-state (Galaxy Silver Metallic) */
body[data-theme="galaxy"] .switch-green .ios-input:checked ~ .custom-control-label::before,
body[data-theme="galaxy"] .ios-switch .ios-input:checked ~ .custom-control-label::before,
body[data-theme="galaxy"] .ios-switch input:checked ~ label::before {
  background: linear-gradient(135deg, #FFFFFF 0%, #D9DBDE 45%, #989BA0 100%) !important;
  background-color: #D9DBDE !important;
  border: 1px solid #FFFFFF !important;
  box-shadow: 0 0 12px rgba(233, 235, 237, 0.45) !important;
}
body[data-theme="galaxy"] .switch-green .ios-input:checked ~ .custom-control-label::after,
body[data-theme="galaxy"] .ios-switch .ios-input:checked ~ .custom-control-label::after,
body[data-theme="galaxy"] .ios-switch input:checked ~ label::after {
  background-color: #121416 !important;
  border: 1px solid rgba(255, 255, 255, 0.3) !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.6) !important;
}
/* =========================================================
   GALAXY THEME: FLOATING FOOTER NAVIGATION BAR (#footer-bar)
   ========================================================= */
body[data-theme="galaxy"] #footer-bar.footer-bar-1 {
  position: fixed !important;
  left: 7px !important;
  right: 7px !important;
  bottom: 15px !important;
  background-color: var(--th-surface-glass, rgba(18, 20, 24, 0.92)) !important;
  background: var(--th-surface-glass, rgba(18, 20, 24, 0.92)) !important;
  background-image: none !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-radius: 25px !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6),
              0 0 15px rgba(233, 235, 237, 0.2),
              inset 0 0 8px rgba(233, 235, 237, 0.15) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  filter: none !important;
  height: 50px !important;
  display: flex !important;
  align-items: center !important;
  z-index: 99 !important;
}
body[data-theme="galaxy"] #footer-bar.footer-bar-1 .footer-divider {
  background-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  opacity: 0.5 !important;
  width: 1px !important;
  height: 24px !important;
  margin: 0 !important;
}
/* =========================================
   THEME HEADERS (Moon Logic dll)
   ========================================= */
body[data-theme="galaxy"] .top-header.sticky.theme-header {
  background: url("../../assets/orbit-galaxy/bg-pg-api-2.png?v=2") center/cover no-repeat !important;
  background-color: transparent !important;
}
/* =========================================
   MENU ICONS GRADIENT
   ========================================= */
body[data-theme="galaxy"] #home-dropdown-list i {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* =========================================================================
   ASSET / CREDIT PAGE THEMING (Elite, Galaxy, Black)
   ========================================================================= */
/* 1. Stacking context for video background */
body[data-theme="galaxy"] #asset-page .theme-light {
  position: relative;
  z-index: 0;
}
body[data-theme="galaxy"] #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="galaxy"] #asset-page moonbot-bg {
  display: none !important;
}
/* 2. Header transparency on scroll (matches coin-details-header) */
body[data-theme="galaxy"] #asset-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* 3. Transparent cards for Galaxy theme */
body[data-theme="galaxy"] #user-asset > .content,
body[data-theme="galaxy"] #div-withdrawal-asset {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 12px rgba(233, 235, 237, 0.15) !important;
  backdrop-filter: blur(10px);
}
/* 4. Tab group card container */
body[data-theme="galaxy"] #asset-page .pt-2 > .card.card-style.bg-white,
body[data-theme="galaxy"] #asset-page .pt-2 > .card.card-style,
body[data-theme="galaxy"] #asset-page .card.card-style.bg-white {
  min-height: calc(100vh - 240px) !important;
  background-color: rgba(18, 20, 22, 0.85) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !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 12px rgba(233, 235, 237, 0.15) !important;
  margin: 0 !important;
  padding-bottom: 90px !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
body[data-theme="galaxy"] #tab-group-credit .content:not(.tab-controls) {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* 4b. Hide dividers that look like ugly borders */
body[data-theme="galaxy"] #asset-page .divider {
  display: none !important;
}
/* 5. Override inline white backgrounds in history lists */
body[data-theme="galaxy"] #asset-page [style*="background-color: rgb(255, 255, 255)"]:not(.month-summary-separator),
body[data-theme="galaxy"] #asset-page [style*="background-color: white"]:not(.month-summary-separator),
body[data-theme="galaxy"] #asset-page [style*="background-color:#fff"]:not(.month-summary-separator),
body[data-theme="galaxy"] #asset-page [style*="background-color: #fff"]:not(.month-summary-separator) {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
}
/* 6. History List text colors for Galaxy (#asset-page, #tab-credit, #tab-withdraw) */
body[data-theme="galaxy"] #asset-page .color-black,
body[data-theme="galaxy"] #asset-page a[style*="color: black"],
body[data-theme="galaxy"] #asset-page a[style*="color:black"],
body[data-theme="galaxy"] #asset-page h5[style*="color: rgb(134, 135, 138)"],
body[data-theme="galaxy"] #asset-page p[style*="color: rgb(134, 135, 138)"],
body[data-theme="galaxy"] #asset-page .font-500,
body[data-theme="galaxy"] #asset-page .font-500[style*="color: black"],
body[data-theme="galaxy"] #asset-page .font-500[style*="color:black"],
body[data-theme="galaxy"] #tab-credit a.font-500,
body[data-theme="galaxy"] #tab-withdraw a.font-500,
body[data-theme="galaxy"] #asset-page label.color-black,
body[data-theme="galaxy"] #asset-page a.color-black,
body[data-theme="galaxy"] #asset-page .filter-box,
body[data-theme="galaxy"] #profit-page .filter-box,
body[data-theme="galaxy"] #bonus-page .filter-box,
body[data-theme="galaxy"] #profit-summary .filter-box,
body[data-theme="galaxy"] .filter-box,
body[data-theme="galaxy"] #asset-page .filter-box *,
body[data-theme="galaxy"] #profit-page .filter-box *,
body[data-theme="galaxy"] #bonus-page .filter-box *,
body[data-theme="galaxy"] #profit-summary .filter-box *,
body[data-theme="galaxy"] .filter-box * {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

/* Teks tanggal withdraw (created_at) & baris list penarikan -> Putih Terang */
body[data-theme="galaxy"] #tab-withdraw .d-flex.py-1.my-1 p.font-12,
body[data-theme="galaxy"] #tab-withdraw [is="withdrawal_record_list"] p.font-12,
body[data-theme="galaxy"] #tab-withdraw [is="withdrawal_record_list"] .align-self-center.text-start p,
body[data-theme="galaxy"] #tab-withdraw .align-self-center.text-start p,
body[data-theme="galaxy"] #tab-withdraw-bonus .d-flex.py-1.my-1 p.font-12,
body[data-theme="galaxy"] #tab-withdraw-bonus [is="withdrawal_record_list"] p.font-12,
body[data-theme="galaxy"] #tab-withdraw-bonus [is="withdrawal_record_list"] .align-self-center.text-start p,
body[data-theme="galaxy"] #tab-withdraw-bonus .align-self-center.text-start p,
body[data-theme="galaxy"] #tab-withdraw p.font-12,
body[data-theme="galaxy"] #tab-withdraw-bonus p.font-12,
body[data-theme="galaxy"] #asset-credit-info-page p.font-12 {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  opacity: 1 !important;
  line-height: 1.45 !important;
  margin-bottom: 0 !important;
}

/* Header tabel Withdraw History (Date, USDT, Tx Hash, Status) */
body[data-theme="galaxy"] #tab-withdraw .searchBar-container p,
body[data-theme="galaxy"] #tab-withdraw-bonus .searchBar-container p {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  opacity: 0.9 !important;
}

/* Panel latar di belakang daftar Kredit / Penarikan transparan */
body[data-theme="galaxy"] #tab-credit [style*="background-color: white"],
body[data-theme="galaxy"] #tab-withdraw [style*="background-color: white"],
body[data-theme="galaxy"] #tab-credit > .pt-1 > div,
body[data-theme="galaxy"] #tab-withdraw > .pt-1 > div {
  background-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
}

/* 7. Input fields in withdrawal */
body[data-theme="galaxy"] #div-withdrawal-asset input.form-control,
body[data-theme="galaxy"] #div-withdrawal-bonus input.form-control {
  background-color: #000000 !important;
  background: #000000 !important;
  color: #fff !important;
  border-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}
/* 8. Fix icon gradients in header */
body[data-theme="galaxy"] #asset-header .bi,
body[data-theme="galaxy"] #asset-header i:not(.font-16):not([style*="font-style: normal"]),
body[data-theme="galaxy"] #vue-download-csv-asset-credit i,
body[data-theme="galaxy"] #button-credit-downloads i {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  display: inline-block;
}
/* 9. Filter dropdown: dark bg + thin silver border + subtle glow */
body[data-theme="galaxy"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] {
  background-color: var(--th-surface-2, #25282B) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] .dropdown-item {
  color: var(--th-text, #F4F4F5) !important;
}
body[data-theme="galaxy"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] .dropdown-item:hover,
body[data-theme="galaxy"] #asset-page ul.dropdown-menu[aria-labelledby="asset-filter-name"] .dropdown-item.active {
  background-color: var(--th-border, rgba(233, 235, 237, 0.45)) !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="galaxy"] #profit-page #elite-bg-video,
body[data-theme="galaxy"] #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="galaxy"] #profit-page moonbot-bg,
body[data-theme="galaxy"] #strategy-page moonbot-bg {
  display: none !important;
}
/* Header when scrolled: no image, 80% dark */
body[data-theme="galaxy"] #tab-user-profit.header-scrolled,
body[data-theme="galaxy"] #strategy-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="galaxy"] #tab-user-profit .bi,
body[data-theme="galaxy"] #strategy-header .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Container transparency for Drawers and Strategy Page */
body[data-theme="galaxy"] #strategy-content > .content,
body[data-theme="galaxy"] #strategy-content .content[style*="background: white"],
body[data-theme="galaxy"] #strategy-content [style*="background: white"],
body[data-theme="galaxy"] #strategy-content [style*="background-color: white"],
body[data-theme="galaxy"] #strategy-content [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] .offcanvas .footer-clear > .content {
  background: transparent !important;
  background-color: transparent !important;
}

/* Strategy cards -> Galaxy Dark Glass @80% */
body[data-theme="galaxy"] #profit-page .card.card-style,
body[data-theme="galaxy"] #strategy-page .card.card-style,
body[data-theme="galaxy"] #strategy-content .card.card-style,
body[data-theme="galaxy"] #strategy-page #strategy-mode-card-theme,
body[data-theme="galaxy"] #strategy-page #grouping-container,
body[data-theme="galaxy"] #strategy-page #money-management-card-theme,
body[data-theme="galaxy"] #strategy-page #strategy-ta-card-theme {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* Profit list card: diperpanjang langsung sampai bawah layar tanpa border melengkung di bawah */
body[data-theme="galaxy"] #profit-page .pt-1.mt-2 > .card.card-style,
body[data-theme="galaxy"] #profit-page #user-profit .pt-1.mt-2 > .card.card-style,
body[data-theme="galaxy"] #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="galaxy"] #profit-page .pt-1.mt-2 > .card.card-style > .content,
body[data-theme="galaxy"] #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="galaxy"] #profit-page .pt-1.mt-2 > .card.card-style > .d-flex,
body[data-theme="galaxy"] #profit-page .card.card-style > .d-flex {
  padding-left: 8px !important;
  padding-right: 8px !important;
}
body[data-theme="galaxy"] #profit-page .pt-1.mt-2 > .card.card-style > .d-flex > a.font-500,
body[data-theme="galaxy"] #profit-page .card.card-style > .d-flex > a.font-500 {
  margin-left: 0 !important;
  margin-right: 0 !important;
}
body[data-theme="galaxy"] #profit-page .pt-1.mt-2 > .card.card-style > .d-flex > .filter-box,
body[data-theme="galaxy"] #profit-page .card.card-style > .d-flex > .filter-box {
  margin-right: 0 !important;
}
body[data-theme="galaxy"] #user-profit .card.card-style > .content,
body[data-theme="galaxy"] #user-profit-summary .card.card-style > .content {
  margin: 0 !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body[data-theme="galaxy"] #profit-page #tab-group-profit .d-flex[aria-expanded]:not(.month-summary-separator) {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Strategy Text, Risk Labels & Subtitles */
body[data-theme="galaxy"] #strategy-page [style*="color: #924be1"]:not([style*="background-color"]),
body[data-theme="galaxy"] #strategy-page [style*="color:#924be1"]:not([style*="background-color"]),
body[data-theme="galaxy"] #strategy-page [style*="color: rgb(146, 75, 225)"]:not([style*="background-color"]),
body[data-theme="galaxy"] #strategy-page .color-purple,
body[data-theme="galaxy"] #strategy-page h5.color-purple,
body[data-theme="galaxy"] #strategy-content [style*="color: #924be1"] {
  color: var(--th-accent-2, #E4E6EA) !important;
}

body[data-theme="galaxy"] #strategy-page .small-text,
body[data-theme="galaxy"] #strategy-page span.small-text,
body[data-theme="galaxy"] #strategy-page .color-gray-dark {
  color: var(--th-text-secondary, #C5C4C7) !important;
}

/* Option button in Coin Groups (Pil Option) */
body[data-theme="galaxy"] .btn-option,
body[data-theme="galaxy"] #strategy-page .btn-option,
body[data-theme="galaxy"] #grouping-container .btn-option {
  border: 1px solid var(--th-border-solid, #E9EBED) !important;
  color: var(--th-text, #F4F4F5) !important;
  background: rgba(233, 235, 237, 0.1) !important;
  border-radius: 20px !important;
}

/* Ultimate strategy highlight row */
body[data-theme="galaxy"] #ultimate-strategy {
  border: 2px solid var(--th-border-solid, #E9EBED) !important;
  box-shadow: 0 0 10px rgba(233, 235, 237, 0.35) !important;
}

body[data-theme="galaxy"] #ultimate-strategy [style*="color: #924be1"],
body[data-theme="galaxy"] #ultimate-strategy .small-text {
  color: var(--th-text, #F4F4F5) !important;
}


/* Strategy inputs & selects */
body[data-theme="galaxy"] #strategy-content .form-control,
body[data-theme="galaxy"] #strategy-content .form-select {
  background-color: transparent !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  color: var(--th-text, #F4F4F5) !important;
}

body[data-theme="galaxy"] #strategy-content .form-control::placeholder {
  color: var(--th-text-muted, #9C9BA0) !important;
}

/* Buttons in strategy page */
body[data-theme="galaxy"] #strategy-page .btn-uni,
body[data-theme="galaxy"] #strategy-page button[onclick*="Calculate"],
body[data-theme="galaxy"] #strategy-page a[style*="background-color: #742bf4"],
body[data-theme="galaxy"] #strategy-page button[style*="background-color: #742bf4"],
body[data-theme="galaxy"] #strategy-page a[style*="background-color: rgb(116, 43, 244)"],
body[data-theme="galaxy"] #strategy-page button[style*="background-color: rgb(116, 43, 244)"],
body[data-theme="galaxy"] #strategy-page a[style*="background-color: #924be1"],
body[data-theme="galaxy"] #strategy-page button[style*="background-color: #924be1"] {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 600 !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
    inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

/* Inline white backgrounds -> Galaxy Dark Glass @80% */
body[data-theme="galaxy"] #profit-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #profit-page [style*="background-color: white"],
body[data-theme="galaxy"] #profit-page [style*="background-color: #fff"],
body[data-theme="galaxy"] #strategy-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #strategy-page [style*="background-color: white"],
body[data-theme="galaxy"] #strategy-page [style*="background-color: #fff"] {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
}
/* =========================================================================
   ROI SETTING + MOON LOGIC + FEE (CASHBACK/BNB) — video bg + theme
   ========================================================================= */
/* Video background (child of the offcanvas) */
body[data-theme="galaxy"] #roi-setting #elite-bg-video,
body[data-theme="galaxy"] #formula-moon-logic #elite-bg-video,
body[data-theme="galaxy"] #fee-setting-information-page #elite-bg-video,
body[data-theme="galaxy"] #fee-setting-buy-bnb-page #elite-bg-video,
body[data-theme="galaxy"] #info-profit #elite-bg-video,
body[data-theme="galaxy"] #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="galaxy"] #vue-tab-info-profit,
body[data-theme="galaxy"] #vue-tab-asset_credit_info {
  background: transparent !important;
  background-image: none !important;
}
body[data-theme="galaxy"] #vue-tab-info-profit.header-scrolled,
body[data-theme="galaxy"] #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="galaxy"] #vue-asset_credit_info,
body[data-theme="galaxy"] #vue-asset_credit_info > div,
body[data-theme="galaxy"] #vue-asset_credit_info .content {
  min-height: calc(100vh - 60px) !important;
}
body[data-theme="galaxy"] #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="galaxy"] #header-formula-moon-logic {
  background: transparent !important;
  background-image: none !important;
}
body[data-theme="galaxy"] #tab-roi-setting {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
}
/* Header when scrolled -> 80% dark, no image */
body[data-theme="galaxy"] #tab-roi-setting.header-scrolled,
body[data-theme="galaxy"] #header-formula-moon-logic.header-scrolled,
body[data-theme="galaxy"] #fee-setting-information-header.header-scrolled,
body[data-theme="galaxy"] #fee-setting-buy-bnb-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
body[data-theme="galaxy"] #tab-profit-roi,
body[data-theme="galaxy"] #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="galaxy"] #tab-roi-setting .bi,
body[data-theme="galaxy"] #tab-profit-roi .bi,
body[data-theme="galaxy"] #user-roi-setting .bi,
body[data-theme="galaxy"] #vue-tab-info-profit .bi,
body[data-theme="galaxy"] #vue-tab-asset_credit_info .bi,
body[data-theme="galaxy"] #header-formula-moon-logic .bi,
body[data-theme="galaxy"] #fee-setting-information-header .bi,
body[data-theme="galaxy"] #fee-setting-buy-bnb-header .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards + inline white backgrounds -> Galaxy Dark Glass @80% */
body[data-theme="galaxy"] #roi-setting .card.card-style,
body[data-theme="galaxy"] #formula-moon-logic .card.card-style,
body[data-theme="galaxy"] #fee-setting-information-page .card.card-style,
body[data-theme="galaxy"] #fee-setting-buy-bnb-page .card.card-style {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
body[data-theme="galaxy"] #collapse-list-5 {
  background-color: transparent !important;
}
/* =========================================================================
   SAVING (#saving-page) — video bg + theme
   ========================================================================= */
/* Video background: FIXED to the panel viewport so it never scrolls with content */
body[data-theme="galaxy"] #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="galaxy"] #saving-page {
  overscroll-behavior: contain;
}
body[data-theme="galaxy"] #saving-page moonbot-bg {
  display: none !important;
}
/* Header when scrolled -> 80% dark, no image */
body[data-theme="galaxy"] #staking-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="galaxy"] #staking-header .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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="galaxy"] #saving-page .card.card-style {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
/* =========================================================================
   SAVING HISTORY / KEUNTUNGAN HARIAN (#saving-history) — video bg + cards
   ========================================================================= */
body[data-theme="galaxy"] #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 awal, solid silver dark saat scroll */
body[data-theme="galaxy"] #vue-tab-saving-history {
  background: transparent !important;
  background-image: none !important;
}
body[data-theme="galaxy"] #vue-tab-saving-history.header-scrolled {
  background-image: none !important;
  background-color: rgba(5, 7, 8, 0.95) !important;
  background-size: auto !important;
}
body[data-theme="galaxy"] #vue-tab-saving-history .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Cards: floating glass cards dengan border silver halus & shadow neon lembut */
body[data-theme="galaxy"] #vue-saving-history .card.card-style {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  margin: 12px 15px !important;
  border-radius: 12px !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.12) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
/* Divider dalam card */
body[data-theme="galaxy"] #vue-saving-history .divider {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
  opacity: 0.6 !important;
}
/* Teks utama di kartu */
body[data-theme="galaxy"] #vue-saving-history p {
  color: var(--th-text, #F4F4F5) !important;
}
/* Label kecil (Tanggal, Nama Token, Keuntungan) */
body[data-theme="galaxy"] #vue-saving-history .font-11:not(.color-black):not(.color-theme) {
  color: var(--th-text-muted, #9C9BA0) !important;
}
/* Settlement ID / Order number */
body[data-theme="galaxy"] #vue-saving-history .color-black,
body[data-theme="galaxy"] #vue-saving-history .color-theme,
body[data-theme="galaxy"] #vue-saving-history [style*="color: black"],
body[data-theme="galaxy"] #vue-saving-history [style*="color:black"] {
  color: #FFFFFF !important;
  font-weight: 600 !important;
}
/* Nama koin (USDT) -> override warna ungu menjadi silver accent tema galaxy */
body[data-theme="galaxy"] #vue-saving-history [style*="color: rgb(146, 76, 227)"],
body[data-theme="galaxy"] #vue-saving-history [style*="color:rgb(146, 76, 227)"],
body[data-theme="galaxy"] #vue-saving-history [style*="color: rgb(146,76,227)"],
body[data-theme="galaxy"] #vue-saving-history [style*="color:rgb(146,76,227)"],
body[data-theme="galaxy"] #vue-saving-history [style*="color: #924ce3"],
body[data-theme="galaxy"] #vue-saving-history [style*="color:#924ce3"] {
  color: var(--th-accent, #D9DBDE) !important;
  font-weight: 700 !important;
}
/* Nilai Keuntungan (Hijau positif) */
body[data-theme="galaxy"] #vue-saving-history [style*="color: #36b693"],
body[data-theme="galaxy"] #vue-saving-history [style*="color: rgb(54, 182, 147)"],
body[data-theme="galaxy"] #vue-saving-history [style*="color:rgb(54, 182, 147)"] {
  color: var(--th-status-positive, #4ED58B) !important;
  font-weight: 700 !important;
}
/* Saving Coin Info Drawer */
body[data-theme="galaxy"] #vue-saving-info-coin .card.card-style {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-radius: 12px !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
body[data-theme="galaxy"] #vue-saving-info-coin p {
  color: var(--th-text, #F4F4F5) !important;
}
body[data-theme="galaxy"] #vue-saving-info-coin .font-11,
body[data-theme="galaxy"] #vue-saving-info-coin .font-13 {
  color: var(--th-text-muted, #9C9BA0) !important;
}
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color: rgb(146, 76, 227)"],
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color:rgb(146, 76, 227)"],
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color: rgb(146,76,227)"],
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color:rgb(146,76,227)"],
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color: #924ce3"],
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color:#924ce3"] {
  color: var(--th-accent, #D9DBDE) !important;
  font-weight: 700 !important;
}
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color: #212121"],
body[data-theme="galaxy"] #vue-saving-info-coin [style*="color:#212121"] {
  color: #FFFFFF !important;
}
/* =========================================================================
   BONUS (#bonus-page) + FEE DETAIL (#fee-setting-information-detail-page)
   ========================================================================= */
body[data-theme="galaxy"] #bonus-page #elite-bg-video,
body[data-theme="galaxy"] #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="galaxy"] #bonus-page moonbot-bg {
  display: none !important;
}
/* Header scrolled -> 80% dark */
body[data-theme="galaxy"] #user-bonus-header.header-scrolled,
body[data-theme="galaxy"] #fee-setting-information-detail-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Header icons gradient */
body[data-theme="galaxy"] #user-bonus-header .bi,
body[data-theme="galaxy"] #fee-setting-information-detail-header .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Tab Controls for Bonus & Asset Pages (Cashback & Withdraw History) */
body[data-theme="galaxy"] #asset-page #tab-group-credit > .tab-controls,
body[data-theme="galaxy"] #bonus-page #tab-group-bonus > .tab-controls,
body[data-theme="galaxy"] .tab-controls {
  margin-top: 5px !important;
  background-color: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-radius: 8px !important;
  padding: 2px !important;
  display: flex !important;
}

body[data-theme="galaxy"] #asset-page #tab-group-credit > .tab-controls a,
body[data-theme="galaxy"] #bonus-page #tab-group-bonus > .tab-controls a,
body[data-theme="galaxy"] .tab-controls a {
  flex: 1;
  margin: 0 !important;
  border-radius: 6px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--th-text-secondary, #C5C4C7) !important;
  transition: all 0.25s ease;
}

body[data-theme="galaxy"] #asset-page #tab-group-credit > .tab-controls a.active,
body[data-theme="galaxy"] #asset-page #tab-group-credit > .tab-controls a[aria-expanded="true"],
body[data-theme="galaxy"] #bonus-page #tab-group-bonus > .tab-controls a.active,
body[data-theme="galaxy"] #bonus-page #tab-group-bonus > .tab-controls a[aria-expanded="true"],
body[data-theme="galaxy"] .tab-controls a.active,
body[data-theme="galaxy"] .tab-controls a[aria-expanded="true"] {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 600 !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
    inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

/* Fee Details & Bonus Cards: Galaxy Theme */
body[data-theme="galaxy"] #fee-setting-buy-bnb-content > .content,
body[data-theme="galaxy"] #fee-setting-information-content > .content,
body[data-theme="galaxy"] #fee-setting-information-detail-content > .content,
body[data-theme="galaxy"] #fee-setting-information-detail-content .content,
body[data-theme="galaxy"] #fee-setting-information-detail-page [style*="background: white"],
body[data-theme="galaxy"] #fee-setting-information-detail-content [style*="background: white"] {
  background: transparent !important;
  background-color: transparent !important;
}

body[data-theme="galaxy"] #bonus-page .pt-2 > .card.card-style,
body[data-theme="galaxy"] #bonus-page .pt-2 > .card.card-style.bg-white,
body[data-theme="galaxy"] #bonus-page .card.card-style,
body[data-theme="galaxy"] #fee-setting-buy-bnb-content .card.card-style,
body[data-theme="galaxy"] #fee-setting-information-content .card.card-style,
body[data-theme="galaxy"] #fee-setting-information-detail-content .card.card-style,
body[data-theme="galaxy"] #fee-setting-information-detail-page .card.card-style,
body[data-theme="galaxy"] #fee-setting-information-detail-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #fee-setting-information-detail-page [style*="background-color: white"],
body[data-theme="galaxy"] #fee-setting-information-detail-page [style*="background-color: #fff"],
body[data-theme="galaxy"] #fee-setting-information-detail-content [style*="background-color: white"],
body[data-theme="galaxy"] #fee-setting-information-detail-content [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #fee-setting-information-detail-content [style*="background-color: #fff"] {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

body[data-theme="galaxy"] #bonus-page #tab-bonus > div,
body[data-theme="galaxy"] #bonus-page #tab-withdraw-bonus > .pt-1 > div,
body[data-theme="galaxy"] #bonus-page .pt-2 > .card.card-style > .content,
body[data-theme="galaxy"] #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="galaxy"] #bonus-page [style*="background-color: white"],
body[data-theme="galaxy"] #bonus-page [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #bonus-page [style*="background-color: rgba(255, 255, 255, 1)"],
body[data-theme="galaxy"] #bonus-page [style*="background-color: #fff"] {
  background-color: transparent !important;
}

/* Fix "Summary List" header, datepicker & labels */
body[data-theme="galaxy"] .filter-box,
body[data-theme="galaxy"] #asset-page .filter-box,
body[data-theme="galaxy"] #profit-page .filter-box,
body[data-theme="galaxy"] #bonus-page .filter-box,
body[data-theme="galaxy"] #profit-summary .filter-box {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-radius: 8px !important;
  padding: 0 8px !important;
  color: #FFFFFF !important;
}

body[data-theme="galaxy"] .filter-box i,
body[data-theme="galaxy"] .filter-box label,
body[data-theme="galaxy"] .filter-box .col-form-label,
body[data-theme="galaxy"] .filter-box .color-black,
body[data-theme="galaxy"] .filter-box span,
body[data-theme="galaxy"] .filter-box div,
body[data-theme="galaxy"] #profit-datepicker-text,
body[data-theme="galaxy"] #asset-datepicker-text,
body[data-theme="galaxy"] #profit-summary-datepicker-text,
body[data-theme="galaxy"] #bonus-datepicker-text,
body[data-theme="galaxy"] #roi-datepicker-text,
body[data-theme="galaxy"] #profit-page .filter-box *,
body[data-theme="galaxy"] #bonus-page .filter-box *,
body[data-theme="galaxy"] #profit-summary .filter-box *,
body[data-theme="galaxy"] #asset-page .filter-box * {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}

body[data-theme="galaxy"] .modal button[id*="show-all"],
body[data-theme="galaxy"] #profit-show-all,
body[data-theme="galaxy"] #asset-show-all,
body[data-theme="galaxy"] #roi-show-all,
body[data-theme="galaxy"] #bonus-show-all {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-galaxy/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;
}

body[data-theme="galaxy"] #bonus-page #tab-bonus > div a.font-500,
body[data-theme="galaxy"] #bonus-page #tab-withdraw-bonus a.font-500 {
  color: #FFFFFF !important;
}

body[data-theme="galaxy"] #bonus-page .searchBar-container {
  background-color: transparent !important;
}

body[data-theme="galaxy"] #bonus-page .searchBar-container p {
  color: var(--th-text-secondary, #C5C4C7) !important;
}

/* Summary list items (dates, summary titles, dividers) */
body[data-theme="galaxy"] #bonus-page [is="summary_list"] h5,
body[data-theme="galaxy"] #bonus-page .color-purple,
body[data-theme="galaxy"] #bonus-page h5.color-purple {
  color: var(--th-text, #F4F4F5) !important;
}

/* =========================================================================
   MONTHLY SUMMARY SEPARATOR (Profit, Asset, Bonus) — GALAXY THEME
   Container pemisah bulan dengan bentuk rounded capsule rapi seperti di Elite/Purple,
   beraksen gradasi silver metalik
   ========================================================================= */
body[data-theme="galaxy"] .month-summary-separator,
body[data-theme="galaxy"] .profit-summary-row,
body[data-theme="galaxy"] [style*="background-color: rgba(0, 0, 0, 0.04)"],
body[data-theme="galaxy"] [style*="background-color:rgba(0,0,0,0.04)"],
body[data-theme="galaxy"] #profit-page .month-summary-separator,
body[data-theme="galaxy"] #profit-page .d-flex.month-summary-separator,
body[data-theme="galaxy"] #profit-page .d-flex[style*="0.04"],
body[data-theme="galaxy"] #asset-page .month-summary-separator,
body[data-theme="galaxy"] #asset-page .d-flex.month-summary-separator,
body[data-theme="galaxy"] #asset-page .d-flex[style*="0.04"],
body[data-theme="galaxy"] #user-asset .month-summary-separator,
body[data-theme="galaxy"] #tab-group-credit .month-summary-separator,
body[data-theme="galaxy"] #bonus-page .month-summary-separator,
body[data-theme="galaxy"] #bonus-page .d-flex.month-summary-separator,
body[data-theme="galaxy"] #bonus-page .d-flex[style*="0.04"],
body[data-theme="galaxy"] #user-bonus .month-summary-separator {
  background-color: #23272e !important;
  background: #23272e !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-left: 4px solid var(--th-accent, #D9DBDE) !important;
  border-radius: 6px !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
  margin-top: 10px !important;
  margin-bottom: 10px !important;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

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

body[data-theme="galaxy"] .month-summary-separator h5:not(.color-theme) {
  color: #00C076 !important;
  font-weight: 700 !important;
}

body[data-theme="galaxy"] #bonus-page .bi-chevron-right {
  color: var(--th-text-secondary, #C5C4C7) !important;
}

body[data-theme="galaxy"] #bonus-page .divider {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
  opacity: 0.5 !important;
}

/* Fix text colors inside BNB fee settings & Bonus */
body[data-theme="galaxy"] #bonus-page .color-black,
body[data-theme="galaxy"] #bonus-page [style*="color: rgb(33, 33, 33)"],
body[data-theme="galaxy"] #bonus-page [style*="color: black"],
body[data-theme="galaxy"] #bonus-page [style*="color:black"],
body[data-theme="galaxy"] #fee-setting-buy-bnb-content [style*="color:black"],
body[data-theme="galaxy"] #fee-setting-buy-bnb-content [style*="color: black"],
body[data-theme="galaxy"] #fee-setting-information-content [style*="color:black"],
body[data-theme="galaxy"] #fee-setting-information-content [style*="color: black"],
body[data-theme="galaxy"] #fee-setting-information-detail-content [style*="color:black"],
body[data-theme="galaxy"] #fee-setting-information-detail-content [style*="color: black"],
body[data-theme="galaxy"] #fee-setting-information-detail-page .color-black,
body[data-theme="galaxy"] #fee-setting-information-detail-page [style*="color: rgb(33, 33, 33)"],
body[data-theme="galaxy"] #fee-setting-information-detail-page [style*="color: black"] {
  color: var(--th-text, #F4F4F5) !important;
}

body[data-theme="galaxy"] #fee-setting-buy-bnb-content .card.card-style h5,
body[data-theme="galaxy"] #fee-setting-information-content .card.card-style h5,
body[data-theme="galaxy"] #fee-setting-information-detail-content .card.card-style h5,
body[data-theme="galaxy"] #fee-setting-buy-bnb-content .card.card-style span,
body[data-theme="galaxy"] #fee-setting-information-content .card.card-style span,
body[data-theme="galaxy"] #fee-setting-information-detail-content .card.card-style span,
body[data-theme="galaxy"] #fee-setting-information-detail-content .text-dark,
body[data-theme="galaxy"] #fee-setting-information-detail-page .text-dark {
  color: var(--th-text, #F4F4F5) !important;
}

body[data-theme="galaxy"] #fee-setting-information-detail-content .text-muted,
body[data-theme="galaxy"] #fee-setting-information-detail-page .text-muted {
  color: var(--th-text-secondary, #C5C4C7) !important;
}

body[data-theme="galaxy"] #fee-setting-information-detail-content .divider,
body[data-theme="galaxy"] #fee-setting-information-detail-page .divider {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
  opacity: 0.5 !important;
}

body[data-theme="galaxy"] #fee-setting-information-detail-content .history-item {
  border-bottom: 1px solid var(--th-divider, rgba(77, 80, 84, 0.3)) !important;
}

body[data-theme="galaxy"] #fee-setting-buy-bnb-content .form-control,
body[data-theme="galaxy"] #fee-setting-information-content .form-control,
body[data-theme="galaxy"] #fee-setting-information-detail-content .form-control {
  background-color: transparent !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  color: var(--th-text, #F4F4F5) !important;
}

body[data-theme="galaxy"] #fee-setting-buy-bnb-content .form-control::placeholder,
body[data-theme="galaxy"] #fee-setting-information-content .form-control::placeholder,
body[data-theme="galaxy"] #fee-setting-information-detail-content .form-control::placeholder {
  color: var(--th-text-muted, #9C9BA0) !important;
}

/* Buy BNB Button -> sama seperti elit & black (gaya hijau start.png) */
body[data-theme="galaxy"] a[href="#fee-setting-buy-bnb-page"],
body[data-theme="galaxy"] #fee-setting-information-detail-content a[href="#fee-setting-buy-bnb-page"],
body[data-theme="galaxy"] #fee-setting-information-detail-content .btn-investor-mode {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-galaxy/start.png")) !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="galaxy"] a[href="#fee-setting-buy-bnb-page"] h6,
body[data-theme="galaxy"] #fee-setting-information-detail-content .btn-investor-mode h6 {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 600 !important;
}
/* =========================================================================
   SUMMARY (#summary-page) — video bg + theme (mirror bonus)
   ========================================================================= */
body[data-theme="galaxy"] #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="galaxy"] #tab-summary.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="galaxy"] #tab-summary .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Summary (#summary-page / #user-summary) */
body[data-theme="galaxy"] #user-summary .content,
body[data-theme="galaxy"] #user-summary [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #user-summary [style*="background-color: rgba(255, 255, 255, 1)"],
body[data-theme="galaxy"] #user-summary [style*="background-color: white"],
body[data-theme="galaxy"] #user-summary [style*="background-color: #fff"] {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.15) !important;
}
/* Labels -> Secondary Silver */
body[data-theme="galaxy"] #user-summary h6,
body[data-theme="galaxy"] #user-summary h6.opacity-50,
body[data-theme="galaxy"] #user-summary [style*="color: black"],
body[data-theme="galaxy"] #user-summary [style*="color:black"],
body[data-theme="galaxy"] #user-summary .color-black {
  color: var(--th-text-secondary, #C5C4C7) !important;
  opacity: 0.85 !important;
}
/* Amounts -> Bright Crisp White */
body[data-theme="galaxy"] #user-summary i.font-500,
body[data-theme="galaxy"] #user-summary i[style*="color: black"],
body[data-theme="galaxy"] #user-summary i[style*="color:black"] {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}
/* Divider */
body[data-theme="galaxy"] #user-summary .divider,
body[data-theme="galaxy"] #user-summary [style*="background-color: black"],
body[data-theme="galaxy"] #user-summary [style*="background-color:#000"],
body[data-theme="galaxy"] #user-summary [style*="background-color: #000"] {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.4)) !important;
}
/* =========================================================================
   TOP COIN SETTING (#top-coin-setting-page) — video bg + theme (mirror bonus)
   ========================================================================= */
body[data-theme="galaxy"] #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="galaxy"] #vue-tab-coin-setting.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="galaxy"] #vue-tab-coin-setting .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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="galaxy"] #top-coin-setting-page .bg-white {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
/* Kartu list transparan agar tidak dobel dengan baris gelap */
body[data-theme="galaxy"] #vue-coin-setting .card.card-style {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* Teks gelap -> terang */
body[data-theme="galaxy"] #top-coin-setting-page .color-theme,
body[data-theme="galaxy"] #top-coin-setting-page .color-black {
  color: var(--th-text, #F4F4F5) !important;
}
/* =========================================================================
   MENU DRAWER (#navigation) — video background
   ========================================================================= */
/* .nav-container video background dibuat absolute setinggi drawer agar tidak menyebabkan overflow scroll */
body[data-theme="galaxy"] #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="galaxy"] #navigation moonbot-bg {
  display: none !important;
}
/* =========================================================================
   PROFIT SUMMARY (#profit-summary) & TRANSACTION (#transaction)
   — video bg + tema seperti coin detail (non-default saja)
   ========================================================================= */
body[data-theme="galaxy"] #profit-summary #elite-bg-video,
body[data-theme="galaxy"] #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="galaxy"] #tab-user-profit-summary.header-scrolled,
body[data-theme="galaxy"] #transaction .top-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="galaxy"] #tab-user-profit-summary .bi,
body[data-theme="galaxy"] #tab-user-profit-summary i:not(.font-16):not([style*="font-style: normal"]),
body[data-theme="galaxy"] #transaction .top-header .bi,
body[data-theme="galaxy"] #transaction .top-header i:not(.font-16):not([style*="font-style: normal"]),
body[data-theme="galaxy"] #vue-download-csv-trasaction i {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  display: inline-block;
}
/* Kartu -> 80% transparan Galaxy Dark Glass */
body[data-theme="galaxy"] #user-profit-summary .content,
body[data-theme="galaxy"] #user-profit-summary .card,
body[data-theme="galaxy"] #vue-transaction-history .content.bg-theme,
body[data-theme="galaxy"] #vue-transaction-history .card {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
/* =========================================================================
   NOTIFICATION MAINTENANCE (#notification-mt) — tema non-default
   ========================================================================= */
body[data-theme="galaxy"] #notification-mt .floating-maintenance {
  background-color: #121418 !important; /* Modal BG */
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 18px rgba(233, 235, 237, 0.25),
              0 15px 25px rgba(0, 0, 0, 0.35) !important;
  color: var(--th-text, #F4F4F5) !important; /* Text Primary */
}
/* Make any inner text bright (to override backend inline grey styles) */
body[data-theme="galaxy"] #notification-mt .floating-maintenance p,
body[data-theme="galaxy"] #notification-mt .floating-maintenance div,
body[data-theme="galaxy"] #notification-mt .floating-maintenance span,
body[data-theme="galaxy"] #notification-mt .floating-maintenance h1,
body[data-theme="galaxy"] #notification-mt .floating-maintenance h2,
body[data-theme="galaxy"] #notification-mt .floating-maintenance h3,
body[data-theme="galaxy"] #notification-mt .floating-maintenance h4,
body[data-theme="galaxy"] #notification-mt .floating-maintenance h5,
body[data-theme="galaxy"] #notification-mt .floating-maintenance h6,
body[data-theme="galaxy"] #notification-mt .floating-maintenance b,
body[data-theme="galaxy"] #notification-mt .floating-maintenance i,
body[data-theme="galaxy"] #notification-mt .floating-maintenance [style*="color"] {
  color: #ffffff !important;
}
body[data-theme="galaxy"] #notification-mt .floating-maintenance a,
body[data-theme="galaxy"] #notification-mt .floating-maintenance a[style] {
  color: #5d9cec !important;
}
body[data-theme="galaxy"] #notification-mt .btn-close {
  filter: brightness(0) invert(1) !important;
  opacity: 1 !important;
}
/* =========================================================================
   ANNOUNCEMENT MODALS (.announcement-download-modal) — tema non-default
   ========================================================================= */
body[data-theme="galaxy"] .announcement-download-modal {
  background-color: #121418 !important; /* Modal BG */
  border: 1px solid var(--th-border-solid, #E9EBED) !important;
  box-shadow: 0 0 20px rgba(233, 235, 237, 0.55), 0 0 35px rgba(233, 235, 237, 0.25), 0 16px 36px rgba(0, 0, 0, 0.85) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
}

/* Hilangkan background kotak wrapper luar & margin yang memotong glow di sekeliling modal pop-up */
body[data-theme="galaxy"] .popUp .card-style-banner,
body[data-theme="galaxy"] .popUp .card.card-style-banner,
body[data-theme="galaxy"] #chose-exchanger .card,
body[data-theme="galaxy"] #chose-exchanger .card-style-banner,
body[data-theme="galaxy"] #chose-exchanger .content,
body[data-theme="galaxy"] #chose-exchanger .popup-container,
body[data-theme="galaxy"] #announcement-download-app .card,
body[data-theme="galaxy"] #announcement-download-app .card-style-banner,
body[data-theme="galaxy"] #announcement-download-app .content,
body[data-theme="galaxy"] #announcement-download-app .popup-container,
body[data-theme="galaxy"] #notification-change-top-coin .card,
body[data-theme="galaxy"] #notification-change-top-coin .card-style-banner,
body[data-theme="galaxy"] #notification-change-top-coin .content,
body[data-theme="galaxy"] #notification-change-top-coin .popup-container,
body[data-theme="galaxy"] #feedback-from-user .card,
body[data-theme="galaxy"] #feedback-from-user .card-style-banner,
body[data-theme="galaxy"] #feedback-from-user .content,
body[data-theme="galaxy"] #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="galaxy"] #chose-exchanger .popUp,
body[data-theme="galaxy"] #announcement-download-app .popUp,
body[data-theme="galaxy"] #notification-change-top-coin .popUp,
body[data-theme="galaxy"] #feedback-from-user .popUp {
  overflow: visible !important;
  padding: 15px !important;
}
/* Judul & Checklist -> Putih Terang */
body[data-theme="galaxy"] .announcement-download-modal .announcement-download-title,
body[data-theme="galaxy"] .announcement-download-modal h2,
body[data-theme="galaxy"] .announcement-download-modal [style*="color: black"],
body[data-theme="galaxy"] .announcement-download-modal [style*="color:black"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="galaxy"] .announcement-download-modal .announcement-download-message,
body[data-theme="galaxy"] .announcement-download-modal .announcement-download-message li,
body[data-theme="galaxy"] .announcement-download-modal ul {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
/* Tombol Primary (btn-download) */
body[data-theme="galaxy"] .announcement-download-modal .btn-download {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  box-shadow: none !important;
  border-radius: 8px !important;
}
body[data-theme="galaxy"] .announcement-download-modal .btn-download,
body[data-theme="galaxy"] .announcement-download-modal .btn-download *,
body[data-theme="galaxy"] .announcement-download-modal .btn-download span {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
}
/* Footer Modal Download App */
body[data-theme="galaxy"] .footer-container-download-app {
  background-color: #181b20 !important;
  border-top: 1px solid var(--th-divider, rgba(77, 80, 84, 0.4)) !important;
}
body[data-theme="galaxy"] .footer-link-download-app {
  color: var(--th-text, #F4F4F5) !important;
  text-decoration: underline !important;
}
/* =========================================================================
   FEEDBACK FROM USER / QUICK SURVEY (#feedback-from-user) — GALAXY
   ========================================================================= */
body[data-theme="galaxy"] .feedback-form-user-modal {
  background-color: #16171a !important;
  border: 1px solid var(--th-border-solid, #E9EBED) !important;
  box-shadow: 0 0 22px rgba(233, 235, 237, 0.6), 0 0 40px rgba(233, 235, 237, 0.25), 0 16px 40px rgba(0, 0, 0, 0.7) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
}
/* Judul Quick Survey */
body[data-theme="galaxy"] #vue-feedback-form-user h2,
body[data-theme="galaxy"] #vue-feedback-form-user [style*="color: #9b82c4"],
body[data-theme="galaxy"] #vue-feedback-form-user [style*="color:#9b82c4"],
body[data-theme="galaxy"] #vue-feedback-form-user [style*="rgb(155, 130, 196)"],
body[data-theme="galaxy"] #vue-feedback-form-user [style*="rgb(155,130,196)"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 18px !important;
  font-weight: 700 !important;
}
/* Pertanyaan */
body[data-theme="galaxy"] .feedback-form-user-modal p,
body[data-theme="galaxy"] .feedback-form-user-modal p[style*="color"],
body[data-theme="galaxy"] .feedback-form-user-modal .color-black {
  color: var(--th-text-muted, #9ca3af) !important;
  -webkit-text-fill-color: var(--th-text-muted, #9ca3af) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}
/* Tombol Tidak (Secondary) */
body[data-theme="galaxy"] .feedback-form-user-modal button[onclick="answerFeedback(0)"],
body[data-theme="galaxy"] .feedback-form-user-modal .btn-feedback-no {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !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="galaxy"] .feedback-form-user-modal button[onclick="answerFeedback(0)"]:hover,
body[data-theme="galaxy"] .feedback-form-user-modal .btn-feedback-no:hover {
  background: rgba(255, 255, 255, 0.14) !important;
}
/* Tombol Ya (Primary) */
body[data-theme="galaxy"] .feedback-form-user-modal button[onclick="answerFeedback(1)"],
body[data-theme="galaxy"] .feedback-form-user-modal .btn-feedback-yes {
  background: var(--th-accent-grad) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  box-shadow: 0 0 14px rgba(233, 235, 237, 0.3) !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="galaxy"] .feedback-form-user-modal button[onclick="answerFeedback(1)"]:hover,
body[data-theme="galaxy"] .feedback-form-user-modal .btn-feedback-yes:hover {
  filter: brightness(1.1) !important;
  box-shadow: 0 0 20px rgba(233, 235, 237, 0.5) !important;
}
/* =========================================================================
   CHOSE EXCHANGER (#chose-exchanger) — tema galaxy
   ========================================================================= */
/* Modal Card Container */
body[data-theme="galaxy"] #chose-exchanger .announcement-download-modal {
  background: #16171a !important;
  border: 1px solid var(--th-border-solid, #E9EBED) !important;
  border-radius: 20px !important;
  box-shadow: 0 0 22px rgba(233, 235, 237, 0.6), 0 0 40px rgba(233, 235, 237, 0.25), 0 16px 40px rgba(0, 0, 0, 0.7) !important;
  width: 350px !important;
  max-width: 92vw !important;
  padding: 24px 20px 18px 20px !important;
  margin: auto !important;
  overflow: visible !important;
  box-sizing: border-box !important;
  text-align: center !important;
}

/* Judul "Select Exchanger" */
body[data-theme="galaxy"] #chose-exchanger .announcement-download-modal > div:first-child,
body[data-theme="galaxy"] #chose-exchanger .announcement-download-modal [style*="color: black"],
body[data-theme="galaxy"] #chose-exchanger .announcement-download-modal [style*="color:black"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  padding-top: 0 !important;
  margin-bottom: 6px !important;
  line-height: 1.3 !important;
  letter-spacing: -0.2px !important;
}

/* Subtitle "Choose your exchanger to start trading" */
body[data-theme="galaxy"] #chose-exchanger .announcement-download-modal > div:nth-child(2),
body[data-theme="galaxy"] #chose-exchanger .announcement-download-modal [style*="154, 154, 154"] {
  color: #9ca3af !important;
  -webkit-text-fill-color: #9ca3af !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  padding-bottom: 0 !important;
  margin-bottom: 16px !important;
  line-height: 1.4 !important;
}

/* List Exchanger Dropdown Container */
body[data-theme="galaxy"] #chose-exchanger .dropdown,
body[data-theme="galaxy"] #chose-exchanger #select-exchanger-pop-up {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}

/* Baris Item Exchanger */
body[data-theme="galaxy"] #chose-exchanger .dropdown-item {
  display: flex !important;
  align-items: center !important;
  padding: 14px 4px !important;
  cursor: pointer !important;
  transition: background-color 0.2s ease, opacity 0.2s ease !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  background: transparent !important;
  user-select: none !important;
}

body[data-theme="galaxy"] #chose-exchanger .dropdown-item:last-child {
  border-bottom: none !important;
}

body[data-theme="galaxy"] #chose-exchanger .dropdown-item:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  border-radius: 8px !important;
}

/* Logo Exchanger */
body[data-theme="galaxy"] #chose-exchanger .dropdown-item img {
  width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
  border-radius: 0 !important;
  margin-right: 14px !important;
  flex-shrink: 0 !important;
}

/* Khusus logo OKX: square rounded */
body[data-theme="galaxy"] #chose-exchanger .dropdown-item img[src*="okx"] {
  width: 24px !important;
  height: 24px !important;
  border-radius: 4px !important;
  object-fit: cover !important;
}

/* Wrapper Info */
body[data-theme="galaxy"] #chose-exchanger .dropdown-item .info {
  flex-grow: 1 !important;
  text-align: left !important;
}

/* Nama Exchanger */
body[data-theme="galaxy"] #chose-exchanger .dropdown-item .name {
  font-size: 16px !important;
  font-weight: 500 !important;
  color: #ffffff !important;
  text-align: left !important;
  line-height: 1.2 !important;
}

/* Checklist Badge Hijau */
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="border-radius: 50%"],
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="border-radius:50%"],
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="background-color: #1aa64a"],
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="background-color: rgb(26, 166, 74)"] {
  background-color: #38a158 !important;
  border-radius: 50% !important;
  width: 26px !important;
  height: 26px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: auto !important;
  flex-shrink: 0 !important;
}

body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="border-radius: 50%"] i,
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="border-radius:50%"] i,
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="background-color: #1aa64a"] i,
body[data-theme="galaxy"] #chose-exchanger .dropdown-item [style*="background-color: rgb(26, 166, 74)"] i {
  color: #ffffff !important;
  font-size: 13px !important;
}
/* =========================================================================
   NOTIF CHANGE TOP COIN — tombol "Pergi ke Pengaturan Moonbot"
   ========================================================================= */
body[data-theme="galaxy"] #notification-change-top-coin .announcement-download-modal,
body[data-theme="galaxy"] #notification-change-top-coin .announcement-download-modal div,
body[data-theme="galaxy"] #notification-change-top-coin .announcement-download-modal [style*="color"] {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body[data-theme="galaxy"] #notification-change-top-coin a.btn.btn-download {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
    inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
/* =========================================================================
   FORMULA (#formula), BATCH FORMULA (#batch-formula),
   BATCH MOON LOGIC (#batch-moon-logic) — video bg + tema seperti coin detail
   ========================================================================= */
body[data-theme="galaxy"] #formula #elite-bg-video,
body[data-theme="galaxy"] #batch-formula #elite-bg-video,
body[data-theme="galaxy"] #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="galaxy"] #header-batch-formula-moon-logic {
  background: transparent !important;
  background-image: none !important;
}
/* Header saat scroll -> 80% gelap tanpa image */
body[data-theme="galaxy"] #header-formula.header-scrolled,
body[data-theme="galaxy"] #header-batch-formula.header-scrolled,
body[data-theme="galaxy"] #header-batch-formula-moon-logic.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="galaxy"] #header-formula .bi,
body[data-theme="galaxy"] #header-batch-formula .bi,
body[data-theme="galaxy"] #header-batch-formula-moon-logic .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Kartu -> Galaxy Dark Glass */
body[data-theme="galaxy"] #formula .card.card-style,
body[data-theme="galaxy"] #formula .content.bg-theme,
body[data-theme="galaxy"] #batch-formula .card.card-style,
body[data-theme="galaxy"] #batch-formula .content.bg-theme,
body[data-theme="galaxy"] #batch-moon-logic .card.card-style,
body[data-theme="galaxy"] #batch-moon-logic .content.bg-theme {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* -------------------------------------------------------------------------
   FORMULA & BATCH FORMULA — permukaan dalam + warna teks

   Galaxy sudah punya video latar, kartu luar, form-control, dan reset collapse
   untuk panel ini, tapi tidak punya satu pun aturan WARNA TEKS maupun
   permukaan untuk `#body-formula` / `#body-batch-formula`. Padanannya sudah
   lama ada di elite (elit:1269, 1283, 1359, 1395, 1451) dan black (black:4027,
   4036, 4049). Tanpa ini, label seperti "Konfigurasi Penyeimbangan",
   "Trailing Profit", isi accordion, dan satuan `%` di input-group tetap gelap
   di atas kartu gelap.
   ------------------------------------------------------------------------- */
/* 1. Pembungkus jangan punya warna sendiri — kedalaman datang dari kartu. */
body[data-theme="galaxy"] #body-formula,
body[data-theme="galaxy"] #body-formula > .content,
body[data-theme="galaxy"] #body-batch-formula,
body[data-theme="galaxy"] #body-batch-formula > .content {
  background-color: transparent !important;
}
/* 2. Kartu dalam & sisa `bg-theme` putih -> permukaan kaca tema. */
body[data-theme="galaxy"] #body-formula .card,
body[data-theme="galaxy"] #body-formula .bg-theme,
body[data-theme="galaxy"] #body-batch-formula .card,
body[data-theme="galaxy"] #body-batch-formula .bg-theme {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
}
/* 3. Teks hitam yang ditulis inline di markup. */
body[data-theme="galaxy"] #body-formula [style*="color: black"],
body[data-theme="galaxy"] #body-formula [style*="color:black"],
body[data-theme="galaxy"] #body-batch-formula [style*="color: black"],
body[data-theme="galaxy"] #body-batch-formula [style*="color:black"] {
  color: var(--th-text, #F4F4F5) !important;
}
/* 4. Tag teks umum di dalam kedua modul. */
body[data-theme="galaxy"] #body-formula h5,
body[data-theme="galaxy"] #body-formula h6,
body[data-theme="galaxy"] #body-formula span,
body[data-theme="galaxy"] #body-formula p,
body[data-theme="galaxy"] #body-formula label,
body[data-theme="galaxy"] #body-batch-formula h5,
body[data-theme="galaxy"] #body-batch-formula h6,
body[data-theme="galaxy"] #body-batch-formula span,
body[data-theme="galaxy"] #body-batch-formula p,
body[data-theme="galaxy"] #body-batch-formula label {
  color: var(--th-text, #F4F4F5) !important;
}
body[data-theme="galaxy"] #body-formula .form-control::placeholder,
body[data-theme="galaxy"] #body-batch-formula .form-control::placeholder {
  color: var(--th-text-hint, #68696D) !important;
}
/* 5. `.color-black`: dipakai label judul section dan chevron `.bi.color-black`. */
body[data-theme="galaxy"] #formula .color-black,
body[data-theme="galaxy"] #batch-formula .color-black,
body[data-theme="galaxy"] #batch-moon-logic .color-black,
body[data-theme="galaxy"] #formula-moon-logic .color-black {
  color: var(--th-text, #F4F4F5) !important;
}
/* 6. Isi accordion Trailing Profit: label baris `.margin-config .col` tidak
      punya kelas warna sama sekali sehingga mewarisi teks gelap dari
      `.theme-light`; ditambah catatan `.color-theme` dan satuan `%` di
      `.input-group-text`. */
body[data-theme="galaxy"] #formula .margin-config .col,
body[data-theme="galaxy"] #batch-formula .margin-config .col,
body[data-theme="galaxy"] #formula .color-theme,
body[data-theme="galaxy"] #batch-formula .color-theme,
body[data-theme="galaxy"] #batch-moon-logic .color-theme,
body[data-theme="galaxy"] #formula-moon-logic .color-theme,
body[data-theme="galaxy"] #formula .input-group-text,
body[data-theme="galaxy"] #batch-formula .input-group-text {
  color: var(--th-text, #F4F4F5) !important;
}
/* 7. Catatan yang di tema default berwarna ungu -> aksen perak. */
body[data-theme="galaxy"] #formula .color-purple,
body[data-theme="galaxy"] #batch-formula .color-purple {
  color: var(--th-accent-2, #C9CACE) !important;
}
/* 8. Sisa background putih inline di panel Moon Logic. */
body[data-theme="galaxy"] #formula-moon-logic [style*="background-color: white"],
body[data-theme="galaxy"] #formula-moon-logic [style*="background-color: #fff"],
body[data-theme="galaxy"] #formula-moon-logic [style*="background-color: rgb(255"] {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
}
/* =========================================================================
   TRADE PAGE — nama koin di list (inline color: black) -> terang
   ========================================================================= */
body[data-theme="galaxy"] #trade-page h1[style*="color: black"],
body[data-theme="galaxy"] #trade-page h1[style*="color:black"] {
  color: var(--th-text, #F4F4F5) !important; /* Text Primary */
}
body[data-theme="galaxy"] #trade-page h1 .color-gray-dark {
  color: var(--th-text-secondary, #C5C4C7) !important; /* Text Secondary (/USDT) */
}
/* =========================================================================
   TRADING VOLUME HISTORY (#trading-volume-history) — video bg + tema
   ========================================================================= */
body[data-theme="galaxy"] #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="galaxy"] #trading-volume-history .top-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="galaxy"] #trading-volume-history .top-header .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Kartu Trading Volume History -> Galaxy Dark Glass @80% */
body[data-theme="galaxy"] #vue-trading-history-body .card.card-style {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  margin: 12px 15px !important;
  border-radius: 12px !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.15) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

/* Teks kartu: tanggal, label, dan angka volume */
body[data-theme="galaxy"] #vue-trading-history-body h5,
body[data-theme="galaxy"] #vue-trading-history-body h6,
body[data-theme="galaxy"] #vue-trading-history-body span,
body[data-theme="galaxy"] #vue-trading-history-body p,
body[data-theme="galaxy"] #vue-trading-history-body .color-black,
body[data-theme="galaxy"] #vue-trading-history-body .color-theme,
body[data-theme="galaxy"] #vue-trading-history-body [style*="color: black"],
body[data-theme="galaxy"] #vue-trading-history-body [style*="color:black"] {
  color: var(--th-text, #F4F4F5) !important;
}

body[data-theme="galaxy"] #vue-trading-history-body .font-11.color-black,
body[data-theme="galaxy"] #vue-trading-history-body .font-11 span {
  color: var(--th-text-secondary, #C5C4C7) !important;
}

/* Nilai volume (.color-purple) -> Putih Terang Kontras */
body[data-theme="galaxy"] #vue-trading-history-body .color-purple {
  color: #FFFFFF !important;
  font-weight: 700 !important;
}

/* Override black texts in Coin List (Ticker) */
body[data-theme="galaxy"] .ticker-content .color-black,
body[data-theme="galaxy"] .ticker-content [style*="color: black"],
body[data-theme="galaxy"] .ticker-content [style*="color:black"] {
    color: white !important;
}
body[data-theme="galaxy"] .ticker-content .color-gray,
body[data-theme="galaxy"] .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="galaxy"] .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="galaxy"] #vue-trading-history-body .divider {
  display: block !important;
  height: 1px !important;
  background-color: var(--th-divider, rgba(77, 80, 84, 0.4)) !important;
  opacity: 0.5 !important;
}
/* =========================================================================
   BATCH SETTINGS (Sekumpulan Pengaturan, #carousel-batch di trade) —
   semua icon pakai gradient ala menu (kecuali Moon Logic yang berupa <img>)
   ========================================================================= */
body[data-theme="galaxy"] #carousel-batch .icon,
body[data-theme="galaxy"] #carousel-batch .icon.rounded-s,
body[data-theme="galaxy"] #carousel-batch .btn-investor-mode .icon {
  background: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid #D9DBDE !important;
  box-shadow: 0 0 8px rgba(217, 219, 222, 0.25) !important;
  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="galaxy"] #carousel-batch .icon i,
body[data-theme="galaxy"] #carousel-batch .icon.rounded-s > i {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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="galaxy"] #carousel-batch .icon i::before,
body[data-theme="galaxy"] #carousel-batch .icon.rounded-s > i::before {
  vertical-align: 0 !important;
  line-height: 1 !important;
}

body[data-theme="galaxy"] #carousel-batch .icon img,
body[data-theme="galaxy"] #carousel-batch .icon.rounded-s > img {
  display: block !important;
  margin: auto !important;
}

/* Sisa carousel batch */
body[data-theme="galaxy"] #carousel-batch button {
  background: transparent !important;
}
/* Label di bawah ikon dirender sebagai <i> non-.bi, jadi tidak kena aturan
   gradient ikon di atas dan tertinggal gelap. */
body[data-theme="galaxy"] #carousel-batch button i.font-11,
body[data-theme="galaxy"] #carousel-batch button i:not(.bi),
body[data-theme="galaxy"] #carousel-batch button span,
body[data-theme="galaxy"] #carousel-batch button div,
body[data-theme="galaxy"] #carousel-batch .btn-investor-mode {
  color: var(--th-text, #F4F4F5) !important;
}
/* Divider inline-nya `background-color: rgb(71, 71, 207)` — biru keunguan. */
body[data-theme="galaxy"] #carousel-batch .divider {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
  opacity: 0.5 !important;
}
body[data-theme="galaxy"] #carousel-batch .carousel-indicators {
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
}
/* Dipatok ke [data-bs-slide-to]: tombol prev/next juga tinggal di dalam
   `.carousel-indicators` dan sama-sama punya [data-bs-target], kalau tidak
   dipisah keduanya ikut dapat isian dan jadi blob di kiri-kanan.
   `background-clip: padding-box` dikembalikan karena shorthand `background`
   pada aturan `#carousel-batch button` di atas me-resetnya ke border-box, dan
   titik bootstrap 6x6 dengan border transparan 10px jadi elips tinggi. */
body[data-theme="galaxy"] #carousel-batch .carousel-indicators button[data-bs-slide-to] {
  background-clip: padding-box !important;
  background-color: var(--th-border-silver-2, #989BA0) !important;
  box-shadow: none !important;
}
body[data-theme="galaxy"] #carousel-batch .carousel-indicators button[data-bs-slide-to].active {
  background-clip: padding-box !important;
  background-color: var(--th-border-solid, #E9EBED) !important;
  box-shadow: none !important;
}
body[data-theme="galaxy"] #carousel-batch .carousel-control-prev,
body[data-theme="galaxy"] #carousel-batch .carousel-control-next {
  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  height: auto !important;
  opacity: 1 !important;
}
/* Chevron bootstrap itu SVG putih di background-image, direcolor pakai filter
   ikon tema (galaxy:65). */
body[data-theme="galaxy"] #carousel-batch .carousel-control-prev-icon,
body[data-theme="galaxy"] #carousel-batch .carousel-control-next-icon {
  filter: var(--th-icon-filter) !important;
  width: 16px !important;
  height: 16px !important;
  background-size: 100% 100% !important;
}
/* =========================================================================
   KONFIGURASI PENYEIMBANGAN — single (#margin-configuration) &
   batch (#batch-margin-configuration) — video bg + tema seperti coin detail
   ========================================================================= */
body[data-theme="galaxy"] #margin-configuration #elite-bg-video,
body[data-theme="galaxy"] #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="galaxy"] #header-balancing-configuration.header-scrolled,
body[data-theme="galaxy"] #header-batch-balancing-configuration.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Icon header -> gradient ala menu */
body[data-theme="galaxy"] #header-balancing-configuration .bi,
body[data-theme="galaxy"] #header-batch-balancing-configuration .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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="galaxy"] #body-balancing-configuration .content,
body[data-theme="galaxy"] #body-batch-balancing-configuration .content {
  background: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
}
body[data-theme="galaxy"] #body-balancing-configuration input,
body[data-theme="galaxy"] #body-batch-balancing-configuration input {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--th-text, #F4F4F5) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 6px rgba(233, 235, 237, 0.25) !important;
  border-radius: 4px;
}
body[data-theme="galaxy"] #body-balancing-configuration input:disabled,
body[data-theme="galaxy"] #body-batch-balancing-configuration input:disabled {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--th-text-muted, #9E9DA2) !important; /* Text Secondary */
}
/* Divider antar baris -> garis pemisah tema */
body[data-theme="galaxy"] #body-balancing-configuration .divider,
body[data-theme="galaxy"] #body-batch-balancing-configuration .divider {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.4)) !important;
}
/* ========================================================
   SAVING PAGE & USER SAVING (#saving-page, #user-saving)
   ======================================================== */
body[data-theme="galaxy"] #elite-bg-video-saving {
  display: block !important;
}
body[data-theme="galaxy"] #saving-page .theme-light,
body[data-theme="galaxy"] #user-saving.theme-light,
body[data-theme="galaxy"] #user-saving .theme-light {
  position: relative;
  z-index: 0;
  background: transparent !important;
}

/* Pastikan hanya card yang dapat background surface (bukan .content di luar card) */
body[data-theme="galaxy"] #saving-page .content,
body[data-theme="galaxy"] #user-saving .content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* Saving Page Cards & Containers */
body[data-theme="galaxy"] #saving-page .card.card-style,
body[data-theme="galaxy"] #user-saving .card.card-style,
body[data-theme="galaxy"] #saving-information,
body[data-theme="galaxy"] #saving-setup,
body[data-theme="galaxy"] #saving-membership .card.card-style {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.15) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border-radius: 12px !important;
}

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

/* Fix Header Scrolling Background */
body[data-theme="galaxy"] #staking-header.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}

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

/* Secondary labels & info list */
body[data-theme="galaxy"] #saving-information li,
body[data-theme="galaxy"] #saving-information div,
body[data-theme="galaxy"] #saving-page h5.font-500.opacity-50,
body[data-theme="galaxy"] #user-saving h5.font-500.opacity-50,
body[data-theme="galaxy"] #saving-page h5[style*="color: #212121"],
body[data-theme="galaxy"] #user-saving h5[style*="color: #212121"] {
  color: var(--th-text-secondary, #C5C4C7) !important;
  opacity: 0.9 !important;
}

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

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

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

/* Daily Profit button */
body[data-theme="galaxy"] #saving-page .icon-button,
body[data-theme="galaxy"] #user-saving .icon-button,
body[data-theme="galaxy"] .icon-button {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 600 !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  border-radius: 20px !important;
  padding: 4px 14px !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    0 2px 8px rgba(0, 0, 0, 0.4) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
  display: inline-flex !important;
  align-items: center !important;
}

body[data-theme="galaxy"] #saving-page .icon-button i,
body[data-theme="galaxy"] #user-saving .icon-button i {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: none !important;
}

/* Saving Transaction History List */
body[data-theme="galaxy"] #saving-page .saving-list .saving-item1,
body[data-theme="galaxy"] #user-saving .saving-list .saving-item1 {
  color: var(--th-text-secondary, #C5C4C7) !important;
  font-weight: 500 !important;
}

body[data-theme="galaxy"] #saving-page .saving-list .saving-item2,
body[data-theme="galaxy"] #user-saving .saving-list .saving-item2 {
  color: var(--th-text-muted, #9A9BA0) !important;
}

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

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

body[data-theme="galaxy"] #saving-page p.font-600.color-theme,
body[data-theme="galaxy"] #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="galaxy"] #saving-page #saving-max-usdt,
body[data-theme="galaxy"] #user-saving #saving-max-usdt,
body[data-theme="galaxy"] #saving-setup #saving-max-usdt,
body[data-theme="galaxy"] #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="galaxy"] #saving-page #saving-max-usdt:focus,
body[data-theme="galaxy"] #user-saving #saving-max-usdt:focus,
body[data-theme="galaxy"] #saving-setup #saving-max-usdt:focus,
body[data-theme="galaxy"] #saving-max-usdt:focus {
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Action Buttons (Mulai & Batal) - menggunakan button image tema start.png & stop.png */
body[data-theme="galaxy"] #saving-page .btn-investor-mode,
body[data-theme="galaxy"] #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="galaxy"] #saving-page #start-saving,
body[data-theme="galaxy"] #user-saving #start-saving,
body[data-theme="galaxy"] #saving-setup #start-saving,
body[data-theme="galaxy"] #saving-page #set-amount-to-start-saving,
body[data-theme="galaxy"] #user-saving #set-amount-to-start-saving,
body[data-theme="galaxy"] #footer-bar-savings #set-amount-to-start-saving,
body[data-theme="galaxy"] #saving-stopped #set-amount-to-start-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-galaxy/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="galaxy"] #saving-page #cancel-edit-amount,
body[data-theme="galaxy"] #user-saving #cancel-edit-amount,
body[data-theme="galaxy"] #saving-setup #cancel-edit-amount,
body[data-theme="galaxy"] #saving-page #stop-saving,
body[data-theme="galaxy"] #user-saving #stop-saving,
body[data-theme="galaxy"] #footer-bar-savings #stop-saving,
body[data-theme="galaxy"] #saving-started #stop-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-stop-img, url("../../assets/orbit-galaxy/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="galaxy"] #saving-page #saving-setting,
body[data-theme="galaxy"] #user-saving #saving-setting,
body[data-theme="galaxy"] #footer-bar-savings #saving-setting,
body[data-theme="galaxy"] #saving-started #saving-setting {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-galaxy/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 pemisah baris */
body[data-theme="galaxy"] #saving-page .divider,
body[data-theme="galaxy"] #user-saving .divider,
body[data-theme="galaxy"] #user-saving hr.divider {
  display: block !important;
  height: 1px !important;
  border: none !important;
  background-color: var(--th-divider, rgba(233, 235, 237, 0.2)) !important;
  opacity: 0.5 !important;
}

/* Icon Gradients */
body[data-theme="galaxy"] #staking-header .bi,
body[data-theme="galaxy"] #user-saving .bi-info-circle-fill,
body[data-theme="galaxy"] #saving-page .bi-info-circle-fill {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
  -webkit-background-clip: text !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  display: inline-block;
}
/* Fix border-offset becoming 80% opacity due to inline style override */
body[data-theme="galaxy"] #asset-page .border-offset[style],
body[data-theme="galaxy"] #saving-page .border-offset[style],
body[data-theme="galaxy"] .border-offset[style] {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
/* =========================================================================
   PROFIT SUMMARY (#profit-summary) — video bg + theme
   ========================================================================= */
/* Video background */
body[data-theme="galaxy"] #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="galaxy"] #profit-summary .theme-light {
  position: relative;
  z-index: 0;
}
body[data-theme="galaxy"] #profit-summary {
  overscroll-behavior: contain;
}
/* Header when scrolled -> 80% dark, no image */
body[data-theme="galaxy"] #profit-summary #tab-user-profit-summary.header-scrolled {
  background-image: none !important;
  background-color: rgba(10, 13, 24, 0.85) !important;
  background-size: auto !important;
}
/* Header icons -> gradient like the menu */
body[data-theme="galaxy"] #profit-summary #tab-user-profit-summary .bi {
  background: linear-gradient(135deg, #F5F6F7 0%, #6c8eb4 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="galaxy"] #profit-summary .top-offset {
  background: transparent !important;
  background-image: none !important;
}
body[data-theme="galaxy"] #profit-summary #tab-user-profit-summary {
  background: transparent !important;
}
/* Cards + inline white backgrounds -> Card/Table BG @80% with shiny border */
body[data-theme="galaxy"] #profit-summary .card.card-style,
body[data-theme="galaxy"] #profit-summary .content.my-0,
body[data-theme="galaxy"] #profit-summary [style*="background-color: rgb(255, 255, 255)"],
body[data-theme="galaxy"] #profit-summary [style*="background-color: white"],
body[data-theme="galaxy"] #profit-summary [style*="background-color: rgba(255, 255, 255, 1)"],
body[data-theme="galaxy"] #profit-summary [style*="background-color: #fff"] {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
body[data-theme="galaxy"] #profit-summary .color-purple {
  color: var(--th-accent-2, #E4E6EA) !important; 
}
/* Dividers -> transparent or subtle */
/* Hide bg-theme background for table header so it flows with the card */
body[data-theme="galaxy"] #profit-summary .bg-theme {
  background-color: transparent !important;
}
/* -------------------------------------------------------------------------
   TEKS PROFIT SUMMARY

   Galaxy sudah punya kartu, top-offset, filter-box, dan `.color-purple` untuk
   panel ini — tapi tidak satu pun aturan WARNA TEKS, sama seperti kasus panel
   transaksi. Markup-nya penuh `color: black` inline dan class `.color-black`
   (judul "All Time Profit", "Profit Summary List", label tahun), jadi semuanya
   tetap hitam di atas kartu gelap. Padanan lengkapnya ada di black:2871.
   ------------------------------------------------------------------------- */
body[data-theme="galaxy"] #profit-summary .color-black,
body[data-theme="galaxy"] #profit-summary [style*="color: black"],
body[data-theme="galaxy"] #profit-summary [style*="color:black"],
body[data-theme="galaxy"] #profit-summary [style*="color: #212121"],
body[data-theme="galaxy"] #profit-summary a[style*="color: black"],
body[data-theme="galaxy"] #profit-summary h5[style*="color: rgb(33"],
body[data-theme="galaxy"] #profit-summary h6[style*="color: black"],
body[data-theme="galaxy"] #profit-summary i[style*="color: black"],
body[data-theme="galaxy"] #profit-summary i[style*="color: rgb(33"],
body[data-theme="galaxy"] #user-profit-summary .color-black,
body[data-theme="galaxy"] #user-profit-summary [style*="color: black"],
body[data-theme="galaxy"] #user-profit-summary [style*="color:black"] {
  color: var(--th-text-white, #FFFFFF) !important;
}
body[data-theme="galaxy"] #profit-summary p.color-theme {
  color: var(--th-text-secondary, #C5C4C7) !important;
}
/* Divider tabel ditulis inline `background-color: rgb(0, 0, 0)` — hitam pekat
   di atas kartu gelap terbaca sebagai garis mati. */
body[data-theme="galaxy"] #profit-summary .divider {
  background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
  opacity: 0.6 !important;
}
/* Filter box */
body[data-theme="galaxy"] #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="galaxy"] button[onclick="BatchMoonLogic()"] .icon img {
  width: 35px !important;
  height: 35px !important;
  margin-top: 0 !important;
}
/* Galaxy Theme Form Controls */
body[data-theme="galaxy"] .form-custom {
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    background-color: transparent !important;
    box-shadow: var(--th-shadow, 0 0 10px rgba(233, 235, 237, 0.25)) !important;
    border-radius: 8px !important;
}
body[data-theme="galaxy"] .form-custom:focus-within {
    border-color: var(--th-border-solid, #E9EBED) !important;
    box-shadow: 0 0 12px var(--th-border-glow, rgba(233, 235, 237, 0.55)) !important;
}
body[data-theme="galaxy"] .form-select,
body[data-theme="galaxy"] input.form-control:not(.form-custom input) {
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    background-color: transparent !important;
    box-shadow: var(--th-shadow, 0 0 10px rgba(233, 235, 237, 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="galaxy"] .form-custom input,
body[data-theme="galaxy"] .form-custom select,
body[data-theme="galaxy"] .form-custom textarea {
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: white !important;
}
body[data-theme="galaxy"] .form-custom input:focus,
body[data-theme="galaxy"] .form-custom select:focus,
body[data-theme="galaxy"] .form-custom textarea:focus {
    border: none !important;
    box-shadow: none !important;
}
body[data-theme="galaxy"] .form-custom input#otp-address,
body[data-theme="galaxy"] 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="galaxy"] #pop-up-phone-input .form-custom {
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    background-color: transparent !important;
    box-shadow: 0 0 10px rgba(233, 235, 237, 0.2) !important;
    border-radius: 8px !important;
}
body[data-theme="galaxy"] #otp-phone-number {
    border: none !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: white !important;
    width: 100% !important;
}
body[data-theme="galaxy"] #pop-up-phone-input .iti {
    width: 100% !important;
}
body[data-theme="galaxy"] select option {
    background-color: var(--th-surface, #1b182b) !important;
    color: white !important;
}
body[data-theme="galaxy"] #otp-address::placeholder {
    color: rgba(255, 255, 255, 0.5) !important;
}
body[data-theme="galaxy"] .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="galaxy"] a[style*="background-color: #924be1"],
body[data-theme="galaxy"] button[style*="background-color: #924be1"],
body[data-theme="galaxy"] a[style*="background-color: rgb(146, 75, 225)"],
body[data-theme="galaxy"] button[style*="background-color: rgb(146, 75, 225)"],
body[data-theme="galaxy"] a[style*="background-color: #924ce2"],
body[data-theme="galaxy"] button[style*="background-color: #924ce2"],
body[data-theme="galaxy"] a[style*="background-color: rgb(146, 76, 226)"],
body[data-theme="galaxy"] button[style*="background-color: rgb(146, 76, 226)"],
body[data-theme="galaxy"] button.bg-purple:not(#saving-setting),
body[data-theme="galaxy"] a.bg-purple,
body[data-theme="galaxy"] button.submit-otp,
body[data-theme="galaxy"] button[onclick="BatchSave()"],
body[data-theme="galaxy"] button[onclick="ValidatePhone()"],
body[data-theme="galaxy"] [onclick*="ConfirmWithdrawal"],
body[data-theme="galaxy"] [onclick*="CallWithdrawal"],
body[data-theme="galaxy"] [onclick*="CallWithdrawalBonus"],
body[data-theme="galaxy"] .btn-uni[style*="background-color: rgb(92, 51, 181)"],
body[data-theme="galaxy"] .btn-uni[style*="background-color: rgba(92, 51, 181"],
body[data-theme="galaxy"] .offcanvas-footer .btn-full,
body[data-theme="galaxy"] .swal2-confirm,
body[data-theme="galaxy"] button[onclick="Save()"],
body[data-theme="galaxy"] .strategy-update {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
    inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

body[data-theme="galaxy"] a.bg-purple *,
body[data-theme="galaxy"] button.submit-otp *,
body[data-theme="galaxy"] button[onclick="BatchSave()"] *,
body[data-theme="galaxy"] button[onclick="ValidatePhone()"] *,
body[data-theme="galaxy"] [onclick*="ConfirmWithdrawal"] *,
body[data-theme="galaxy"] [onclick*="CallWithdrawal"] *,
body[data-theme="galaxy"] [onclick*="CallWithdrawalBonus"] *,
body[data-theme="galaxy"] .btn-uni[style*="background-color: rgb(92, 51, 181)"] *,
body[data-theme="galaxy"] .btn-uni[style*="background-color: rgba(92, 51, 181"] *,
body[data-theme="galaxy"] .offcanvas-footer .btn-full *,
body[data-theme="galaxy"] .swal2-confirm *,
body[data-theme="galaxy"] button[onclick="Save()"] *,
body[data-theme="galaxy"] .strategy-update * {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !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="galaxy"] #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="galaxy"] #vue-change-password .form-custom.form-icon > i {
  z-index: 1;
}
body[data-theme="galaxy"] #vue-change-password .input-group-append {
  border-radius: 0 7px 7px 0 !important;
  background: var(--th-accent-grad) !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
}
body[data-theme="galaxy"] #vue-change-password .input-group-append i {
  color: white !important;
}
body[data-theme="galaxy"] #vue-change-password a[onclick="DoChangePassword()"] {
  background: var(--th-accent-grad) !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="galaxy"] .SwalBtn2.investor-button {
  background: var(--th-accent-grad) !important;
  border: none !important;
  box-shadow: var(--th-btn-primary-shadow, none) !important;
}
body[data-theme="galaxy"] .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="galaxy"] div.submit-otp[style*="background-color: white"],
body[data-theme="galaxy"] div.submit-otp[style*="background: white"],
body[data-theme="galaxy"] div.submit-otp {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--th-accent-2, #C9CACE) !important;
  border: none !important;
  box-shadow: none !important;
}
/* Recharge Page Overrides */
body[data-theme="galaxy"] #recharge-now-page .color-black,
body[data-theme="galaxy"] #recharge-now-page [style*="color: black"] {
    color: white !important;
}
body[data-theme="galaxy"] #bep20_wallet {
    background-color: transparent !important;
    border: none !important;
    border-bottom: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    color: white !important;
}
body[data-theme="galaxy"] #show-address-tutor-usdt {
    background-color: transparent !important;
    border: none !important;
    border-radius: 6px !important;
}
/* Sisa warna ungu tema default -> silver. Link "Recover now" / "Pulihkan sekarang" (#924be1)
   dan garis pemisah tebal (rgb(146, 75, 225)). */
body[data-theme="galaxy"] #recharge-now-page [onclick*="SwalInputRecoverCredit"],
body[data-theme="galaxy"] #recharge-now-page [style*="color: #924be1"],
body[data-theme="galaxy"] #recharge-now-page [style*="color:#924be1"],
body[data-theme="galaxy"] #recharge-now-page [style*="color: rgb(146, 75, 225)"] {
    color: var(--th-accent, #D9DBDE) !important;
    text-decoration: underline !important;
    font-weight: 600 !important;
    cursor: pointer !important;
}
body[data-theme="galaxy"] #recharge-now-page [onclick*="SwalInputRecoverCredit"]:hover {
    color: #FFFFFF !important;
}
body[data-theme="galaxy"] #recharge-now-page [style*="background: #924be1"],
body[data-theme="galaxy"] #recharge-now-page [style*="background:#924be1"],
body[data-theme="galaxy"] #recharge-now-page [style*="background: rgb(146, 75, 225)"] {
    background: var(--th-border-silver-grad, linear-gradient(135deg, #F7F8F8, #989BA0)) !important;
}
/* Kotak info abu (border + icon #7c7e85) diselaraskan ke silver tema */
body[data-theme="galaxy"] #recharge-now-page [style*="border: solid 1px #7c7e85"],
body[data-theme="galaxy"] #recharge-now-page [style*="border: 1px solid rgb(124, 126, 133)"] {
    border-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}
body[data-theme="galaxy"] #recharge-now-page [style*="color: #7c7e85"],
body[data-theme="galaxy"] #recharge-now-page [style*="color: rgb(124, 126, 133)"] {
    color: var(--th-text-secondary, #C5C4C7) !important;
}
body[data-theme="galaxy"] #recharge-now-page .bi-info-circle-fill[style*="color: #7c7e85"],
body[data-theme="galaxy"] #recharge-now-page .bi-info-circle-fill[style*="color: rgb(124, 126, 133)"] {
    color: var(--th-accent, #D9DBDE) !important;
}
/* Profile Phone Verification Overrides */
body[data-theme="galaxy"] #bar-regis-phone .color-black {
    color: white !important;
}
/* intl-tel-input (Phone number country dropdown) Overrides */
body[data-theme="galaxy"] .iti__country-list {
    background-color: var(--th-surface, #1b182b) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    color: white !important;
}
body[data-theme="galaxy"] .iti__country-name,
body[data-theme="galaxy"] .iti__dial-code {
    color: white !important;
}
body[data-theme="galaxy"] .iti__country.iti__highlight,
body[data-theme="galaxy"] .iti__country:hover {
    background-color: rgba(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] .iti__divider {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}
/* --- HIJAU -> start.png (gaya button-start) --- */
body[data-theme="galaxy"] a[onclick="checkBnbFeeEnable()"],
body[data-theme="galaxy"] a[href="#fee-setting-buy-bnb-page"],
body[data-theme="galaxy"] button[style*="background-color: #36b693"]:not([onclick*="ConfirmWithdrawal"]),
body[data-theme="galaxy"] button[style*="background-color: rgb(54, 182, 147)"]:not([onclick*="ConfirmWithdrawal"]),
body[data-theme="galaxy"] button.color-green-dark,
body[data-theme="galaxy"] a.btn.color-green-dark,
body[data-theme="galaxy"] .btn-start-theme,
body[data-theme="galaxy"] .btn-trade-start,
body[data-theme="galaxy"] #strategy-start-theme,
body[data-theme="galaxy"] #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;
}

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

/* --- MERAH -> stop.png (gaya button-stop) --- */
/* JANGAN tambahkan `#strategy-stop-theme` ke daftar ini. Id itu dipakai tombol
   PAUSE di strategy.html:1705 — penamaannya warisan lama (`StopStrategy`,
   `.btn-stop-theme`) dan sengaja tidak diubah, lihat catatan di markup-nya.
   Karena id ber-specificity lebih tinggi (1-0-0) daripada `.btn-trade-pause`
   (0-1-0) di aturan PAUSE di bawah, mendaftarkannya di sini membuat tombol
   Pause tergambar stop.png. Black dan elite memang tidak punya selektor itu. */
body[data-theme="galaxy"] button[style*="background-color: #f63c3c"],
body[data-theme="galaxy"] button[style*="background-color: rgb(246, 60, 60)"],
body[data-theme="galaxy"] button.color-red-dark,
body[data-theme="galaxy"] a.btn.color-red-dark,
body[data-theme="galaxy"] .btn-stop-theme,
body[data-theme="galaxy"] .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="galaxy"] .btn-pause-theme,
body[data-theme="galaxy"] .btn-trade-pause,
body[data-theme="galaxy"] button-pause,
body[data-theme="galaxy"] #strategy-pause-theme,
body[data-theme="galaxy"] button.color-yellow-dark,
body[data-theme="galaxy"] a.btn.color-yellow-dark {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-galaxy/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 perak 1px. Checkbox/radio/range/button
   dikecualikan. Class .theme-input tersedia untuk pemakaian eksplisit.
   ========================================================================= */
body[data-theme="galaxy"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="button"]):not([type="submit"]),
body[data-theme="galaxy"] select,
body[data-theme="galaxy"] textarea,
body[data-theme="galaxy"] .theme-input {
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  background-color: var(--th-surface-2, #14161a) !important;
  color: var(--th-text, #F4F4F5) !important;
}
/* Placeholder terbaca di gelap */
body[data-theme="galaxy"] input::placeholder,
body[data-theme="galaxy"] textarea::placeholder {
  color: var(--th-text-muted, #9E9DA2) !important; /* Text Secondary */
}
/* Fokus: border lebih terang + glow tipis */
body[data-theme="galaxy"] input:focus,
body[data-theme="galaxy"] select:focus,
body[data-theme="galaxy"] textarea:focus {
  border-color: #FFFFFF !important;
  box-shadow: 0 0 8px rgba(233, 235, 237, 0.4) !important;
  outline: none !important;
}
/* Addon input-group (mis. "Alamat", "BEP20") ikut satu gaya */
body[data-theme="galaxy"] .input-group-text {
  background: var(--th-accent-grad) !important;
  border: 1px solid var(--th-border-solid, #E9EBED) !important;
  color: #0c0e12 !important;
  font-weight: 700 !important;
}
/* Badge Buy/Force Buy (hijau) & Sell/Force Sell (merah) di riwayat
   transaksi -> banner force tema; match hex & serialisasi rgb() Vue */
body[data-theme="galaxy"] #vue-transaction-history span[style*="#33c48d"],
body[data-theme="galaxy"] #vue-transaction-history span[style*="51, 196, 141"] {
    background: var(--th-btn-force-buy-img, url("../../assets/orbit-galaxy/force-green.png")) no-repeat center / 100% 100% !important;
    color: #ffffff !important;
}
body[data-theme="galaxy"] #vue-transaction-history span[style*="#d5465b"],
body[data-theme="galaxy"] #vue-transaction-history span[style*="213, 70, 91"] {
    background: var(--th-btn-force-sell-img, url("../../assets/orbit-galaxy/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="galaxy"] #vue-transaction-history p[style*="#36b693"],
body[data-theme="galaxy"] #vue-transaction-history p[style*="54, 182, 147"] {
    color: var(--th-green, #4EBA5D) !important;
}

/* --- Beli & Batal Buttons for Fee Setting --- */
body[data-theme="galaxy"] #btn-buy-bnb-confirm {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-galaxy/start.png")) !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="galaxy"] #btn-buy-bnb-cancel {
  background-color: transparent !important;
  background-image: var(--th-btn-stop-img, url("../../assets/orbit-galaxy/stop.png")) !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;
}

/* -------------------------------------------------------------------------
   TEKS RIWAYAT TRANSAKSI

   Galaxy sudah punya permukaan kartu, badge, dan warna profit untuk panel ini,
   tapi TIDAK punya satu pun aturan warna teks — sementara black (black:3738)
   dan elite (elit:2130) punya. Akibatnya seluruh `.color-black` dan inline
   `color: black` di markup tetap gelap di atas kartu gelap dan nyaris tak
   terbaca. Blok ini menutup celah itu, tingkatannya mengikuti black:
     teks utama  -> putih
     paragraf    -> teks sekunder
     .font-11    -> muted (label kecil: Step, Price, Qty, dll)

   `span` telanjang sengaja TIDAK ikut disasar: badge Buy/Sell di atas
   mewarnai teksnya sendiri lewat selektor ber-specificity sama, dan aturan di
   sini ditulis setelahnya sehingga akan memenangkannya. Markup panel ini
   memakai `.color-black` dan `<p>`, jadi keduanya sudah cukup.
   ------------------------------------------------------------------------- */
body[data-theme="galaxy"] #transaction .color-black,
body[data-theme="galaxy"] #transaction a[style*="color: black"],
body[data-theme="galaxy"] #transaction [style*="color:black"],
body[data-theme="galaxy"] #transaction [style*="color: black"],
body[data-theme="galaxy"] #vue-transaction-history .color-black,
body[data-theme="galaxy"] #vue-transaction-history a[style*="color: black"],
body[data-theme="galaxy"] #vue-transaction-history [style*="color:black"],
body[data-theme="galaxy"] #vue-transaction-history [style*="color: black"] {
    color: var(--th-text-white, #FFFFFF) !important;
}
body[data-theme="galaxy"] #vue-transaction-history p {
    color: var(--th-text-secondary, #C5C4C7) !important;
}
body[data-theme="galaxy"] #vue-transaction-history .font-11:not(.color-black) {
    color: var(--th-text-muted, #9C9BA0) !important;
}
body[data-theme="galaxy"] #vue-transaction-history .divider {
    background-color: var(--th-divider, rgba(77, 80, 84, 0.5)) !important;
    opacity: 0.6 !important;
}
body[data-theme="galaxy"] #vue-transaction-history .form-control::placeholder {
    color: var(--th-text-hint, #68696D) !important;
}
/* Sisa background putih dari markup dasar (kartu/`.content` yang belum kena
   aturan kartu di atas) — dibeningkan supaya video latar panel tetap terlihat. */
body[data-theme="galaxy"] #transaction [style*="background-color: white"],
body[data-theme="galaxy"] #transaction [style*="background-color: #fff"],
body[data-theme="galaxy"] #transaction [style*="background-color: rgb(255"] {
    background-color: transparent !important;
}
/* Pembungkus panel jangan memasang warna sendiri; kedalaman datang dari kartu
   di dalamnya, sama seperti elite (elit:2106) dan black. */
body[data-theme="galaxy"] #vue-transaction-history {
    background-color: transparent !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="galaxy"] .myselect.form-custom,
body[data-theme="galaxy"] .myselectasset.form-custom,
body[data-theme="galaxy"] .custom-ta .myselect.form-custom {
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  background-color: transparent !important;
}
body[data-theme="galaxy"] .myselect.form-custom select,
body[data-theme="galaxy"] .myselectasset.form-custom select,
body[data-theme="galaxy"] .custom-ta .myselect.form-custom select {
  border: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  color: var(--th-text, #F4F4F5) !important;
}
/* Stacking Contexts for Home Page & Trade Page (Themed) */
body[data-theme="galaxy"] #user-info-profile,
body[data-theme="galaxy"] #trade-page {
    position: relative !important;
    z-index: 1 !important;
}
body[data-theme="galaxy"] #trade-page .bg-binance-tick {
    background-color: transparent !important;
}

/* Home Page & Trade Page Background Video: 100% Full Screen / Full Viewport */
body[data-theme="galaxy"] #user-info-profile moonbot-bg,
body[data-theme="galaxy"] #trade-page moonbot-bg {
    position: fixed !important;
    top: 0px !important;
    left: 0px !important;
    width: 100vw !important;
    height: 100vh !important;
    max-height: none !important;
    overflow: hidden !important;
    display: block !important;
    z-index: 0 !important;
    background-color: var(--th-bg) !important;
    background-image: url("../../assets/orbit-galaxy/background-poster.jpg") !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
}

body[data-theme="galaxy"] #user-info-profile moonbot-bg::after,
body[data-theme="galaxy"] #trade-page moonbot-bg::after {
    display: none !important;
    z-index: 1;
    pointer-events: none;
}

body[data-theme="galaxy"] #user-info-profile moonbot-bg video,
body[data-theme="galaxy"] #trade-page moonbot-bg video {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center top !important;
    -webkit-mask-image: none !important;
    mask-image: none !important;
}

body[data-theme="galaxy"] .moonbot-bg-secondary-wrapper {
    display: none !important;
}

/* --- DESKTOP (≥ 768px): 100vw Full Width & Height Background Video ----------- */
@media (min-width: 768px) {
    body[data-theme="galaxy"] #user-info-profile .top-offset {
        height: 0px !important;
    }

    body[data-theme="galaxy"] #user-info-profile moonbot-bg,
    body[data-theme="galaxy"] #trade-page moonbot-bg {
        position: fixed !important;
        top: 0px !important;
        left: 0px !important;
        width: 100vw !important;
        height: 100vh !important;
        max-height: none !important;
        background-color: transparent !important;
        background-image: url("../../assets/orbit-galaxy/background-poster.jpg") !important;
        background-size: cover !important;
        background-position: center top !important;
        background-repeat: no-repeat !important;
        overflow: hidden !important;
    }

    body[data-theme="galaxy"] #user-info-profile moonbot-bg video,
    body[data-theme="galaxy"] #trade-page moonbot-bg video {
        width: 100vw !important;
        height: 100vh !important;
        object-fit: cover !important;
        object-position: center top !important;
        transform: scale(1.35) !important;
        transform-origin: center top !important;
        -webkit-mask-image: none !important;
        mask-image: none !important;
        filter: brightness(0.60) !important;
    }

    body[data-theme="galaxy"] .moonbot-bg-secondary-wrapper {
        display: none !important;
    }
}
body[data-theme="galaxy"] .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(.profile-info-card):not(.pt-2 > *):not(.bg-transparent):not([style*="background-color: transparent"]):not([style*="background: transparent"]) {
    background-color: var(--th-surface-glass) !important;
    background-image: none !important;
    border: 1px solid var(--th-border-solid, #E9EBED) !important;
    border-radius: 16px !important;
    box-shadow: 0 0 12px rgba(233, 235, 237, 0.25) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
}

body[data-theme="galaxy"] .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(.profile-info-card):not(.pt-2 > *):not(.bg-transparent):not([style*="background-color: transparent"]):not([style*="background: transparent"])::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    border-radius: 15px !important;
    pointer-events: none !important;
    box-shadow: inset 0 0 6px rgba(233, 235, 237, 0.2) !important;
    z-index: 0 !important;
}
body[data-theme="galaxy"] #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="galaxy"] #vue-coin-group-quisioner .popup-container-coin-group {
    background-color: var(--th-surface, #0e1014) !important;
    background-image: none !important;
    color: var(--th-text, #F4F4F5) !important;
}
/* Reset dark/black inline colors for text inside the quiz */
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-description,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-description span,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-description li,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-container,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-container-step,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-question-list,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-question-list li,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-question-list strong,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner ol,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner li,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner strong,
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner label {
    color: var(--th-text, #F4F4F5) !important;
}
/* Radio buttons accent color in quiz: biru agar jelas saat terpilih */
body[data-theme="galaxy"] #vue-coin-group-quisioner input[type="radio"] {
    accent-color: #0075ff !important;
}
/* Scroll containers background override */
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(233, 235, 237, 0.2) !important;
}
/* Scroll bar styles for dark mode compatibility */
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner::-webkit-scrollbar {
    width: 6px;
}
body[data-theme="galaxy"] #vue-coin-group-quisioner .quiz-scroll-inner::-webkit-scrollbar-thumb {
    background-color: var(--th-border, rgba(233, 235, 237, 0.45));
    border-radius: 3px;
}
/* Exit button style */
body[data-theme="galaxy"] #vue-coin-group-quisioner .exit-btn {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: var(--th-text, #F4F4F5) !important;
    border: 1px solid var(--th-border) !important;
}
body[data-theme="galaxy"] #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). */
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button-step,
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-step3-container button,
body[data-theme="galaxy"] #vue-coin-group-quisioner button[style*="9b42f5"],
body[data-theme="galaxy"] #vue-coin-group-quisioner button[style*="155, 66, 245"] {
    background: var(--th-accent-grad) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    border: 1px solid rgba(255, 255, 255, 0.45) !important;
    box-shadow: 
      inset 0 1px 1px rgba(255, 255, 255, 0.85),
      inset 0 -1px 2px rgba(0, 0, 0, 0.45),
      inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
      inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button *,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button-step *,
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next:not([style*="background-color: white"]):not([style*="background-color:white"]) *,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-step3-container button *,
body[data-theme="galaxy"] #vue-coin-group-quisioner button[style*="9b42f5"] *,
body[data-theme="galaxy"] #vue-coin-group-quisioner button[style*="155, 66, 245"] * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}
/* Back button in quiz (secondary; inline background-color: white statis) */
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next[style*="background-color: white"],
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next[style*="background-color:white"] {
    background: transparent !important;
    color: var(--th-text, #ffffff) !important;
    -webkit-text-fill-color: var(--th-text, #ffffff) !important;
    border: 1px solid var(--th-border, rgba(255, 255, 255, 0.2)) !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next[style*="background-color: white"] *,
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next[style*="background-color:white"] * {
    color: var(--th-text, #ffffff) !important;
    -webkit-text-fill-color: var(--th-text, #ffffff) !important;
}
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button:disabled,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button:disabled *,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button-step:disabled,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-button-step:disabled *,
body[data-theme="galaxy"] #vue-coin-group-quisioner button.responsive-button-back-next:disabled,
body[data-theme="galaxy"] #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;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.35) !important;
    cursor: not-allowed !important;
    box-shadow: none !important;
    text-shadow: none !important;
}
/* Layar hasil (Score + badan teks) */
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-score-title,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-score-value,
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-result-title:not([style*="#e53935"]),
body[data-theme="galaxy"] #vue-coin-group-quisioner .responsive-result-description {
    color: var(--th-text, #F4F4F5) !important;
}
/* Teks aksen di badan hasil ("Coin Group outside the Top 5"): ungu `#9b42f5` -> silver bertema */
body[data-theme="galaxy"] #vue-coin-group-quisioner [style*="color: #9b42f5"]:not([style*="background-color"]),
body[data-theme="galaxy"] #vue-coin-group-quisioner [style*="color:#9b42f5"]:not([style*="background-color"]),
body[data-theme="galaxy"] #vue-coin-group-quisioner [style*="rgb(155, 66, 245)"]:not([style*="background-color"]),
body[data-theme="galaxy"] #vue-coin-group-quisioner [style*="rgb(155,66,245)"]:not([style*="background-color"]) {
    color: var(--th-accent, #D9DBDE) !important;
    -webkit-text-fill-color: var(--th-accent, #D9DBDE) !important;
    font-weight: 700 !important;
    text-shadow: 0 0 10px rgba(233, 235, 237, 0.5);
}
/* Progress bar wrapper background */
body[data-theme="galaxy"] #vue-coin-group-quisioner div[style*="background-color: #f3f3f3"],
body[data-theme="galaxy"] #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="galaxy"] .popUp .content {
    margin: 0px !important;
}
/* Regular card popups */
body[data-theme="galaxy"] .popUp .card.card-style > .content {
    padding: 15px 15px 10px 15px !important;
}
/* Popup alamat penarikan: beri ruang kiri-kanan. */
body[data-theme="galaxy"] .popUp #vue-insert-address,
body[data-theme="galaxy"] .popUp #vue-show-address,
body[data-theme="galaxy"] .popUp #vue-insert-phone,
body[data-theme="galaxy"] .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="galaxy"] #vue-chose-area .popup-container,
body[data-theme="galaxy"] #vue-tnc-pop-up .popup-container {
    background-color: rgba(10, 13, 24, 0.95) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    box-shadow: 0 0 12px rgba(233, 235, 237, 0.25) !important;
}
/* Icon globe (area) & kertas legal (TNC) */
body[data-theme="galaxy"] #vue-chose-area .popup-container img[src*="country-64"],
body[data-theme="galaxy"] #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(135deg, #F5F6F7 0%, #6c8eb4 100%) !important;
    filter: none !important;
    border-radius: 0 !important;
}
body[data-theme="galaxy"] #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="galaxy"] #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="galaxy"] #vue-chose-area .popup-container p,
body[data-theme="galaxy"] #vue-tnc-pop-up .popup-container > div > p {
    color: var(--th-text, #E3E0EC) !important;
}
body[data-theme="galaxy"] #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 */
body[data-theme="galaxy"] #vue-tnc-pop-up .popup-container div[style*="background: #fff"],
body[data-theme="galaxy"] #vue-tnc-pop-up .popup-container div[style*="background: white"],
body[data-theme="galaxy"] #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(233, 235, 237, 0.2) !important;
    color: var(--th-text, #E3E0EC) !important;
}
body[data-theme="galaxy"] #vue-tnc-pop-up #tnc-html,
body[data-theme="galaxy"] #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="galaxy"] #vue-tnc-pop-up #tnc-html a {
    color: var(--th-accent-2, #E4E6EA) !important;
}
/* Judul section TNC (inline #8a4dff) -> warna aksen tema */
body[data-theme="galaxy"] #vue-tnc-pop-up #tnc-html [style*="8a4dff"],
body[data-theme="galaxy"] #vue-tnc-pop-up #tnc-html [style*="8a4dff"] *,
body[data-theme="galaxy"] #vue-tnc-pop-up #tnc-html [style*="138, 77, 255"],
body[data-theme="galaxy"] #vue-tnc-pop-up #tnc-html [style*="138, 77, 255"] * {
    color: var(--th-accent-2, #E4E6EA) !important;
}
/* Tombol utama (Ya/Setuju, ungu hardcode) -> accent gradient tema */
body[data-theme="galaxy"] #vue-chose-area button[onclick="areYouCitizen(true)"],
body[data-theme="galaxy"] #vue-tnc-pop-up button[onclick="agreeTnc()"],
body[data-theme="galaxy"] #vue-chose-area button[style*="background-color: #8a6dff"],
body[data-theme="galaxy"] #vue-chose-area button[style*="background-color:#8a6dff"],
body[data-theme="galaxy"] #vue-chose-area button[style*="background-color: rgb(138, 109, 255)"],
body[data-theme="galaxy"] #vue-chose-area button[style*="background-color:rgb(138,109,255)"],
body[data-theme="galaxy"] #vue-tnc-pop-up button[style*="background-color: #6c47ff"],
body[data-theme="galaxy"] #vue-tnc-pop-up button[style*="background-color:#6c47ff"],
body[data-theme="galaxy"] #vue-tnc-pop-up button[style*="background-color: rgb(108, 71, 255)"],
body[data-theme="galaxy"] #vue-tnc-pop-up button[style*="background-color:rgb(108,71,255)"] {
    background: var(--th-accent-grad) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    border: none !important;
    box-shadow: var(--th-btn-primary-shadow, none) !important;
}
body[data-theme="galaxy"] #vue-chose-area button[onclick="areYouCitizen(true)"] span,
body[data-theme="galaxy"] #vue-tnc-pop-up button[onclick="agreeTnc()"] span {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}
/* Judul "Kewarganegaraan" + garis pengapit di area pop-up */
body[data-theme="galaxy"] #vue-chose-area h2[style*="color: #904ae9"],
body[data-theme="galaxy"] #vue-chose-area h2[style*="color:#904ae9"],
body[data-theme="galaxy"] #vue-chose-area h2[style*="color: rgb(144, 74, 233)"],
body[data-theme="galaxy"] #vue-chose-area h2[style*="color:rgb(144,74,233)"] {
    color: var(--th-accent-2, #E4E6EA) !important;
}
body[data-theme="galaxy"] #vue-chose-area div[style*="background-color: #904ae9"],
body[data-theme="galaxy"] #vue-chose-area div[style*="background-color:#904ae9"],
body[data-theme="galaxy"] #vue-chose-area div[style*="background-color: rgb(144, 74, 233)"],
body[data-theme="galaxy"] #vue-chose-area div[style*="background-color:rgb(144,74,233)"] {
    background-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}
/* Judul "Syarat dan Ketentuan" + garis pengapit di TNC pop-up */
body[data-theme="galaxy"] #vue-tnc-pop-up h2[style*="color: #8a4dff"],
body[data-theme="galaxy"] #vue-tnc-pop-up h2[style*="color:#8a4dff"],
body[data-theme="galaxy"] #vue-tnc-pop-up h2[style*="color: rgb(138, 77, 255)"],
body[data-theme="galaxy"] #vue-tnc-pop-up h2[style*="color:rgb(138,77,255)"] {
    color: var(--th-accent-2, #E4E6EA) !important;
}
body[data-theme="galaxy"] #vue-tnc-pop-up div[style*="background-color: #8a4dff"],
body[data-theme="galaxy"] #vue-tnc-pop-up div[style*="background-color:#8a4dff"],
body[data-theme="galaxy"] #vue-tnc-pop-up div[style*="background-color: rgb(138, 77, 255)"],
body[data-theme="galaxy"] #vue-tnc-pop-up div[style*="background-color:rgb(138,77,255)"] {
    background-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}
/* Tombol "No" */
body[data-theme="galaxy"] #vue-chose-area button[onclick="areYouCitizen(false)"] {
    background: linear-gradient(135deg, #2ed3d3, #1ba9a9) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}
/* Scrollbar isi TNC di mode gelap */
body[data-theme="galaxy"] #vue-tnc-pop-up .scroll-visible::-webkit-scrollbar-thumb {
    background-color: var(--th-border, rgba(233, 235, 237, 0.45)) !important;
}
/* Icon menu Moon Logic -> aset tema orbit-galaxy/moonlogic.png */
body[data-theme="galaxy"] img[src*="moon-logic.png"] {
    content: url("../../assets/orbit-galaxy/moonlogic.png");
    width: 42px !important;
    height: 42px !important;
}
/* Countdown Timer Modal inside SweetAlert2 (Themed Overrides) */
body[data-theme="galaxy"] .swal2-popup #countdown-timer {
    color: var(--th-accent, #D9DBDE) !important;
}
body[data-theme="galaxy"] .swal2-popup div[style*="color: #374151"],
body[data-theme="galaxy"] .swal2-popup div[style*="color:#374151"] {
    color: var(--th-text, #F4F4F5) !important;
}
body[data-theme="galaxy"] .swal2-popup div[style*="background-color: #f9fafb"],
body[data-theme="galaxy"] .swal2-popup div[style*="background-color:#f9fafb"] {
    background-color: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] .swal2-popup div[style*="color: #6b7280"],
body[data-theme="galaxy"] .swal2-popup div[style*="color:#6b7280"] {
    color: var(--th-text-muted, #898989) !important;
}
/* Upgrade Coupon Modal (.modal-create-note) Theming */
body[data-theme="galaxy"] .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;
}
/* Coupon Voucher punch-holes matching themed backgrounds */
body[data-theme="galaxy"] .swal2-popup.modal-create-note .voucher-border-left:before,
body[data-theme="galaxy"] .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;
}
/* Input & Paste/Tempel Button inside the coupon modal */
body[data-theme="galaxy"] .swal2-popup.modal-create-note #swal2-input-coupon {
    background-color: #000000 !important;
    background: #000000 !important;
    color: var(--th-text, #ffffff) !important;
    border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
    border-right: none !important;
    border-radius: 8px 0 0 8px !important;
    box-shadow: 0 0 10px rgba(233, 235, 237, 0.2) !important;
    height: 2.625em;
}
body[data-theme="galaxy"] .swal2-popup.modal-create-note #swal2-input-coupon::placeholder {
    color: var(--th-text-hint, rgba(255, 255, 255, 0.5)) !important;
}
body[data-theme="galaxy"] .swal2-popup.modal-create-note .pasteCoupon {
    background: var(--th-accent-grad, var(--th-accent)) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.8) !important;
    font-weight: 700 !important;
    border: 1px solid var(--th-border-solid, #E9EBED) !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="galaxy"] .upgrade-button,
body[data-theme="galaxy"] #upgrade-button {
    background: var(--th-accent-grad, var(--th-accent)) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    font-weight: 700 !important;
    border: 1px solid var(--th-border-solid, #E9EBED) !important;
    box-shadow: 0 0 8px rgba(233, 235, 237, 0.4) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

body[data-theme="galaxy"] .upgrade-button[style*="display: none"],
body[data-theme="galaxy"] #upgrade-button[style*="display: none"] {
    display: none !important;
}

body[data-theme="galaxy"] .upgrade-button,
body[data-theme="galaxy"] #upgrade-button,
body[data-theme="galaxy"] .upgrade-button *,
body[data-theme="galaxy"] #upgrade-button * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

body[data-theme="galaxy"] .upgrade-button i,
body[data-theme="galaxy"] #upgrade-button i,
body[data-theme="galaxy"] .upgrade-button .bi,
body[data-theme="galaxy"] #upgrade-button .bi,
body[data-theme="galaxy"] .upgrade-button .bi-arrow-up-circle,
body[data-theme="galaxy"] .upgrade-button .bi-arrow-up-circle-fill,
body[data-theme="galaxy"] #upgrade-button .bi-arrow-up-circle,
body[data-theme="galaxy"] #upgrade-button .bi-arrow-up-circle-fill {
    background: none !important;
    -webkit-background-clip: unset !important;
    background-clip: unset !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
    opacity: 1 !important;
    display: inline-block !important;
}
/* Custom SweetAlert Verification Buttons */
body[data-theme="galaxy"] .swal2-popup .btn-start-bg {
  background: var(--th-btn-start-img, url("../../assets/orbit-galaxy/start.png")) no-repeat center center !important;
  background-size: 100% 100% !important;
  color: white !important;
  border: none !important;
}
body[data-theme="galaxy"] .swal2-popup .btn-stop-bg {
  background: var(--th-btn-stop-img, url("../../assets/orbit-galaxy/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="galaxy"] #send-email-confirmation-profile.gradient-green {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-galaxy/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="galaxy"] #send-email-confirmation-profile.bg-yellow-dark {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-galaxy/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="galaxy"] #user-profit-summary .card.card-style,
body[data-theme="galaxy"] #user-profit-summary .content,
body[data-theme="galaxy"] #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="galaxy"] #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="galaxy"] #saving-page #start-saving,
body[data-theme="galaxy"] #user-saving #start-saving,
body[data-theme="galaxy"] #saving-setup #start-saving,
body[data-theme="galaxy"] #saving-page #set-amount-to-start-saving,
body[data-theme="galaxy"] #user-saving #set-amount-to-start-saving,
body[data-theme="galaxy"] #footer-bar-savings #set-amount-to-start-saving,
body[data-theme="galaxy"] #saving-stopped #set-amount-to-start-saving {
  background-color: transparent !important;
  background-image: var(--th-btn-start-img, url("../../assets/orbit-galaxy/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="galaxy"] #saving-page #stop-saving,
body[data-theme="galaxy"] #user-saving #stop-saving,
body[data-theme="galaxy"] #footer-bar-savings #stop-saving,
body[data-theme="galaxy"] #saving-started #stop-saving,
body[data-theme="galaxy"] #saving-page #cancel-edit-amount,
body[data-theme="galaxy"] #user-saving #cancel-edit-amount,
body[data-theme="galaxy"] #saving-setup #cancel-edit-amount {
  background-color: transparent !important;
  background-image: var(--th-btn-stop-img, url("../../assets/orbit-galaxy/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="galaxy"] #saving-page #saving-setting,
body[data-theme="galaxy"] #user-saving #saving-setting,
body[data-theme="galaxy"] #footer-bar-savings #saving-setting,
body[data-theme="galaxy"] #saving-started #saving-setting {
  background-color: transparent !important;
  background-image: var(--th-btn-pause-img, url("../../assets/orbit-galaxy/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;
}

/* =========================================================================
   OTP VERIFICATION (#vue-otp-verification, #card-phone-otp, #otp)
   ========================================================================= */
/* Kotak digit OTP */
body[data-theme="galaxy"] #otp .form-control,
body[data-theme="galaxy"] #otp input.otp-digit {
  background-color: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  transition: all 0.2s ease !important;
}

/* Saat fokus: ganti border ungu bawaan (#924ce2) menjadi silver bertema Galaxy */
body[data-theme="galaxy"] #otp .form-control:focus,
body[data-theme="galaxy"] #otp input.otp-digit:focus {
  border: 2px solid var(--th-border-solid, #E9EBED) !important;
  box-shadow: 0 0 12px rgba(233, 235, 237, 0.5) !important;
  background-color: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
  outline: none !important;
}

/* Tombol Tempel (Paste OTP) */
body[data-theme="galaxy"] #vue-otp-verification a[onclick*="PasteOTP"],
body[data-theme="galaxy"] #vue-otp-verification a[onclick="PasteOTP()"] {
  color: var(--th-accent, #D9DBDE) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  display: inline-block !important;
  padding: 4px 16px !important;
  border-radius: 20px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  transition: all 0.2s ease !important;
  text-decoration: none !important;
}

body[data-theme="galaxy"] #vue-otp-verification a[onclick*="PasteOTP"]:hover,
body[data-theme="galaxy"] #vue-otp-verification a[onclick="PasteOTP()"]:hover {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.4) !important;
  color: #ffffff !important;
}

/* Resend countdown & teks bantuan */
body[data-theme="galaxy"] #vue-otp-verification #time-otp-resend,
body[data-theme="galaxy"] #vue-otp-verification #time-otp-resend * {
  color: var(--th-text-muted, #C9CACE) !important;
  font-size: 13px !important;
}

body[data-theme="galaxy"] #vue-otp-verification #time-otp-resend b,
body[data-theme="galaxy"] #vue-otp-verification #resend-otp,
body[data-theme="galaxy"] b.color-purple {
  color: #ffffff !important;
  font-weight: 700 !important;
}

body[data-theme="galaxy"] #vue-otp-verification #disable-time-otp-resend {
  color: var(--th-accent, #D9DBDE) !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
}

body[data-theme="galaxy"] #vue-otp-verification #disable-time-otp-resend:hover {
  color: #ffffff !important;
}

/* Tombol Submit OTP */
body[data-theme="galaxy"] #vue-otp-verification a[onclick*="ValidateOTP"],
body[data-theme="galaxy"] #vue-otp-verification a[onclick="ValidateOTP()"] {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    0 4px 14px rgba(0, 0, 0, 0.5) !important;
}

/* Tombol Back */
body[data-theme="galaxy"] #vue-otp-verification a.color-theme,
body[data-theme="galaxy"] #vue-otp-verification a[onclick*="back"],
body[data-theme="galaxy"] #vue-otp-verification #otp-back,
body[data-theme="galaxy"] #vue-otp-verification a[\@click="back"] {
  color: var(--th-text-muted, #9A9BA0) !important;
  font-weight: 700 !important;
  letter-spacing: 1px !important;
  font-size: 14px !important;
  transition: color 0.2s ease !important;
}

body[data-theme="galaxy"] #vue-otp-verification a.color-theme:hover,
body[data-theme="galaxy"] #vue-otp-verification #otp-back:hover,
body[data-theme="galaxy"] #vue-otp-verification a[\@click="back"]:hover {
  color: #ffffff !important;
}

/* Tautan Contact CCR */
body[data-theme="galaxy"] #otp-contact,
body[data-theme="galaxy"] #vue-otp-verification #otp-contact {
  color: var(--th-text-muted, #C9CACE) !important;
  font-size: 13px !important;
}

body[data-theme="galaxy"] #otp-contact a,
body[data-theme="galaxy"] #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="galaxy"] .input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.invalid-tooltip):not(.valid-feedback):not(.invalid-feedback),
body[data-theme="galaxy"] .input-group-append > .input-group-text,
body[data-theme="galaxy"] .input-group-append > .btn {
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
}
body[data-theme="galaxy"] .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="galaxy"] .input-group-prepend > .input-group-text,
body[data-theme="galaxy"] .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="galaxy"] .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;
}
body[data-theme="galaxy"] #vue-chose-area .popup-container,
body[data-theme="galaxy"] #vue-tnc-pop-up .popup-container {
    background-color: #0a0d18 !important;
}

/* =========================================
   SELECT2 & SWAL THEME OVERRIDES (GALAXY)
   ========================================= */
body[data-theme="galaxy"] .theme-swal-popup {
  background-color: #0d0f12 !important; /* Modal BG */
  color: var(--th-text, #F4F4F5) !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.8), 0 0 15px rgba(233, 235, 237, 0.25) !important;
  border-radius: 14px !important;
}

body[data-theme="galaxy"] .theme-swal-popup .swal2-title {
  color: #FFFFFF !important;
}

/* The selection box itself */
body[data-theme="galaxy"] .select2-container--default .select2-selection--single {
  background-color: #050708 !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-radius: 8px !important;
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
}

body[data-theme="galaxy"] .select2-container--default.select2-container--open .select2-selection--single,
body[data-theme="galaxy"] .select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
body[data-theme="galaxy"] .select2-container--default.select2-container--open.select2-container--above .select2-selection--single {
  background-color: #050708 !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-top: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-bottom: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-left: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-right: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !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="galaxy"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--th-text, #F4F4F5) !important;
  line-height: 48px !important;
}

body[data-theme="galaxy"] .select2-container--default .select2-selection--single .select2-selection__rendered span,
body[data-theme="galaxy"] .select2-results__option span {
  color: var(--th-text, #F4F4F5) !important;
}

/* Arrow inside selection box */
body[data-theme="galaxy"] .select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 46px !important;
}

body[data-theme="galaxy"] .select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--th-text) transparent transparent transparent !important;
}

body[data-theme="galaxy"] .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--th-text) transparent !important;
}

/* Dropdown list panel */
body[data-theme="galaxy"] .select2-dropdown,
body[data-theme="galaxy"] .select2-dropdown.select2-dropdown--below,
body[data-theme="galaxy"] .select2-dropdown.select2-dropdown--above,
body[data-theme="galaxy"] .select2-container--open .select2-dropdown,
body[data-theme="galaxy"] .select2-container--open .select2-dropdown--below,
body[data-theme="galaxy"] .select2-container--open .select2-dropdown--above {
  background-color: #121416 !important;
  border: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-top: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-bottom: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-left: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !important;
  border-right: 1px solid var(--th-border, rgba(233, 235, 237, 0.45)) !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;
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.8), 0 0 12px rgba(233, 235, 237, 0.15) !important;
  z-index: 9999999 !important;
  margin-top: 6px !important;
  overflow: hidden !important;
}

body[data-theme="galaxy"] .select2-dropdown.select2-dropdown--above,
body[data-theme="galaxy"] .select2-container--open .select2-dropdown--above {
  margin-top: -6px !important;
}

/* Option list container */
body[data-theme="galaxy"] .select2-container--default .select2-results__options {
  background-color: #121416 !important;
  padding: 0 !important;
}

/* Individual option items */
body[data-theme="galaxy"] .select2-container--default .select2-results__option {
  color: var(--th-text, #F4F4F5) !important;
  background-color: transparent !important;
  padding: 10px 15px !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.1) !important;
}
body[data-theme="galaxy"] .select2-container--default .select2-results__option:last-child {
  border-bottom: none !important;
}

/* Highlighted (hovered) option & selected option */
body[data-theme="galaxy"] .select2-container--default .select2-results__option--highlighted[aria-selected],
body[data-theme="galaxy"] .select2-container--default .select2-results__option--highlighted[aria-selected="true"] {
  background-color: rgba(233, 235, 237, 0.16) !important;
  color: #FFFFFF !important;
}

body[data-theme="galaxy"] .select2-container--default .select2-results__option[aria-selected="true"] {
  background-color: rgba(233, 235, 237, 0.1) !important;
}

/* Disabled option (locked theme) */
body[data-theme="galaxy"] .select2-container--default .select2-results__option[aria-disabled="true"] {
  color: #68696D !important;
  opacity: 0.5 !important;
}

body[data-theme="galaxy"] .select2-container--default .select2-results__option[aria-disabled="true"] span {
  color: #68696D !important;
}

/* Swal buttons inside theme swal */
body[data-theme="galaxy"] .theme-swal-popup .swal2-confirm {
  background: var(--th-accent-grad) !important;
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  font-weight: 600 !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  border-radius: 6px !important;
  box-shadow: 
    inset 0 1px 1px rgba(255, 255, 255, 0.85),
    inset 0 -1px 2px rgba(0, 0, 0, 0.45),
    inset 1px 0 1.5px rgba(255, 255, 255, 0.6),
    inset -1px 0 1.5px rgba(255, 255, 255, 0.6) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

body[data-theme="galaxy"] .theme-swal-popup .swal2-cancel {
  background: rgba(255, 255, 255, 0.08) !important;
  color: var(--th-text) !important;
  border: 1px solid var(--th-border) !important;
  border-radius: 6px !important;
}

/* App Banner on Home Page */
body[data-theme="galaxy"] #app-banner-ios,
body[data-theme="galaxy"] #app-banner-android {
  position: relative !important;
  z-index: 2 !important;
  opacity: 1 !important;
  display: block !important;
  border: 1px solid rgba(233, 235, 237, 0.45) !important;
  border-radius: 10px !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.2) !important;
}

/* =========================================
   LEADERBOARD (rank-pop-up) — GALAXY THEME
   Assets: ../assets/orbit-galaxy/leaderboard/
   (only when the theme is active; default is untouched)
   ========================================= */
/* Palet (galaxy leaderboard) — struktur disalin utuh dari tema black
   (black:2246), hanya paletnya yang ditukar emas -> perak:
   Base BG #050708 · Card/Table BG #121416
   Border Silver #E9EBED · Glow Silver #D9DBDE · Text Silver #C9CACE
   Text Primary #F4F4F5 · Text Secondary #9C9BA0 */
/* Whole card uses the space background image (fallback = Base BG) */
body[data-theme="galaxy"] .ranking-top-up {
  background: url("../../assets/orbit-galaxy/leaderboard/bg-pg-leaderboard.png") center top / cover no-repeat,
              var(--th-bg, #050708) !important;
  overflow: hidden;
}
body[data-theme="galaxy"] .ranking-top-up-wrapper {
  position: relative;
  border: none !important;
  box-shadow: 0 0 20px rgba(233, 235, 237, 0.55), 
              0 0 40px rgba(217, 219, 222, 0.28), 
              inset 0 0 15px rgba(233, 235, 237, 0.35),
              inset 0 0 30px rgba(217, 219, 222, 0.18) !important;
  border-radius: 12px;
  display: block;
}
body[data-theme="galaxy"] .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, #F7F8F8 15%, #989BA0 40%, #FFFFFF 60%, #989BA0 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="galaxy"] .ranking-top-up-header-container {
  background: transparent !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.35) !important;
  box-shadow: 0 3px 16px -6px rgba(233, 235, 237, 0.45) !important;
}
body[data-theme="galaxy"] .ranking-top-up-header-container::before {
  content: "";
  position: absolute;
  left: 22px;
  top: 16px;
  width: 132px;
  height: 132px;
  background: url("../../assets/orbit-galaxy/leaderboard/leaderboard-clipart-1.png?v=2") center / contain no-repeat;
  z-index: 2;
  pointer-events: none;
}
/* Leaderboard Pill Tabs — Galaxy Theme (SilverPlasmaTheme) */
body[data-theme="galaxy"] .ranking-top-tab-navigation {
  background: rgba(18, 20, 24, 0.85) !important;
  border: 1px solid rgba(233, 235, 237, 0.35) !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.6), 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}
body[data-theme="galaxy"] .ranking-top-tab {
  color: #F8FBFF !important;
  -webkit-text-fill-color: #F8FBFF !important;
  font-family: "PlusJakartaSans", sans-serif !important;
  font-weight: 700 !important;
}
body[data-theme="galaxy"] .ranking-top-tab:hover {
  color: #F8FBFF !important;
  -webkit-text-fill-color: #F8FBFF !important;
}
body[data-theme="galaxy"] .ranking-top-tab.active {
  background: linear-gradient(135deg, #F1F5FA 0%, #A9BACB 100%) !important;
  color: #171E28 !important;
  -webkit-text-fill-color: #171E28 !important;
  font-family: "PlusJakartaSans-Bold", sans-serif !important;
  font-weight: 800 !important;
  box-shadow: 0 1px 6px rgba(169, 186, 203, 0.35) !important;
}
/* Hide clipart medal when AUM tab is active */
body[data-theme="galaxy"] .ranking-top-up-wrapper.tab-aum-active .ranking-top-up-header-container::before {
  display: none !important;
}
/* Header in Galaxy Theme when AUM tab is active */
body[data-theme="galaxy"] .ranking-top-up-wrapper.tab-aum-active .ranking-top-up-header-container {
  background: transparent !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.35) !important;
}
/* AUM Hall of Fame in Galaxy Theme (SilverPlasmaTheme) */
body[data-theme="galaxy"] .ranking-aum-subtitle {
  color: #EAEDF2 !important;
}
body[data-theme="galaxy"] .ranking-aum-title {
  color: #E7F3FF !important;
}
body[data-theme="galaxy"] .ranking-aum-divider {
  background: #E0E8F0 !important;
  box-shadow: 0 0 10px rgba(224, 232, 240, 0.7) !important;
}
body[data-theme="galaxy"] .aum-body-container {
  background-color: transparent !important;
}
body[data-theme="galaxy"] .aum-tier-card {
  background: rgba(24, 28, 34, 0.75) !important;
  border: 1px solid rgba(233, 240, 248, 0.75) !important;
  box-shadow: 0 0 6px rgba(233, 235, 237, 0.3) !important;
}
body[data-theme="galaxy"] .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(233, 235, 237, 0.2) !important;
}
/* Tier accents for Galaxy (ORBIT_AUM_TIER_ACCENTS) */
body[data-theme="galaxy"] .aum-tier-card.tier-black .aum-tier-badge {
  border-left-color: #FCD570 !important;
}
body[data-theme="galaxy"] .aum-tier-card.tier-galaxy .aum-tier-badge {
  border-left-color: #E6EAF0 !important;
}
body[data-theme="galaxy"] .aum-tier-card.tier-elite .aum-tier-badge {
  border-left-color: #B84AFB !important;
}
body[data-theme="galaxy"] .aum-tier-card.tier-prime .aum-tier-badge {
  border-left-color: #29F05F !important;
}
body[data-theme="galaxy"] .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="galaxy"] .aum-tier-card.tier-black {
  --aum-accent-rgb: 252, 213, 112;
}
body[data-theme="galaxy"] .aum-tier-card.tier-galaxy {
  --aum-accent-rgb: 230, 234, 240;
}
body[data-theme="galaxy"] .aum-tier-card.tier-elite {
  --aum-accent-rgb: 184, 74, 251;
}
body[data-theme="galaxy"] .aum-tier-card.tier-prime {
  --aum-accent-rgb: 41, 240, 95;
}
body[data-theme="galaxy"] .aum-tier-card.tier-one {
  --aum-accent-rgb: 2, 207, 250;
}
body[data-theme="galaxy"] .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="galaxy"] .aum-tier-label {
  color: #F4F6F8 !important;
  -webkit-text-fill-color: #F4F6F8 !important;
}
body[data-theme="galaxy"] .aum-tier-name {
  color: #F4F6F8 !important;
  -webkit-text-fill-color: #F4F6F8 !important;
}
body[data-theme="galaxy"] .aum-rank-row:not(:last-child) {
  border-bottom: 1px solid rgba(255, 255, 255, 0.10) !important;
}
/* Divider colors (|) */
body[data-theme="galaxy"] .aum-rank-sep.rank-sep-1 {
  color: #E0EBF1 !important;
}
body[data-theme="galaxy"] .aum-rank-sep.rank-sep-2 {
  color: #D3DAE4 !important;
}
body[data-theme="galaxy"] .aum-rank-sep.rank-sep-3 {
  color: #D8E5ED !important;
}
/* Name colors */
body[data-theme="galaxy"] .aum-rank-username.rank-1-text {
  color: #F2D56A !important;
  font-weight: 800;
}
body[data-theme="galaxy"] .aum-rank-username.rank-2-text {
  color: #ECEFF6 !important;
  font-weight: 700;
}
body[data-theme="galaxy"] .aum-rank-username.rank-3-text {
  color: #F2B84A !important;
  font-weight: 700;
}
/* AUM wallpaper when AUM tab is active */
body[data-theme="galaxy"] .ranking-top-up.tab-aum-active,
body[data-theme="galaxy"] .ranking-top-up:has(.tab-aum-active) {
  background: url("../../assets/orbit-galaxy/aum-wp.png") center top / cover no-repeat,
              #0e121c !important;
}
/* Footer divider, text, and link */
body[data-theme="galaxy"] .aum-footer-notes {
  border-top: 1px solid rgba(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] .aum-footer-notes p,
body[data-theme="galaxy"] .aum-footer-note-text {
  color: #B7BCC2 !important;
  opacity: 1 !important;
}
body[data-theme="galaxy"] .aum-footer-notes a,
body[data-theme="galaxy"] .aum-footer-link {
  color: #D1DEE7 !important;
}
/* Monthly Leaderboard name colors in Galaxy theme */
body[data-theme="galaxy"] .table-rank-pop-up .text-shine-gold,
body[data-theme="galaxy"] .table-rank-pop-up span[style*="fdc846"],
body[data-theme="galaxy"] .table-rank-pop-up span[style*="253, 200, 70"] {
  color: #F2D56A !important;
  -webkit-text-fill-color: #F2D56A !important;
}
body[data-theme="galaxy"] .table-rank-pop-up .text-shine-silver,
body[data-theme="galaxy"] .table-rank-pop-up span[style*="737279"],
body[data-theme="galaxy"] .table-rank-pop-up span[style*="115, 114, 121"] {
  color: #ECEFF6 !important;
  -webkit-text-fill-color: #ECEFF6 !important;
}
body[data-theme="galaxy"] .table-rank-pop-up .text-shine-bronze,
body[data-theme="galaxy"] .table-rank-pop-up span[style*="bd890b"],
body[data-theme="galaxy"] .table-rank-pop-up span[style*="189, 137, 11"] {
  color: #F2B84A !important;
  -webkit-text-fill-color: #F2B84A !important;
}
/* Header title. "MOON" (teks milik <p> sendiri) disamakan dengan "TOP 20":
   emas solid, bukan gradient — gradient bikin "MOON" terlihat beda berat/warna
   dari span di sebelahnya. */
body[data-theme="galaxy"] .ranking-top-up-header-title {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF;
  text-shadow: none !important;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,1)) drop-shadow(0 0 15px rgba(0,0,0,0.9)) drop-shadow(0 0 2px rgba(255,255,255,0.3)) !important;
  /* style.css memberi 600 pada family `PlusJakartaSans`, dan family itu hanya
     punya SATU file (PlusJakartaSans-Medium.woff) — jadi 600/700 di situ cuma
     bold sintetis yang tipis. Dipindah ke family `PlusJakartaSans-Bold` yang
     memuat file Bold asli, lalu 800 untuk tebal ekstra. */
  font-family: "PlusJakartaSans-Bold", sans-serif !important;
  font-weight: 800 !important;
  position: relative;
  z-index: 1;
}

/* Aura gelap/lembut khusus di belakang MOONBOT agar lebih menonjol (tanpa kotak kaku) */
body[data-theme="galaxy"] .ranking-top-up-header-title::before {
  content: "";
  position: absolute;
  top: -50%;
  bottom: -5%;
  left: -5%;
  width: 70%; /* Hanya menutupi sekitar tulisan MOONBOT */
  /* Untuk mengatur seberapa gelap, ubah angka 0.4 di bawah ini (0.0 = transparan, 1.0 = hitam pekat) */
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 70%);
  z-index: -1;
  pointer-events: none;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
}
body[data-theme="galaxy"] .ranking-top-up-header-title span {
  font-family: "PlusJakartaSans-Bold", sans-serif !important;
  font-weight: 800 !important;
}
/* Subtitle "MONTHLY LEADERBOARD" -> putih bersih, tanpa tint emas */
body[data-theme="galaxy"] .ranking-top-up-header-subtitle {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff;
  text-shadow: 0 2px 4px rgba(0,0,0,1) !important;
}
/* "BOT" -> Putih solid */
body[data-theme="galaxy"] .ranking-top-up-header-title span[style*="#fff"],
body[data-theme="galaxy"] .ranking-top-up-header-title span[style*="255, 255, 255"] {
  -webkit-text-fill-color: #FFFFFF !important;
  color: #FFFFFF !important;
}
/* "TOP 20" -> Gold Accent (tetap solid emas) */
body[data-theme="galaxy"] .ranking-top-up-header-title span[style*="fdc846"],
body[data-theme="galaxy"] .ranking-top-up-header-title span[style*="253, 200, 70"] {
  -webkit-text-fill-color: var(--th-accent, #D9DBDE) !important;
  color: var(--th-accent, #D9DBDE) !important;
}
/* Body panel (inline background-color:white) -> transparent so the bg shows */
body[data-theme="galaxy"] .ranking-top-up div[style*="background-color: white"] {
  background-color: transparent !important;
}
/* Table -> Card/Table BG @10% + shiny gold border, rounded 5px, margin-top 10px */
body[data-theme="galaxy"] .table-rank-pop-up {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid rgba(233, 235, 237, 0.55) !important;
  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(233, 235, 237, 0.30),
              inset 0 0 12px rgba(233, 235, 237, 0.10);
}
body[data-theme="galaxy"] .th-rank-pop-up {
  color: var(--th-text, #F4F4F5) !important;
  border-bottom: 1px solid rgba(233, 235, 237, 0.35) !important;
}
body[data-theme="galaxy"] .td-rank-pop-up {
  color: var(--th-text, #F4F4F5) !important;
}
/* Subtle row separators */
body[data-theme="galaxy"] .table-rank-pop-up tbody tr td {
  border-bottom: 1px solid rgba(233, 235, 237, 0.2) !important;
}
body[data-theme="galaxy"] .table-rank-pop-up tbody tr:last-child td {
  border-bottom: none !important;
}
/* "Trailing Profit :" label -> Text Primary */
body[data-theme="galaxy"] .ranking-top-up td.ps-1 {
  color: var(--th-text, #F4F4F5) !important;
}
/* Footnotes + empty-state -> Text Secondary */
body[data-theme="galaxy"] .ranking-top-up li,
body[data-theme="galaxy"] .ranking-top-up tbody p,
body[data-theme="galaxy"] .ranking-top-up .bi-ban {
  color: var(--th-text-muted, #9C9BA0) !important;
}
/* Link "Pro/P+" di footnote itu satu-satunya sisa ungu tema default di panel
   ini: markup-nya inline `color: #924be1` (rank-pop-up.html), DAN index.html
   menyetel ulang warnanya lewat jQuery saat profil dimuat. jQuery menyerialkan
   nilainya jadi `rgb(146, 75, 225)`, bukan `#924be1`, jadi kedua bentuk harus
   disebut — pola yang sama dipakai tombol sort di ~baris 842. `!important`
   wajib karena yang dilawan adalah inline style.

   Varian abu (#6c757d) yang dipasang untuk akun investor sengaja TIDAK ikut
   diemaskan: itu penanda bahwa tombol upgrade-nya tidak berlaku. */
body[data-theme="galaxy"] #button-upgrade-rank[style*="924be1"],
body[data-theme="galaxy"] #button-upgrade-rank[style*="146, 75, 225"] {
  color: var(--th-accent-2, #C9CACE) !important;
}
/* Close button visible on dark and styled for black */
body[data-theme="galaxy"] .button-close-banner {
  border: 2px solid transparent !important;
  background:
    linear-gradient(var(--th-bg, #050708), var(--th-bg, #050708)) padding-box,
    linear-gradient(180deg, #989BA0 0%, #FFFFFF 50%, #989BA0 100%) border-box !important;
  box-shadow: 0 0 14px rgba(233, 235, 237, 0.7),
              inset 0 0 8px rgba(233, 235, 237, 0.3);
  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="galaxy"] .button-close-banner .btn-close {
  filter: none !important;
  opacity: 1 !important;
  background-image: none !important;
  background-color: var(--th-text, #F4F4F5) !important;
  -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 */
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="fdc846"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="253, 200, 70"] {
  content: url("../../assets/orbit-galaxy/leaderboard/rank-1.png");
}
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="737279"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="115, 114, 121"] {
  content: url("../../assets/orbit-galaxy/leaderboard/rank-2.png");
}
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="bd890b"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="189, 137, 11"] {
  content: url("../../assets/orbit-galaxy/leaderboard/rank-3.png");
}
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="fdc846"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="253, 200, 70"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="737279"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="115, 114, 121"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="bd890b"],
body[data-theme="galaxy"] .td-rank-pop-up.d-flex span[style*="189, 137, 11"] {
  width: auto !important;
  height: 26px !important;
  vertical-align: middle;
}
/* Trailing shields -> themed shields */
body[data-theme="galaxy"] .ranking-top-up img[src*="security-shield.png"] {
  content: url("../../assets/orbit-galaxy/leaderboard/trail-off.png");
}
body[data-theme="galaxy"] .ranking-top-up img[src*="security-shield-red"] {
  content: url("../../assets/orbit-galaxy/leaderboard/trail-on.png");
}
body[data-theme="galaxy"] .ranking-top-up img[src*="security-shield"] {
  width: auto !important;
  height: 22px !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="galaxy"] .offcanvas .searchBar-container:has(+ .divider.mt-0.mb-1) {
  border-bottom: 1px solid rgba(233, 235, 237, 0.25) !important;
  border-radius: 0 !important;
  margin-bottom: 4px !important;
}
body[data-theme="galaxy"] .offcanvas .searchBar-container + .divider.mt-0.mb-1 {
  display: none !important;
}

/* ASSET PAGE — panel list dipanjangkan sampai dasar layar (padanan elit/black).
   `.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="galaxy"] #asset-page .border-offset {
  display: none !important;
}
body[data-theme="galaxy"] #asset-page #elite-bg-video {
  position: fixed !important;
  top: 0; left: 0;
  width: 100%; max-width: 450px;
  height: 100vh;
}
body[data-theme="galaxy"] #asset-page > .top-offset {
  min-height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-theme="galaxy"] #asset-page #user-asset,
body[data-theme="galaxy"] #asset-page #user-asset > .pt-2 {
  flex: 1 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
}
body[data-theme="galaxy"] #asset-page #user-asset > .pt-2 > .card.card-style {
  flex: 1 0 auto !important;
  margin-bottom: 0 !important;
}

/* PROFIT LIST (#profit-page) — baris tanpa garis pemisah, sama dengan list
   Credit di Asset & Profit di elite. Membatalkan border-bottom per baris dan
   menyembunyikan .divider.my-0 yang dirender setelah tiap baris (profit.html
   komponen profit_list). Garis header kolom & kapsul summary bulan tidak ikut. */
body[data-theme="galaxy"] #profit-page #tab-group-profit .d-flex[aria-expanded]:not(.month-summary-separator) {
  border-bottom: none !important;
}
body[data-theme="galaxy"] #profit-page #tab-group-profit .divider.my-0 {
  display: none !important;
}

/* =========================================================================
   CASHBACK — KARTU SUMMARY (Total Cashback & Tersedia/Diklaim)
   Disamakan dengan kartu utama Profit/Credit (galaxy:1201): 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="galaxy"] #bonus-page #user-bonus .content.bonus-summary-card {
  background-color: var(--th-surface-glass, rgba(18, 20, 22, 0.72)) !important;
  border: 1px solid var(--th-border-solid, #E9EBED) !important;
  box-shadow: 0 0 15px rgba(233, 235, 237, 0.25) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
body[data-theme="galaxy"] #profit-page .card.card-style,
body[data-theme="galaxy"] #roi-setting .card.card-style,
body[data-theme="galaxy"] #bonus-page .card.card-style,
body[data-theme="galaxy"] #user-profit-summary .content,
body[data-theme="galaxy"] #user-profit-summary .card,
body[data-theme="galaxy"] #profit-summary .card.card-style,
body[data-theme="galaxy"] #profit-summary .content.my-0 {
  background-color: rgba(18, 20, 22, 0.85) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}