
/* =========================================================
   MODERN PREMIUM UI POLISH — VISUAL ONLY
   Does not modify PHP, game/RTP data, API, wallet logic or JS.
   ========================================================= */
:root{
  --modern-bg:#08090d;
  --modern-surface:#11131a;
  --modern-surface-2:#171a23;
  --modern-border:rgba(255,255,255,.09);
  --modern-text:#f7f7fb;
  --modern-muted:#a8acb8;
  --modern-accent:#8b5cf6;
  --modern-accent-2:#a78bfa;
  --modern-shadow:0 12px 35px rgba(0,0,0,.32);
}

html{scroll-behavior:smooth}
body{
  background-color:var(--modern-bg)!important;
  color:var(--modern-text);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
button,a,input,select,textarea{transition:all .2s ease}

/* Header: clean, compact, premium */
.header-mobile,
.header-mobile__top,
.header__top,
.header__mid,
.header-nav{
  border-color:var(--modern-border)!important;
}
.header-mobile__top,
.header__top,
.header__mid{
  box-shadow:0 8px 28px rgba(0,0,0,.18);
}
.header-mobile__top{
  background:rgba(10,11,16,.94)!important;
  backdrop-filter:blur(14px);
}
.header-logo img,
.header-mobile__top img{
  filter:drop-shadow(0 4px 12px rgba(139,92,246,.12));
}

/* Main containers */
.main-content,
.page-content,
.content-wrapper{
  position:relative;
}
.container,.container-fluid{
  position:relative;
}

/* Game/category navigation */
.game-list .nav-tabs,
.provider-nav,
.component-tab-game{
  border-bottom:1px solid var(--modern-border)!important;
  gap:6px;
}
.game-list .nav-tabs .nav-link,
.provider-nav .nav-link,
.component-tab-game .nav-link{
  border:1px solid transparent!important;
  border-radius:10px!important;
  color:var(--modern-muted)!important;
  font-weight:700!important;
  background:transparent!important;
}
.game-list .nav-tabs .nav-link:hover,
.provider-nav .nav-link:hover,
.component-tab-game .nav-link:hover{
  color:#fff!important;
  background:rgba(139,92,246,.08)!important;
}
.game-list .nav-tabs .nav-link.active,
.provider-nav .nav-link.active,
.component-tab-game .nav-link.active{
  color:#fff!important;
  background:linear-gradient(135deg,rgba(139,92,246,.22),rgba(139,92,246,.08))!important;
  border-color:rgba(167,139,250,.28)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.18);
}

/* Game cards */
.game-item,.game-item-new,.slot-game-item,.casino-game-item,.game-holder{
  border-radius:14px!important;
  overflow:hidden;
}
.game-item,.game-item-new,.slot-game-item,.casino-game-item{
  background:linear-gradient(145deg,#151821,#0f1117)!important;
  border:1px solid var(--modern-border)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.22);
}
.game-item:hover,.game-item-new:hover,.slot-game-item:hover,.casino-game-item:hover{
  transform:translateY(-3px);
  border-color:rgba(167,139,250,.32)!important;
  box-shadow:0 14px 30px rgba(0,0,0,.34),0 0 0 1px rgba(139,92,246,.08);
}
.game-img,.games-img,.slot-game-img,.casino-game-img{
  background:#0c0e13;
}
.game-name,.games-name,.slot-game-name,.casino-game-name{
  color:#f5f5f8!important;
  font-weight:700!important;
  letter-spacing:.1px;
}

/* Generic cards / sections */
.card{
  background:linear-gradient(145deg,#151821,#101218)!important;
  border:1px solid var(--modern-border)!important;
  border-radius:16px!important;
  box-shadow:var(--modern-shadow);
}
.card-header{
  background:rgba(255,255,255,.025)!important;
  border-bottom:1px solid var(--modern-border)!important;
  color:#fff!important;
}

/* Buttons */
.btn-login,.btn-register,.form-button,.claim-button,.download-button,
.btn-theme-primary,.btn-theme-secondary{
  border-radius:11px!important;
  font-weight:800!important;
  box-shadow:0 7px 18px rgba(0,0,0,.22)!important;
  text-shadow:none!important;
}
.btn-login:hover,.btn-register:hover,.form-button:hover,.claim-button:hover,
.download-button:hover,.btn-theme-primary:hover,.btn-theme-secondary:hover{
  transform:translateY(-1px);
  filter:brightness(1.06);
}

/* Forms */
.form-control,.form-select,
.game-form .form-control,.game-form .form-select{
  background:#0d0f15!important;
  color:#f5f5f8!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:11px!important;
  box-shadow:none!important;
}
.form-control:focus,.form-select:focus,
.game-form .form-control:focus,.game-form .form-select:focus{
  border-color:rgba(167,139,250,.65)!important;
  box-shadow:0 0 0 3px rgba(139,92,246,.12)!important;
  outline:none!important;
}
.form-control::placeholder{color:#777c88!important}

/* Tables */
.table{
  color:#e9eaf0!important;
  border-color:var(--modern-border)!important;
}
.table thead th{
  background:#171a22!important;
  color:#fff!important;
  border-color:var(--modern-border)!important;
}
.table tbody td{
  border-color:rgba(255,255,255,.06)!important;
}

/* Login / register / content panels */
.register__container,
.login__container,
.register-form,
.login-form{
  border-radius:16px!important;
}
.register__container,.login__container{
  box-shadow:var(--modern-shadow);
}

/* Sidebar */
.sidenav{
  background:linear-gradient(180deg,#0d0e14,#08090d)!important;
  border-right:1px solid var(--modern-border)!important;
  box-shadow:12px 0 35px rgba(0,0,0,.22);
}
.sidenav__list ul li{
  border-radius:9px!important;
  margin:3px 8px!important;
}
.sidenav__list ul li:hover{
  background:rgba(139,92,246,.08)!important;
}

/* Footer / bottom navigation — keep the existing 5-column structure */
@media(max-width:767.98px){
  .footer-mobile{
    background:rgba(8,9,13,.96)!important;
    border-top:1px solid rgba(167,139,250,.25)!important;
    box-shadow:0 -10px 30px rgba(0,0,0,.38)!important;
    backdrop-filter:blur(14px);
  }
  .footer-mobile .footer-item{
    color:#aeb2bd!important;
  }
  .footer-mobile .footer-item:hover,
  .footer-mobile .footer-item.active{
    color:#fff!important;
  }
  .footer-mobile .footer-title{
    font-weight:700!important;
  }
}

/* Reduce accidental horizontal overflow without changing layout logic */
html,body{max-width:100%;overflow-x:hidden}
@media(max-width:575.98px){
  .card{border-radius:14px!important}
  .game-item,.game-item-new,.slot-game-item,.casino-game-item{border-radius:12px!important}
}
