/* =========================================================
   PREMIUM MOBILE FINAL OVERRIDE
   Visual-only layer. Does not alter PHP, database, RTP,
   game logic, wallet, authentication or API behavior.
========================================================= */
@media (max-width: 767.98px){
  :root{
    --pm-bg:#090a0d;
    --pm-surface:#101216;
    --pm-surface2:#15181e;
    --pm-border:rgba(139,92,246,.55);
    --pm-gold:#8b5cf6;
    --pm-gold2:#f0ca63;
    --pm-text:#f5f5f7;
    --pm-muted:#9da1ab;
  }

  html,body{
    background:var(--pm-bg)!important;
    color:var(--pm-text)!important;
    overflow-x:hidden!important;
  }
  body{padding-bottom:82px!important;}

  /* HEADER */
  .header-mobile{
    background:#090a0d!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  .header-mobile__top{
    min-height:64px!important;
    height:64px!important;
    padding:8px 10px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    background:#0b0c10!important;
    border-bottom:1px solid rgba(139,92,246,.32)!important;
    box-shadow:0 6px 20px rgba(0,0,0,.30)!important;
  }
  .header-mobile__top .mobile-logo{
    width:auto!important;
    max-width:46%!important;
    flex:0 1 auto!important;
  }
  .header-mobile__top .mobile-logo img{
    width:auto!important;
    max-width:100%!important;
    max-height:42px!important;
    object-fit:contain!important;
  }
  .header-mobile__top .mobile-button{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:7px!important;
    margin:0!important;
    flex:0 0 auto!important;
  }
  .header-mobile__top .mobile-button--register{
    height:40px!important;
    min-width:105px!important;
    padding:0 15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid var(--pm-gold)!important;
    border-radius:8px!important;
    background:#111318!important;
    color:#fff!important;
    font-size:14px!important;
    font-weight:800!important;
    text-decoration:none!important;
    box-shadow:none!important;
  }
  .header-mobile__top .mobile-button--menu{
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:40px!important;
    min-height:40px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid var(--pm-gold)!important;
    border-radius:8px!important;
    background:#111318!important;
    color:#fff!important;
    box-shadow:none!important;
  }
  .header-mobile__top .mobile-button--menu i{font-size:20px!important;}
  .header-mobile__top .mobile-button--transaksi{
    width:150px!important;
    min-width:150px!important;
    max-width:150px!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 9px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    border:1px solid var(--pm-gold)!important;
    border-radius:8px!important;
    background:#111318!important;
    color:#fff!important;
    box-shadow:none!important;
  }
  .header-mobile__top .mobile-button--transaksi .wallet-amount,
  .header-mobile__top .mobile-button--transaksi .wallet-amount span{
    color:#fff!important;
    font-size:13px!important;
    font-weight:800!important;
  }
  .header-mobile__top .mobile-button > a[name="refreshWallet"]{
    color:var(--pm-gold2)!important;
    width:28px!important;
    min-width:28px!important;
    height:40px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .header-mobile__marquee{
    min-height:35px!important;
    height:35px!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    padding:0 6px!important;
    background:#111318!important;
    border-top:0!important;
    border-bottom:1px solid rgba(139,92,246,.45)!important;
    color:#fff!important;
  }
  .header-mobile__marquee > i{color:var(--pm-gold2)!important;font-size:15px!important;}
  .header-mobile__marquee .marquee{
    color:#ededed!important;
    font-size:12px!important;
    font-weight:800!important;
  }
  .header-mobile__marquee a img{
    width:78px!important;
    height:auto!important;
    padding:0!important;
  }

  /* LOGIN / REGISTER CARDS */
  .home-auth-fixed-v2{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
    margin:10px 8px 12px!important;
  }
  .home-auth-fixed-v2 a{
    min-height:74px!important;
    padding:10px!important;
    gap:9px!important;
    border:1px solid rgba(139,92,246,.48)!important;
    border-radius:13px!important;
    background:linear-gradient(145deg,#17191e,#0d0f13)!important;
    box-shadow:0 8px 20px rgba(0,0,0,.22)!important;
  }
  .home-auth-fixed-v2 .hcf-icon{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    border-radius:10px!important;
    background:linear-gradient(145deg,#a855f7,#6d28d9)!important;
    color:#111!important;
  }
  .home-auth-fixed-v2 .hcf-title{
    color:#fff!important;
    font-size:14px!important;
    font-weight:900!important;
  }
  .home-auth-fixed-v2 .hcf-desc{
    color:#969aa4!important;
    font-size:10px!important;
  }

  /* HOME BANNER + JACKPOT */
  #main-route.home-fixed-v2{padding-bottom:86px!important;}
  #main-route.home-fixed-v2 .main-content.home{
    padding:0 8px 10px!important;
    max-width:100%!important;
  }
  .main-content.home .home__slider{
    margin:0 0 10px!important;
    border:1px solid rgba(139,92,246,.55)!important;
    border-radius:15px!important;
    background:#0b0c10!important;
    box-shadow:0 8px 22px rgba(0,0,0,.30)!important;
    overflow:hidden!important;
  }
  .main-content.home .home__slider .swiper-slide img{
    width:100%!important;
    display:block!important;
  }
  .main-content.home .home__jackpot{
    margin:0 0 11px!important;
    border:1px solid rgba(139,92,246,.55)!important;
    border-radius:14px!important;
    background:#0e1014!important;
    box-shadow:0 7px 18px rgba(0,0,0,.25)!important;
    overflow:hidden!important;
  }
  .main-content.home .home__jackpot .jackpot-gif{
    min-height:64px!important;
  }
  .main-content.home .home__jackpot .jackpot-amount{
    color:var(--pm-gold2)!important;
    font-size:14px!important;
    letter-spacing:2px!important;
  }

  /* CATEGORY GRID — COMPACT + SYMMETRIC */
  .mobile__category{
    margin:0!important;
    padding:0!important;
    background:#0a0b0e!important;
  }
  .mobile__category .container{
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
  }
  .mobile__category .category-container{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:7px!important;
    padding:2px 0 10px!important;
  }
  .mobile__category .category-container > a{
    display:block!important;
    min-width:0!important;
    text-decoration:none!important;
  }
  .mobile__category .category-item,
  .mobile__category .category-container .category-item{
    width:100%!important;
    height:78px!important;
    min-height:78px!important;
    padding:7px 3px 5px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid rgba(139,92,246,.48)!important;
    border-radius:12px!important;
    background:linear-gradient(145deg,#17191e,#0d0f13)!important;
    box-shadow:0 6px 15px rgba(0,0,0,.22)!important;
  }
  .mobile__category .category-item .icon{
    width:34px!important;
    height:34px!important;
    margin:0 0 4px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }
  .mobile__category .category-item .icon img{
    width:29px!important;
    height:29px!important;
    max-width:29px!important;
    max-height:29px!important;
    object-fit:contain!important;
    filter:brightness(0) saturate(100%) invert(76%) sepia(57%) saturate(650%) hue-rotate(357deg) brightness(94%) contrast(91%)!important;
  }
  .mobile__category .category-item .promo-category-icon i{
    color:var(--pm-gold2)!important;
    font-size:27px!important;
  }
  .mobile__category .category-item .name{
    color:#f4f4f5!important;
    font-size:9px!important;
    line-height:1!important;
    font-weight:800!important;
    text-transform:uppercase!important;
    white-space:nowrap!important;
  }

  /* SECTION TITLE */
  .mobile__popular{
    margin:2px 0 0!important;
    background:#0a0b0e!important;
    border-top:1px solid rgba(139,92,246,.24)!important;
    border-bottom:1px solid rgba(139,92,246,.24)!important;
  }
  .mobile__popular .container{
    padding:0!important;
  }
  .mobile__popular .popular-title{
    min-height:42px!important;
    padding:7px 0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    color:#f4f4f5!important;
    font-size:13px!important;
    font-weight:900!important;
  }
  .mobile__popular .popular-title i{color:var(--pm-gold2)!important;}

  /* GAME GRID */
  .mobile__games{
    padding:8px 0 12px!important;
    background:#08090c!important;
  }
  .mobile__games .container{padding:0!important;}
  .mobile__games .games-list{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    padding:0!important;
  }
  .mobile__games .games-holder{
    background:#111318!important;
    border:1px solid rgba(139,92,246,.35)!important;
    border-radius:9px!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }
  .mobile__games .games-img{
    border:0!important;
    background:#08090c!important;
    padding:3px!important;
  }
  .mobile__games .games-img img{
    border-radius:6px!important;
  }
  .mobile__games .games-name{
    color:#eee!important;
    font-size:9px!important;
    margin:4px 2px!important;
    height:22px!important;
  }

  /* BOTTOM NAV */
  .footer-mobile{
    height:72px!important;
    min-height:72px!important;
    background:rgba(8,9,12,.98)!important;
    border-top:1px solid rgba(139,92,246,.50)!important;
    box-shadow:0 -8px 25px rgba(0,0,0,.42)!important;
    backdrop-filter:blur(12px)!important;
    z-index:1500!important;
  }
  .footer-mobile .footer-item{
    color:#e7e7ea!important;
    padding:6px 2px 5px!important;
    text-decoration:none!important;
  }
  .footer-mobile .footer-item .footer-icon i{
    font-size:20px!important;
    color:inherit!important;
  }
  .footer-mobile .footer-item .footer-title{
    color:inherit!important;
    font-size:9px!important;
    font-weight:800!important;
  }
  .footer-mobile .footer-item.active{
    color:var(--pm-gold2)!important;
  }
  .footer-mobile .footer-item.footer-login .footer-icon{
    width:66px!important;
    height:66px!important;
    top:-48px!important;
    border:3px solid #090a0d!important;
    border-radius:50%!important;
    background:linear-gradient(145deg,#e3bd57,#6d28d9)!important;
    box-shadow:0 0 0 1px rgba(139,92,246,.55),0 8px 20px rgba(0,0,0,.65)!important;
  }
  .footer-mobile .footer-item.footer-login .footer-icon i{
    color:#111!important;
    font-size:27px!important;
  }
  .footer-mobile .footer-item.footer-login .footer-title{
    margin-top:4px!important;
  }

  /* SIDE MENU */
  .sidenav.sidenav-premium-v3{
    background:#0b0c10!important;
    border-left:1px solid rgba(139,92,246,.45)!important;
  }
  .sidenav.sidenav-premium-v3 .sidenav__header{
    background:linear-gradient(180deg,#17191e,#0b0c10)!important;
  }
  .sidenav.sidenav-premium-v3 .sidenav-button .btn-register{
    background:linear-gradient(135deg,#e2bc54,#b98924)!important;
    color:#111!important;
  }
  .sidenav.sidenav-premium-v3 .sidenav-button .btn-login{
    background:#15171c!important;
    color:#fff!important;
    border-color:rgba(139,92,246,.48)!important;
  }
  .sidenav.sidenav-premium-v3 .sidenav__list ul li i{
    color:var(--pm-gold2)!important;
  }
  .sidenav.sidenav-premium-v3 .sidenav__list ul li.active,
  .sidenav.sidenav-premium-v3 .sidenav__list ul li:hover{
    background:#17191e!important;
    border-color:rgba(139,92,246,.38)!important;
    color:var(--pm-gold2)!important;
  }
}

/* Small phones: preserve the 4-column symmetry without overflow */
@media (max-width:380px){
  .header-mobile__top .mobile-button--register{min-width:92px!important;padding:0 10px!important;}
  .header-mobile__top .mobile-button--transaksi{width:132px!important;min-width:132px!important;}
  .mobile__category .category-item{height:74px!important;min-height:74px!important;}
  .mobile__category .category-item .name{font-size:8px!important;}
}