/* CXF THEME enabled=1 bg=#121212 text=#FFFFFF login=#EDEDED register=#AFAFAF gridOrange=#292929 gridYellow=#EDEDED gameCard=#222222 gameBorder=#EDEDED font=Inter */
:root{
  --cxf-theme-bg:#121212;
  --cxf-theme-text:#FFFFFF;
  --cxf-login-bg:#EDEDED;
  --cxf-register-bg:#AFAFAF;
  --cxf-grid-orange:#292929;
  --cxf-grid-yellow:#EDEDED;
  --cxf-login-text:#111111;
  --cxf-register-text:#111111;
  --cxf-grid-text:#111111;
  --cxf-game-card:#222222;
  --cxf-game-border:#EDEDED;
  --cxf-game-text:#FFFFFF;
  --cxf-grid-border:#FFFFFF;
  --cxf-menu-bg:#EDEDED;
  --cxf-menu-text:#111111;
  --cxf-livechat-bg:#EDEDED;
  --cxf-livechat-text:#111111;
  --cxf-provider-label-bg:#EDEDED;
  --cxf-provider-label-text:#111111;
  --cxf-provider-label-border:#FFFFFF;
  --cxf-provider-label-font:Inter,Arial,sans-serif;
  --cxf-popup-bg:#222222;
  --cxf-popup-border:#EDEDED;
  --cxf-popup-title:#FFFFFF;
  --cxf-popup-label:#FFFFFF;
  --cxf-popup-input-bg:#FFFFFF;
  --cxf-popup-input-text:#111111;
  --cxf-popup-button-bg:#EDEDED;
  --cxf-popup-button-text:#111111;
  --cxf-popup-link:#FFFFFF;
  --cxf-popup-close-bg:#EDEDED;
  --cxf-popup-close-text:#111111;
  --cxf-popup-overlay:#000000;

  --background-page:#121212;
  --primary-color:#121212;
  --footer-color:#121212;
  --lottery-color:#121212;
  --page-text:#FFFFFF;
  --primary-text:#FFFFFF;
  --secondary-text:#FFFFFF;
  --footer-text:#FFFFFF;
  --lottery-text:#FFFFFF;
  --header-text:#FFFFFF;
  --navbar-text:#FFFFFF;
}

html,body,
body .main-content,
body .main-content.home,
body .home,
body .home .mobile__category,
body .home .mobile__games,
body .home .games-container,
body .home .games-container__header,
body .mobile__seo,
body .page-content,
body .content-wrapper,
body .slot-game,
body .slot-game .slot-game__container,
body .slot-game-list,
body .popular,
body .promotion,
body .news,
body .contact,
body .help,
body .profile,
body .transaction,
body .bonus,
body .memo {
  background-image:none!important;
  background-color:var(--cxf-theme-bg)!important;
  color:var(--cxf-theme-text)!important;
}

body .header-mobile__top,
body .header-mobile__marquee,
body .footer-mobile,
body .sidenav,
body .sidenav__header,
body .sidenav__header-game,
body .sidenav__list {
  background-color:var(--cxf-theme-bg)!important;
  color:var(--cxf-theme-text)!important;
}

body,body button,body input,body select,body textarea,
body a,body p,body span,body div,body li,body label,
body table,body th,body td,body h1,body h2,body h3,body h4,body h5,body h6 {
  font-family:Inter,Arial,sans-serif!important;
}

body p,body span,body a,body label,
body h1,body h2,body h3,body h4,body h5,body h6,
body .games-name,body .slot-game-name,body .slot-game-name .name,
body .games-title,body .page-header,body .sidenav a,body .sidenav li {
  color:var(--cxf-theme-text)!important;
}

/* MASUK */
body .home .mobile__login .btn-login,
body .header__top .top-holder .header-form .form-button .btn-login,
body .sidenav .sidenav__header .sidenav__header-button .sidenav-button .btn-login {
  background:var(--cxf-login-bg)!important;
  background-color:var(--cxf-login-bg)!important;
  background-image:none!important;
  color:var(--cxf-login-text)!important;
}
body .home .mobile__login .btn-login *,
body .header__top .top-holder .header-form .form-button .btn-login *,
body .sidenav .sidenav__header .sidenav__header-button .sidenav-button .btn-login * { color:var(--cxf-login-text)!important; }

/* DAFTAR */
body .home .mobile__login .btn-register,
body .header__top .top-holder .header-form .form-button .btn-register,
body .sidenav .sidenav__header .sidenav__header-button .sidenav-button .btn-register {
  background:var(--cxf-register-bg)!important;
  background-color:var(--cxf-register-bg)!important;
  background-image:none!important;
  color:var(--cxf-register-text)!important;
}
body .home .mobile__login .btn-register *,
body .header__top .top-holder .header-form .form-button .btn-register *,
body .sidenav .sidenav__header .sidenav__header-button .sidenav-button .btn-register * { color:var(--cxf-register-text)!important; }

