/* ================================================================
   BOS88 Gold Premium Theme Override
   Warna: Kuning Emas (#f0c040) dengan aksen Hitam (#111) & Putih (#fff)
   Tidak mengubah struktur, hanya visual.
   ================================================================ */

/* === PALET VARIABEL === */
:root {
  --gold-primary:   #f0c040;
  --gold-light:     #ffd966;
  --gold-dim:       #c49a20;
  --bg-deep:        #0e0e0e;
  --bg-card:        #1a1a1a;
  --bg-section:     #141414;
  --text-white:     #ffffff;
  --text-muted:     #aaaaaa;
  --border-gold:    rgba(240, 192, 64, 0.35);
}

/* ================================================================
   BODY & BACKGROUND UTAMA
   ================================================================ */
body {
  background-color: #0e0e0e !important;
  color: #e0e0e0 !important;
}

/* ================================================================
   TOPBAR (header atas)
   ================================================================ */
.topbar-container {
  background-color: #0a0a0a !important;
  border-bottom: 1px solid rgba(240,192,64,0.3) !important;
}

/* ================================================================
   SITE HEADER / NAVBAR
   ================================================================ */
.site-header {
  background: linear-gradient(to right, #1a1100 0%, #2a1c00 50%, #1a1100 100%) !important;
  box-shadow: 0 2px 12px rgba(240,192,64,0.25) !important;
  border-bottom: 2px solid rgba(240,192,64,0.4) !important;
}

/* ================================================================
   MENU NAVIGASI
   ================================================================ */
.top-menu > li {
  color: #e0e0e0 !important;
}
.top-menu > li + li:before {
  background: rgba(240,192,64,0.3) !important;
}
.top-menu > li[data-active="true"],
.top-menu > li:hover {
  color: #f0c040 !important;
}
.top-menu .game-list-container {
  background-color: rgba(14,14,14,0.98) !important;
  border-bottom: 3px solid #f0c040 !important;
}
.top-menu .games-container > li {
  background: linear-gradient(180deg, rgba(0,0,0,0) 25%, #f0c040 100%) !important;
}
.top-menu .games-container > li > a img {
  background: linear-gradient(180deg, #111 25%, #2a1c00 100%) !important;
}

/* ================================================================
   ANNOUNCEMENT BAR
   ================================================================ */
.announcement-outer-container {
  background: linear-gradient(90deg, #1a1100, #2a1c00, #1a1100) !important;
  border-bottom: 1px solid rgba(240,192,64,0.3) !important;
  color: #f0c040 !important;
}
.announcement-outer-container * {
  color: #f0c040 !important;
}

/* ================================================================
   DATA-CONTAINER-BACKGROUND: semua section konten
   ================================================================ */
[data-container-background],
[data-container-background="hot-games"],
[data-container-background="general"],
[data-container-background="home"],
[data-container-background="slots"],
[data-container-background="arcade"],
[data-container-background="crash-game"],
[data-container-background="casino"],
[data-container-background="race"],
[data-container-background="sports"],
[data-container-background="others"],
[data-container-background="cockfight"],
[data-container-background="poker"],
[data-container-background="casino-provider"],
[data-container-background="race-provider"] {
  background-color: #0e0e0e !important;
}

/* ================================================================
   JACKPOT COUNTER
   ================================================================ */
.home-progressive-jackpot {
  background: linear-gradient(135deg, #1a1100 0%, #2e1f00 50%, #1a1100 100%) !important;
  border-top: 1px solid rgba(240,192,64,0.35) !important;
  border-bottom: 1px solid rgba(240,192,64,0.35) !important;
}
.jackpot-container,
.home-progressive-jackpot .jackpot-play-section .jackpot-play-text {
  color: #f0c040 !important;
  text-shadow: 0 0 16px rgba(240,192,64,0.6) !important;
}

/* ================================================================
   HERO BANNER / SLIDER AREA
   ================================================================ */
.home-banner-container,
.banner-container {
  border-bottom: 2px solid rgba(240,192,64,0.3) !important;
}

/* ================================================================
   SITE CONTACTS (tengah)
   ================================================================ */
.site-contacts {
  background: linear-gradient(180deg, #181200 0%, #0e0e0e 100%) !important;
  border-top: 1px solid rgba(240,192,64,0.25) !important;
  border-bottom: 1px solid rgba(240,192,64,0.25) !important;
}
.site-contacts .contact-list li a {
  background-color: #1a1100 !important;
  color: #e0e0e0 !important;
  border: 1px solid rgba(240,192,64,0.2) !important;
  transition: all 0.2s !important;
}
.site-contacts .contact-list li a:hover {
  background-color: #2a1c00 !important;
  color: #f0c040 !important;
  border-color: #f0c040 !important;
}
.site-contacts .contact-list li a i {
  background-color: #2a1c00 !important;
}

/* ================================================================
   FOOTER
   ================================================================ */
.site-footer {
  background-color: #0a0a0a !important;
  border-top: 1px solid rgba(240,192,64,0.3) !important;
}
.footer-links > li > a {
  color: #ccc !important;
}
.footer-links > li + li > a {
  border-left: 1px solid rgba(240,192,64,0.3) !important;
}
.footer-links > li > a:hover {
  color: #f0c040 !important;
}
.copyright {
  color: #888 !important;
}
.footer-separator {
  border-top: 1px dotted rgba(240,192,64,0.25) !important;
}

/* ================================================================
   SITE DESCRIPTION (ARTIKEL)
   ================================================================ */
.site-description {
  color: #aaa !important;
}
.site-description h1,
.site-description h2,
.site-description h3 {
  color: #f0c040 !important;
}
.site-description p,
.site-description div,
.site-description a {
  color: #999 !important;
}
.site-description a:hover {
  color: #f0c040 !important;
}
.site-description h3 {
  color: #f0c040 !important;
}

/* ================================================================
   FOOTER INFO (Pelayanan, Deposit, Withdraw, dll)
   ================================================================ */
.site-info .site-info-title {
  border-bottom: 1px dotted rgba(240,192,64,0.3) !important;
}
.site-info .site-info-title h3 {
  color: #f0c040 !important;
}
.site-info .site-info-title p,
.site-info .site-info-description h4,
.site-info .site-info-description p {
  color: #aaa !important;
}
.site-info:not(:last-child):after,
.footer-info-container .site-info:not(:last-child):after {
  background-color: rgba(240,192,64,0.2) !important;
}
.section-title,
.footer-section-title {
  color: #f0c040 !important;
}

/* ================================================================
   PROGRESS BAR (Deposit/Withdraw time)
   ================================================================ */
.progressbar {
  background-color: #1a1a1a !important;
}
.proggress {
  background-color: #f0c040 !important;
}
.percentCount {
  color: #f0c040 !important;
}

/* ================================================================
   HEADLINE / HEADING UMUM (inline color override #9300CC → gold)
   ================================================================ */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  color: #f0c040 !important;
}

/* ================================================================
   LINK GLOBAL
   ================================================================ */
a {
  color: #f0c040 !important;
}
a:hover, a:focus {
  color: #ffd966 !important;
}

/* ================================================================
   PROVIDER / PARTNER SLIDE
   ================================================================ */
.provider-slide,
.partner-container {
  background-color: #111 !important;
  border-top: 1px solid rgba(240,192,64,0.15) !important;
  border-bottom: 1px solid rgba(240,192,64,0.15) !important;
}

/* ================================================================
   GAME CARDS / HOT GAMES
   ================================================================ */
.large-game-list > li {
  border: 1px solid rgba(240,192,64,0.15) !important;
  background-color: #1a1a1a !important;
  border-radius: 10px !important;
  transition: border-color 0.2s, box-shadow 0.2s !important;
}
.large-game-list > li:hover {
  border-color: #f0c040 !important;
  box-shadow: 0 0 12px rgba(240,192,64,0.3) !important;
}

/* ================================================================
   KATEGORI / TAB MENU (Slot, Casino, dll)
   ================================================================ */
.game-category-list > li[data-active="true"] > a,
.game-category-list > li:hover > a {
  color: #f0c040 !important;
  border-bottom: 2px solid #f0c040 !important;
}
.game-category-list > li > a {
  color: #ccc !important;
}

/* ================================================================
   INLINE STYLE OVERRIDE: warna ungu #9300CC → gold
   Ini menangani semua inline style="color:#9300CC" di HTML
   ================================================================ */
[style*="color:#9300CC"],
[style*="color: #9300CC"] {
  color: #f0c040 !important;
}
[style*="background-color:#9300CC"],
[style*="background-color: #9300CC"] {
  background-color: #f0c040 !important;
  color: #111 !important;
}

/* ================================================================
   MODAL / POPUP
   ================================================================ */
.modal-content {
  background-color: #141414 !important;
  border: 1px solid rgba(240,192,64,0.3) !important;
}
.modal-header {
  background-color: #1a1100 !important;
  border-bottom: 1px solid rgba(240,192,64,0.3) !important;
}
.modal-title {
  color: #f0c040 !important;
}
.modal-body {
  background-color: #141414 !important;
  color: #ccc !important;
}

/* ================================================================
   REGISTER / LOGIN BUTTON
   ================================================================ */
.btn-register,
.register-btn,
[class*="register"] .btn,
[class*="login"] .btn {
  background: linear-gradient(135deg, #f0c040, #c49a20) !important;
  color: #111 !important;
  border: none !important;
  font-weight: 700 !important;
}
.btn-register:hover,
.register-btn:hover {
  background: linear-gradient(135deg, #ffd966, #f0c040) !important;
  box-shadow: 0 0 12px rgba(240,192,64,0.5) !important;
}

/* ================================================================
   TOMBOL UMUM (CTA)
   ================================================================ */
.btn-primary {
  background: linear-gradient(135deg, #f0c040, #c49a20) !important;
  border-color: #f0c040 !important;
  color: #111 !important;
}
.btn-primary:hover {
  background: linear-gradient(135deg, #ffd966, #f0c040) !important;
}

/* ================================================================
   FORM INPUT
   ================================================================ */
.form-control {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(240,192,64,0.3) !important;
  color: #e0e0e0 !important;
}
.form-control:focus {
  border-color: #f0c040 !important;
  box-shadow: 0 0 0 2px rgba(240,192,64,0.2) !important;
}
.form-control::placeholder {
  color: #666 !important;
}

/* ================================================================
   BANK LIST DOTS
   ================================================================ */
.bank-list > [data-online='true']:before {
  background-color: #f0c040 !important;
}
.bank-list > [data-online='false']:before {
  background-color: #555 !important;
}

/* ================================================================
   DROPDOWN
   ================================================================ */
.dropdown-menu {
  background-color: #1a1a1a !important;
  border: 1px solid rgba(240,192,64,0.3) !important;
}
.dropdown-menu > li > a {
  color: #ccc !important;
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
  background-color: #2a1c00 !important;
  color: #f0c040 !important;
}

/* ================================================================
   SCROLLBAR (Chrome/Edge)
   ================================================================ */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0e0e0e; }
::-webkit-scrollbar-thumb { background: #f0c040; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #ffd966; }