/* ============================================================
   FIXWIN778 MOBILE - PREMIUM BLACK / RED OVERRIDE
   Loaded last so it wins over legacy gold/grey theme rules.
   ============================================================ */
:root{
  --premium-bg:#070707;
  --premium-panel:#101010;
  --premium-panel-2:#151515;
  --premium-red:#e50914;
  --premium-red-2:#b3000b;
  --premium-red-bright:#ff1a25;
  --premium-border:rgba(229,9,20,.55);
  --premium-text:#f5f5f5;
  --premium-muted:#a7a7a7;
  --premium-shadow:0 8px 28px rgba(0,0,0,.55);
}

html,body{background:#070707!important;color:var(--premium-text)!important;}
body{min-height:100vh;background:radial-gradient(circle at 50% -10%,#251010 0,#0a0a0a 38%,#050505 100%)!important;}
a{color:#ff3b44!important;}
a:hover{color:#fff!important;}

.header,.header-mobile{background:linear-gradient(180deg,#0b0b0b,#050505)!important;border-bottom:1px solid rgba(229,9,20,.5)!important;}
.header__mid,.header-mobile__top{background:transparent!important;}
.header-mobile__marquee{background:#0f0f0f!important;border-color:#8f0710!important;}
.header-mobile__marquee i{background:#b3000b!important;color:#fff!important;}
.header-mobile__marquee .marquee{color:#fff!important;}

.header-mobile__top .mobile-button .mobile-button--transaksi,
.header-mobile__top .mobile-button .mobile-button--menu,
.header-mobile__top .mobile-button .mobile-button--register,
.button-login,
.btn-custom,
.btn-custom-sm{
  background:linear-gradient(180deg,#ff2631 0%,#d60813 52%,#980008 100%)!important;
  border:1px solid #ff4b52!important;
  color:#fff!important;
  box-shadow:0 4px 14px rgba(229,9,20,.28)!important;
  border-radius:8px!important;
}
.header-mobile__top .mobile-button .mobile-button--transaksi span[name="mainBalance"]{color:#fff!important;}
.header-mobile__top .mobile-button .mobile-button--menu i{color:#fff!important;}

/* Kill legacy gold in the theme variables and common components. */
.home__jackpot,
.navbar,
.header-nav,
.sidenav,
.footer-mobile,
.page-header,
.game-holder,
.game-bottom,
.payment-border,
.menu-games .games-border,
.provider-border,
.category-border{border-color:var(--premium-border)!important;}

.home__jackpot{background:linear-gradient(180deg,#16090a 0%,#0d0d0d 60%,#070707 100%)!important;}
.home__jackpot .jackpot-gif{filter:saturate(.9)!important;}
.home__jackpot .jackpot-gif .jackpot-amount,
.home__jackpot .jackpot-gif .jackpot-amount span{color:#ff2430!important;text-shadow:0 0 7px rgba(255,20,30,.55)!important;}

.sidenav{background:linear-gradient(180deg,#111,#070707)!important;box-shadow:10px 0 35px rgba(0,0,0,.6)!important;}
.sidenav a,.sidenav .sidenav-item{color:#f1f1f1!important;border-bottom:1px solid rgba(255,255,255,.06)!important;}
.sidenav a:hover,.sidenav .active{background:rgba(229,9,20,.12)!important;color:#ff3039!important;}

.main-content,.home,.item-right-content{background:transparent!important;}
.card,.modal-content,.popup,.login-modal,.form-container,.profile-container,.transaction-container,
.deposit-container,.withdraw-container{background:linear-gradient(180deg,#151515,#0c0c0c)!important;color:#f5f5f5!important;border:1px solid rgba(255,255,255,.07)!important;box-shadow:var(--premium-shadow)!important;}

input,select,textarea,.form-control,.form-control-sm{background:#0b0b0b!important;color:#fff!important;border:1px solid #3a3a3a!important;border-radius:7px!important;}
input:focus,select:focus,textarea:focus,.form-control:focus{border-color:#e50914!important;box-shadow:0 0 0 2px rgba(229,9,20,.15)!important;}
::placeholder{color:#777!important;}

.footer-mobile{background:rgba(8,8,8,.98)!important;border-top:1px solid rgba(229,9,20,.6)!important;}
.footer-mobile .footer-item{color:#aaa!important;}
.footer-mobile .footer-item.active,.footer-mobile .footer-item:hover{color:#ff2731!important;}
.footer-mobile .footer-item.footer-login .footer-icon{background:linear-gradient(180deg,#ff2631,#a8000a)!important;border:3px solid #ff4b52!important;box-shadow:0 5px 20px rgba(229,9,20,.35)!important;}
.footer-mobile .footer-item.footer-login .footer-icon i{color:#fff!important;}

.game-list-container .game-holder{background:linear-gradient(180deg,#171717,#0c0c0c)!important;border:1px solid rgba(229,9,20,.28)!important;box-shadow:0 5px 16px rgba(0,0,0,.35)!important;}
.game-list-container .game-holder .game-bottom .game-name{color:#fff!important;}
.game-list-container .game-holder .game-bottom .game-links a{background:#c80913!important;color:#fff!important;border:1px solid #ff3c45!important;border-radius:5px!important;}

.home__menu,.home__provider,.home__payment,.home__seo{background:transparent!important;}
.home__menu .menu-games .games-item,.home__provider .provider-item,.home__payment .payment-item{background:#0f0f0f!important;border-color:rgba(229,9,20,.28)!important;}

/* Prevent broken/missing logo images from leaving a large empty header. */
.header-logo img,.mobile-logo img{object-fit:contain!important;}
.header-logo a,.mobile-logo a{display:flex!important;align-items:center!important;min-height:34px!important;}

/* Missing image fallback: keep alt text visually premium instead of blue browser link text. */
img[alt="WebsiteLogo"]{font-size:0;color:transparent;}

/* Popup / notification */
#popup-home .popup-box{background:#0c0c0c!important;border:2px solid rgba(229,9,20,.7)!important;box-shadow:0 0 25px rgba(229,9,20,.35),0 0 70px rgba(229,9,20,.16)!important;}
#popup-home .popup-close{border-color:rgba(255,40,50,.65)!important;color:#ff3039!important;}
#popup-home .popup-close:hover{background:#e50914!important;color:#fff!important;}

/* Legacy notification widgets which were styled gold. */
.withdraw-success,.deposit-success,.notification,.toast,.alert{background:#101010!important;color:#fff!important;border-color:#e50914!important;}

@media (max-width:768px){
  body{padding-bottom:68px!important;}
  .header-mobile__top{padding:8px 10px!important;grid-template-columns:minmax(0,1fr) auto!important;}
  .header-mobile__top .mobile-logo{width:auto!important;max-width:170px!important;overflow:hidden;}
  .header-mobile__top .mobile-logo img{max-width:125px!important;}
  .header-mobile__top .mobile-button{gap:5px!important;}
  .header-mobile__top .mobile-button .mobile-button--transaksi,
  .header-mobile__top .mobile-button .mobile-button--menu,
  .header-mobile__top .mobile-button .mobile-button--register{margin:0!important;min-width:48px!important;max-width:125px!important;padding:8px 9px!important;}
  .home__jackpot{padding:8px 0!important;}
  .home__jackpot .jackpot-gif{height:105px!important;}
  .home__jackpot .jackpot-gif .jackpot-amount{font-size:18px!important;top:20px!important;}
  .container{max-width:100%!important;padding-left:10px!important;padding-right:10px!important;}
}

/* ============================================================
   PREMIUM JACKPOT PANEL - BLACK / RED EDITION
   Replaces the old gold jackpot artwork visually while keeping
   the existing #amount logic untouched.
   ============================================================ */
.home .home__jackpot{
  position:relative!important;
  padding:24px 10px 30px!important;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,24,35,.16),transparent 42%),
    linear-gradient(180deg,#090909 0%,#050505 100%)!important;
  border-top:1px solid rgba(255,34,46,.16)!important;
  border-bottom:1px solid rgba(255,34,46,.18)!important;
  overflow:hidden!important;
}
.home .home__jackpot::before{
  content:"";
  position:absolute!important;
  left:8%; right:8%; top:10px;
  height:1px;
  background:linear-gradient(90deg,transparent,#ff1725 20%,#ff4a53 50%,#ff1725 80%,transparent);
  opacity:.7;
  box-shadow:0 0 14px rgba(255,23,37,.75);
}
.home .home__jackpot .container{
  position:relative!important;
  z-index:2!important;
}
.home .home__jackpot .jackpot-gif{
  position:relative!important;
  width:100%!important;
  max-width:640px!important;
  height:138px!important;
  margin:0 auto!important;
  background-image:
    radial-gradient(circle at 50% 25%,rgba(255,32,45,.13),transparent 38%),
    linear-gradient(145deg,#171717 0%,#0b0b0d 48%,#111 100%)!important;
  background-size:auto!important;
  border:1px solid rgba(255,40,50,.62)!important;
  border-radius:22px!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 35px rgba(0,0,0,.55),
    0 0 0 1px rgba(120,0,8,.55),
    0 12px 35px rgba(0,0,0,.72),
    0 0 28px rgba(229,9,20,.20)!important;
  overflow:hidden!important;
  filter:none!important;
}
.home .home__jackpot .jackpot-gif::before{
  content:"♛  JACKPOT  ♛";
  position:absolute!important;
  top:14px; left:50%; transform:translateX(-50%);
  min-width:190px;
  padding:7px 18px 6px;
  border-radius:999px;
  border:1px solid rgba(255,72,82,.65);
  background:linear-gradient(180deg,#2a0b0e,#0c0c0d);
  color:#fff;
  font-family:Arial,sans-serif;
  font-size:13px;
  font-weight:900;
  letter-spacing:3px;
  text-align:center;
  text-shadow:0 0 9px rgba(255,31,43,.75);
  box-shadow:0 0 18px rgba(229,9,20,.28),inset 0 1px rgba(255,255,255,.08);
  z-index:3!important;
}
.home .home__jackpot .jackpot-gif::after{
  content:"PROGRESSIVE JACKPOT • LIVE";
  position:absolute!important;
  left:50%; bottom:12px; transform:translateX(-50%);
  color:#777;
  font-family:Arial,sans-serif;
  font-size:9px;
  font-weight:700;
  letter-spacing:2.2px;
  white-space:nowrap;
  z-index:3!important;
}
.home .home__jackpot .jackpot-amount{
  position:absolute!important;
  inset:0!important;
  top:0!important; left:0!important;
  width:100%!important;
  height:100%!important;
  padding:48px 12px 22px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  color:#f7f7f7!important;
  font-family:Arial,sans-serif!important;
  font-size:12px!important;
  font-weight:900!important;
  letter-spacing:3px!important;
  text-shadow:none!important;
  z-index:2!important;
  box-sizing:border-box!important;
}
.home .home__jackpot .jackpot-amount::first-letter{color:#ff2633!important;}
.home .home__jackpot .jackpot-amount span#amount{
  display:inline-block!important;
  padding:7px 13px!important;
  min-width:170px!important;
  text-align:center!important;
  border-radius:8px!important;
  background:linear-gradient(180deg,#23090c,#100406)!important;
  border:1px solid rgba(255,43,55,.32)!important;
  color:#ff2635!important;
  font-family:advanced_dot_digital-7regular,monospace!important;
  font-size:20px!important;
  line-height:1!important;
  letter-spacing:3px!important;
  text-shadow:0 0 5px rgba(255,18,32,.95),0 0 14px rgba(255,18,32,.55)!important;
  box-shadow:inset 0 0 12px rgba(255,0,18,.08),0 0 14px rgba(255,0,18,.10)!important;
}
.home .home__jackpot .jackpot-amount span#amount::before{content:"Rp ";font-family:Arial,sans-serif;font-size:11px;letter-spacing:1px;color:#ff6870;vertical-align:middle;margin-right:4px;}

@media (max-width:768px){
  .home .home__jackpot{padding:18px 8px 22px!important;}
  .home .home__jackpot .jackpot-gif{height:126px!important;border-radius:19px!important;}
  .home .home__jackpot .jackpot-gif::before{top:12px;min-width:165px;padding:6px 12px;font-size:11px;letter-spacing:2.4px;}
  .home .home__jackpot .jackpot-gif::after{bottom:10px;font-size:7px;letter-spacing:1.6px;}
  .home .home__jackpot .jackpot-amount{padding:43px 8px 20px!important;font-size:10px!important;letter-spacing:2px!important;gap:5px!important;}
  .home .home__jackpot .jackpot-amount span#amount{min-width:150px!important;padding:7px 8px!important;font-size:17px!important;letter-spacing:2px!important;}
  .home .home__jackpot .jackpot-amount span#amount::before{font-size:9px;}
}


.provider-fallback-logo{height:209px;display:flex;align-items:center;justify-content:center;border-radius:16px;background:radial-gradient(circle at 50% 35%,rgba(220,0,45,.28),rgba(8,8,10,.96) 68%);border:1px solid rgba(255,35,65,.55);box-shadow:inset 0 0 28px rgba(255,20,50,.12),0 0 18px rgba(255,20,50,.12)}
.provider-fallback-logo span{font-weight:900;font-size:42px;letter-spacing:2px;color:#fff;text-shadow:0 0 12px rgba(255,30,60,.8)}


/* Provider/game image reliability */
.slot-game .slot-game-img{background:linear-gradient(180deg,#121212,#090909)!important;min-height:150px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;}
.slot-game .slot-game-img img.provider-game-image{width:100%!important;height:150px!important;object-fit:contain!important;display:block!important;opacity:1!important;visibility:visible!important;background:transparent!important;}
.slot-game .slot-game-img img.provider-game-image.image-unavailable{display:none!important;}
.slot-game .slot-game-img:has(img.provider-game-image.image-unavailable)::after{content:'GAME IMAGE';color:#777;font-size:11px;letter-spacing:2px;font-weight:800;}
@media(max-width:425px){.slot-game .slot-game-img{min-height:120px!important}.slot-game .slot-game-img img.provider-game-image{height:120px!important;}}

/* Provider action buttons: remove legacy yellow */
.slot-game .slot-game-item .slot-game-hover .main{background:linear-gradient(180deg,#ff2631,#c90813)!important;color:#fff!important;border:1px solid #ff4c55!important;border-radius:8px!important;box-shadow:0 4px 14px rgba(229,9,20,.25)!important;}


/* ============================================================
   HOME LIVE GAME - SINGLE ROW / HORIZONTAL SWIPE
   ============================================================ */
.home__live-games{
  position:relative!important;
  padding:18px 0 22px!important;
  background:linear-gradient(180deg,#090909 0%,#0b0b0d 100%)!important;
  border-top:1px solid rgba(255,25,42,.18)!important;
  border-bottom:1px solid rgba(255,25,42,.20)!important;
  overflow:hidden!important;
}
.live-strip-head{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 2px 12px!important;
}
.live-strip-line{
  flex:1!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,#ff1f32)!important;
  box-shadow:0 0 8px rgba(255,25,42,.45)!important;
}
.live-strip-line:last-of-type{background:linear-gradient(90deg,#ff1f32,transparent)!important;}
.live-strip-title{
  flex:0 0 auto!important;
  color:#ff2638!important;
  font-size:16px!important;
  font-weight:900!important;
  letter-spacing:1.3px!important;
  text-shadow:0 0 10px rgba(255,20,35,.42)!important;
  white-space:nowrap!important;
}
.live-strip-more{
  flex:0 0 auto!important;
  color:#fff!important;
  background:linear-gradient(180deg,#f52835,#b70611)!important;
  border:1px solid #ff4b54!important;
  border-radius:999px!important;
  padding:5px 9px!important;
  font-size:9px!important;
  font-weight:800!important;
  text-decoration:none!important;
  box-shadow:0 0 10px rgba(229,9,20,.28)!important;
}
.live-game-horizontal{
  display:flex!important;
  flex-wrap:nowrap!important;
  gap:10px!important;
  width:100%!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:2px 2px 10px!important;
  scroll-snap-type:x proximity!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
  touch-action:pan-x!important;
}
.live-game-horizontal::-webkit-scrollbar{display:none!important;}
.live-game-card{
  flex:0 0 154px!important;
  width:154px!important;
  scroll-snap-align:start!important;
}
.live-game-card-link{
  display:block!important;
  position:relative!important;
  overflow:hidden!important;
  text-decoration:none!important;
  background:linear-gradient(180deg,#18181b 0%,#0b0b0d 100%)!important;
  border:1px solid rgba(255,34,53,.55)!important;
  border-radius:13px!important;
  box-shadow:inset 0 0 20px rgba(255,20,40,.06),0 7px 18px rgba(0,0,0,.45)!important;
}
.live-game-card-link:active{transform:scale(.985)!important;}
.live-game-card-image{
  position:relative!important;
  height:108px!important;
  background:#0d0d0f!important;
  overflow:hidden!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.live-game-card-image img.provider-game-image{
  width:100%!important;
  height:108px!important;
  object-fit:cover!important;
  display:block!important;
  opacity:1!important;
}
.live-game-card-image img.provider-game-image.image-unavailable{display:none!important;}
.live-game-card-image:has(img.provider-game-image.image-unavailable)::after{
  content:'LIVE GAME'!important;
  color:#777!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:1.5px!important;
}
.live-game-image-fallback{
  color:#ff2938!important;
  font-weight:900!important;
  letter-spacing:2px!important;
  text-shadow:0 0 10px rgba(255,25,40,.55)!important;
}
.live-game-badge{
  position:absolute!important;
  left:7px!important;
  top:7px!important;
  padding:3px 6px!important;
  border-radius:5px!important;
  color:#fff!important;
  background:#d90816!important;
  border:1px solid #ff5961!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:1px!important;
  box-shadow:0 0 10px rgba(229,9,20,.45)!important;
}
.live-game-card-name{
  height:35px!important;
  display:flex!important;
  align-items:center!important;
  padding:0 9px!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:800!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  background:#111113!important;
}
.live-game-play{
  display:block!important;
  margin:0 8px 8px!important;
  padding:6px 4px!important;
  text-align:center!important;
  color:#fff!important;
  background:linear-gradient(180deg,#ff2936,#c70814)!important;
  border:1px solid #ff4b54!important;
  border-radius:7px!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.5px!important;
  box-shadow:0 4px 12px rgba(229,9,20,.22)!important;
}
@media(max-width:425px){
  .home__live-games{padding:15px 0 18px!important;}
  .live-strip-title{font-size:14px!important;}
  .live-strip-more{font-size:8px!important;padding:5px 8px!important;}
  .live-game-horizontal{gap:8px!important;padding-left:1px!important;padding-right:1px!important;}
  .live-game-card{flex-basis:145px!important;width:145px!important;}
  .live-game-card-image,.live-game-card-image img.provider-game-image{height:100px!important;}
}