/* GRID / LINGKARAN ORANGE */
body .home .home__category-cont .category-item .item-icon,
body .home .mobile__category .category-container .category-item .item-icon {
  background:var(--cxf-grid-orange)!important;
  background-color:var(--cxf-grid-orange)!important;
  background-image:none!important;
}

/* GRID / LABEL KUNING */
body .home .home__category-cont .category-item .item-name,
body .home .mobile__category .category-container .category-item .item-name {
  background:var(--cxf-grid-yellow)!important;
  background-color:var(--cxf-grid-yellow)!important;
  background-image:none!important;
  color:var(--cxf-grid-text)!important;
}
body .home .home__category-cont .category-item .item-name *,
body .home .mobile__category .category-container .category-item .item-name * { color:var(--cxf-grid-text)!important; }

/* GAME CARD / LIST GAME - pertahankan kotak seperti theme asli */
body .slot-game .slot-game__container .slot-game-list .slot-game-item {
  background:var(--cxf-game-card)!important;
  border:3px solid var(--cxf-game-border)!important;
  border-radius:13px!important;
  overflow:hidden!important;
  box-shadow:0 2px 8px rgba(0,0,0,.18)!important;
}
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-img,
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-name {
  background:var(--cxf-game-card)!important;
  background-color:var(--cxf-game-card)!important;
}
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-name,
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-name .name,
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-name span {
  color:var(--cxf-game-text)!important;
}
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-img { border-radius:10px 10px 0 0!important; }
body .slot-game .slot-game__container .slot-game-list .slot-game-item .slot-game-name { border-radius:0 0 10px 10px!important; }


/* HOME GAME TERPOPULER - kotak tetap kelihatan saat custom theme */
body .home .mobile__games .games-container .mobile-games-list .games-holder,
body .home .home__game .game-container__list .games-holder {
  background:var(--cxf-game-card)!important;
  border:3px solid var(--cxf-game-border)!important;
  border-radius:13px!important;
  overflow:hidden!important;
  box-shadow:0 2px 8px rgba(0,0,0,.18)!important;
}
body .home .mobile__games .games-container .mobile-games-list .games-holder .games-img,
body .home .mobile__games .games-container .mobile-games-list .games-holder .games-name,
body .home .home__game .game-container__list .games-holder .games-img,
body .home .home__game .game-container__list .games-holder .games-name {
  background:var(--cxf-game-card)!important;
  background-color:var(--cxf-game-card)!important;
}
body .home .mobile__games .games-container .mobile-games-list .games-holder .games-name,
body .home .home__game .game-container__list .games-holder .games-name {
  color:var(--cxf-game-text)!important;
}


/* Progressive Jackpot demo dari patch lama: paksa hilang bila masih tersisa di cache/DOM. */
#cxfJackpotDemo{display:none!important;}

/* Floating MENU: background dan teks/hamburger bisa diatur terpisah. */
body .mpo-float-btn {
  background:var(--cxf-menu-bg)!important;
  background-image:none!important;
  color:var(--cxf-menu-text)!important;
}
body .mpo-float-btn .mpo-icon-menu span {background:var(--cxf-menu-text)!important;}
body .mpo-sidebar {border-left-color:var(--cxf-menu-bg)!important;}
body .mpo-close {border-color:var(--cxf-menu-bg)!important;color:var(--cxf-menu-bg)!important;}
body .mpo-close:hover {background:var(--cxf-menu-bg)!important;color:var(--cxf-menu-text)!important;}

/* Live Chat SAMPING KIRI: gambar/asset asli TIDAK diubah. Hanya warna wadah/border. */
body #slide-left1 {
  border-right-color:var(--cxf-livechat-bg)!important;
}
body #toggle-left1 {
  width:auto!important;
  min-height:0!important;
  padding:8px 6px!important;
  display:block!important;
  background:var(--cxf-livechat-bg)!important;
  background-image:none!important;
  color:var(--cxf-livechat-text)!important;
  border-color:rgba(255,255,255,.28)!important;
  box-shadow:5px 0 15px rgba(0,0,0,.28)!important;
}
body #toggle-left1 img {
  display:block!important;
  width:28px!important;
  height:auto!important;
  max-width:none!important;
  filter:drop-shadow(0 2px 2px rgba(0,0,0,.3))!important;
  opacity:1!important;
}
body #toggle-left1::before,
body #toggle-left1::after {content:none!important;display:none!important;}
@media(max-width:480px){
  body #toggle-left1{padding:6px 4px!important;}
  body #toggle-left1 img{width:24px!important;}
}
/* Tombol Livechat DI DALAM panel tetap pakai asset/icon aslinya. */
body .btn-contact-item[title="Livechat"] {
  border-color:var(--cxf-livechat-bg)!important;
}

/* Saat custom theme aktif, Arcade dikeluarkan dari grid home agar tersisa 6 menu. */
body .home .mobile__category .category-container > a[href="/arcade"],
body .home .mobile__category .category-container > a[href="/main/arcade"],
body .home .home__category-cont > a[href="/arcade"],
body .home .home__category-cont > a[href="/main/arcade"] {display:none!important;}

/* GRID KOTAK 6 MENU - 3 x 2, proporsi mengikuti card provider yang lebih rapi. */
body .home .mobile__category .category-container,
body .home .home__category-cont {
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  align-items:stretch!important;
  padding:10px 12px 14px!important;
}
body .home .mobile__category .category-container > a,
body .home .home__category-cont > a {
  display:block!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
  text-decoration:none!important;
}
body .home .mobile__category .category-container .category-item,
body .home .home__category-cont .category-item {
  position:relative!important;
  width:100%!important;
  aspect-ratio:1 / 1.12!important;
  min-height:0!important;
  margin:0!important;
  padding:8px 6px 7px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  background:var(--cxf-grid-orange)!important;
  background-image:none!important;
  border:3px solid var(--cxf-grid-border)!important;
  border-radius:14px!important;
  box-shadow:0 3px 0 rgba(0,0,0,.35),0 6px 13px rgba(0,0,0,.20)!important;
  overflow:hidden!important;
}
body .home .mobile__category .category-container .category-item .item-icon,
body .home .home__category-cont .category-item .item-icon {
  flex:1 1 auto!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  margin:0!important;
  padding:5px 2px 0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}
body .home .mobile__category .category-container .category-item .item-icon img,
body .home .home__category-cont .category-item .item-icon img {
  width:52px!important;
  height:52px!important;
  max-width:60%!important;
  max-height:60%!important;
  object-fit:contain!important;
  filter:none!important;
}
body .home .mobile__category .category-container .category-item .item-name,
body .home .home__category-cont .category-item .item-name {
  flex:0 0 auto!important;
  width:100%!important;
  min-height:22px!important;
  margin:0!important;
  padding:2px 2px 3px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:var(--cxf-grid-text)!important;
  font-size:clamp(10px,2.8vw,13px)!important;
  font-weight:800!important;
  line-height:1.1!important;
  text-align:center!important;
  white-space:normal!important;
  text-transform:uppercase!important;
}
body .home .mobile__category .category-container .category-item .hot-tag,
body .home .home__category-cont .category-item .hot-tag {
  position:absolute!important;
  top:5px!important;
  right:5px!important;
  width:28px!important;
  height:auto!important;
  z-index:2!important;
}
@media(max-width:420px){
  body .home .mobile__category .category-container,
  body .home .home__category-cont {gap:8px!important;padding:9px 10px 12px!important;}
  body .home .mobile__category .category-container .category-item,
  body .home .home__category-cont .category-item {padding:7px 4px 6px!important;border-radius:12px!important;}
  body .home .mobile__category .category-container .category-item .item-icon img,
  body .home .home__category-cont .category-item .item-icon img {width:46px!important;height:46px!important;}
  body .home .mobile__category .category-container .category-item .item-name,
  body .home .home__category-cont .category-item .item-name {font-size:10px!important;}
}


/* LOGIN POPUP - ikut custom theme, logic login tetap asli. */
body.modal-open .modal-backdrop,
.modal-backdrop.show{
  background:var(--cxf-popup-overlay)!important;
  background-color:var(--cxf-popup-overlay)!important;
  opacity:.72!important;
}
#loginModal .modal-dialog{
  width:min(94vw,470px)!important;
  margin:clamp(18px,5vh,44px) auto!important;
  padding:0 10px!important;
}
#loginModal .modal-content{
  width:100%!important;
  max-width:470px!important;
  margin:auto!important;
  background:var(--cxf-popup-bg)!important;
  background-image:none!important;
  border:2px solid var(--cxf-popup-border)!important;
  border-radius:16px!important;
  overflow:hidden!important;
  box-shadow:0 18px 45px rgba(0,0,0,.46)!important;
  color:var(--cxf-popup-label)!important;
}
#loginModal .modal-content .close{
  top:12px!important;
  right:12px!important;
  width:36px!important;
  height:36px!important;
  border-radius:50%!important;
  border:2px solid var(--cxf-popup-border)!important;
  background:var(--cxf-popup-close-bg)!important;
  background-image:none!important;
  color:var(--cxf-popup-close-text)!important;
  box-shadow:0 4px 12px rgba(0,0,0,.22)!important;
}
#loginModal .modal-content .close i,
#loginModal .modal-content .close *{color:var(--cxf-popup-close-text)!important;}
#loginModal .modal-header{
  padding:28px 24px 8px!important;
  border:0!important;
  background:transparent!important;
}
#loginModal .modal-header .modal-title{
  margin:0!important;
  color:var(--cxf-popup-title)!important;
  font-size:clamp(28px,7vw,40px)!important;
  line-height:1.1!important;
  font-weight:800!important;
}
#loginModal .modal-body{
  padding:10px 24px 26px!important;
  background:transparent!important;
  color:var(--cxf-popup-label)!important;
}
#loginModal .modal-body .modal-body-form .form-item{
  margin-bottom:15px!important;
}
#loginModal .modal-body .modal-body-form .form-item .item-title{
  margin-bottom:7px!important;
  color:var(--cxf-popup-label)!important;
  font-size:15px!important;
  line-height:1.2!important;
  font-weight:700!important;
}
#loginModal .modal-body .modal-body-form .form-item input,
#loginModal .modal-body .modal-body-form .form-item input.form-control{
  width:100%!important;
  min-height:48px!important;
  padding:10px 14px!important;
  background:var(--cxf-popup-input-bg)!important;
  background-color:var(--cxf-popup-input-bg)!important;
  background-image:none!important;
  color:var(--cxf-popup-input-text)!important;
  border:1px solid var(--cxf-popup-border)!important;
  border-radius:8px!important;
  box-shadow:none!important;
  caret-color:var(--cxf-popup-button-bg)!important;
}
#loginModal .modal-body .modal-body-form .form-item input::placeholder{
  color:var(--cxf-popup-input-text)!important;
  opacity:.55!important;
}
#loginModal .toggle-password{
  color:var(--cxf-popup-input-text)!important;
  opacity:.7!important;
}
#loginModal .login-captcha-item img{
  border:1px solid var(--cxf-popup-border)!important;
  border-radius:8px!important;
}
#loginModal #refresh-login-captcha{
  min-width:50px!important;
  height:48px!important;
  border:1px solid var(--cxf-popup-border)!important;
  border-radius:8px!important;
  background:var(--cxf-popup-button-bg)!important;
  background-image:none!important;
  color:var(--cxf-popup-button-text)!important;
}
#loginModal #refresh-login-captcha *{color:var(--cxf-popup-button-text)!important;}
#loginModal .modal-body .modal-body-form .form-forgot a,
#loginModal .modal-body .modal-body-form .form-register,
#loginModal .modal-body .modal-body-form .form-register span,
#loginModal .modal-body .modal-body-form .form-register a{
  color:var(--cxf-popup-link)!important;
}
#loginModal .modal-body .modal-body-form .form-forgot a{
  top:-4px!important;
  font-size:14px!important;
  font-weight:700!important;
}
#loginModal .modal-body .modal-body-form .form-button{
  margin-top:12px!important;
}
#loginModal .modal-body .modal-body-form .form-button button{
  width:100%!important;
  min-height:50px!important;
  padding:10px 14px!important;
  border:1px solid var(--cxf-popup-border)!important;
  border-radius:9px!important;
  background:var(--cxf-popup-button-bg)!important;
  background-image:none!important;
  color:var(--cxf-popup-button-text)!important;
  font-size:18px!important;
  font-weight:800!important;
  box-shadow:0 5px 12px rgba(0,0,0,.18)!important;
}
#loginModal .modal-body .modal-body-form .form-button button:hover,
#loginModal .modal-body .modal-body-form .form-button button:focus{
  filter:brightness(1.06)!important;
  background:var(--cxf-popup-button-bg)!important;
  color:var(--cxf-popup-button-text)!important;
}
#loginModal .modal-body .modal-body-form .form-register{
  padding-top:20px!important;
  font-size:15px!important;
}
@media(max-width:480px){
  #loginModal .modal-dialog{width:96vw!important;padding:0 6px!important;margin:16px auto!important;}
  #loginModal .modal-header{padding:24px 18px 7px!important;}
  #loginModal .modal-body{padding:8px 18px 22px!important;}
  #loginModal .modal-header .modal-title{font-size:clamp(26px,9vw,36px)!important;}
  #loginModal .modal-content .close{top:10px!important;right:10px!important;width:34px!important;height:34px!important;}
}

@media(max-width:768px){
  html,body,body .main-content,body .main-content.home,body .home,
  body .home .mobile__category,body .home .mobile__games,body .home .games-container {
    background-image:none!important;
    background-color:var(--cxf-theme-bg)!important;
  }
}
