.main {
    padding-top: 102px !important;
}
.slick-dots {
    display: none !important;
}
div.quick-footer-navbar a.active {
    background: linear-gradient(to bottom, #f5d800, #d4d000, #f8bc01, #ff8e00) !important;
    border-radius: 26px !important;
}
.quick-footer {
    z-index: 100;
    left: 10px !important;
    right: 10px !important;
    width: 95% !important;
    margin-bottom: 4px !important;
    border: 2px solid #f9b700 !important;
    background-color: #1b2339 !important;
    border-radius: 26px !important;
    height: 60px !important;
    padding-top: 7px !important;
    padding-left: 6px !important;
}
/* eye di popup login */
.modal-content #showPasswordMobile{
  pointer-events: auto !important;
  cursor: pointer !important;

  position: absolute !important;
  right: 12px !important;

  top: 50% !important;
  transform: translateY(-1%) !important;  /* pusat vertikal */
  
  width: 20px !important;
  height: 20px !important;
  line-height: 20px !important;
  text-align: center !important;
  color: #777 !important;
  font-size: 18px !important;
}

/* beri ruang teks agar tidak ketimpa ikon */
.modal-content .toggle-password-wrap input[type="password"],
.modal-content .toggle-password-wrap input[type="text"]{
  padding-right: 44px !important;
}

.has-feedback-left .form-control-feedback {
    top: 40px !important;
    left: 3px !important;
}
button.close {
        background: #2929ff;
    height: 34px;
    padding-top: 3px !important;
    padding-right: 11px !important;
    margin-top: -23px !important;
    margin-right: -8px !important;
    color: #ffffff;
    font-size: 27px;
    border-radius: 10px;
    opacity: 1 !important;
}
.form-group.has-feedback.has-feedback-left {
    padding-bottom: 8px;
}
input#txt_account_number {
    border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;       
}
input#bank_account_name {
        border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;   
}
select#txt_bank_name {
        border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;
}
input#confirm_password {
    border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;        
}
div#phone-prefix-label {
        border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;
    color: #29ff00;
}
marquee.byorka {

    color: #000000!important;
    margin-left: 10px !important;
    margin-right: 10px !important;
    margin-bottom: 6px!important;
    background: linear-gradient(to bottom, #f5d800, #d4d000, #f8bc01, #ff8e00) !important;
    z-index: 3 !important;
    position: relative;
    border-radius: 7px 7px 7px 7px!important;
}

div.game-item div.game-box02 {
    background: none;
    margin: -4px 1px;
    border: 1px solid #f9b700;
    border-radius: 10px;
    overflow: hidden;
    display: grid;
    margin-right: 10px !important;
}
input#txt_email {
    border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;    
}
input#phone {
    border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;    
}
input#txt_email {
    border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;    
}
input#fullname{
        border-radius: 15px !important;
background: #fffbfb;
    box-shadow: inset 0px 0px 8px 0px #00afff;  
}
html, body {
    background-color: #090f1f !important;
}
img.lazyload {
    border-radius: 18px;
}
.game-box {
    background: #090f1f !important;
    border: 1px solid #090f1f !important;
}
li.bank-info {

    visibility: hidden;
}
.svg-chat01 {
    display: inline-block;
    background-image: url(https://superliga168assets.com/images/star.png);
    background-size: 115% 99%;
    margin-top: -2px;
    height: 22px;
    width: 20px;
}
li.navbar-grid-a {
    width: 20% !important;
}
li.navbar-grid-b {
    width: 20% !important;
}
li.navbar-grid-c {
    width: 20% !important;
}
li.navbar-grid-d {
    width: 20% !important;
}
li.navbar-grid-e {
    width: 20% !important;
}
.header {
    background-color: #1b2339 !important;
}
#page-content-wrapper {
    background-color: #090f1f;
}
div.game-item div.game-box01 {
    background: none;
    margin: -4px 1px;
    border: 1px solid #f9b700;
    border-radius: 10px;
    overflow: hidden;
    display: grid;
    margin-left: 10px !important;
}
img.imgtwo {
    
}
.overlay {
    background: #1c1c1c00 !important;

}
div#new-provider-row {
    grid-template-rows: 80px 80px 80px 80px !important;
}
select#destination-bank-deposit {
    border-radius: 10px;
}
textarea#destination-note {
    border-radius: 10px;
}
select#payment {
    border-radius: 10px;
}
input#deposit-amount {
    border-radius: 10px;
}
.game-box-image {
    border: 2px solid yellow !important;
}
.arrow-right {
    display: none !important;
}
.arrow-left {
    display: none !important;
}
.game-box-glow-in-purple {
    height: 74% !important;
}
.game-title-slots {
    padding: 5px !important;
    background: #5e851700 !important;
    color: white !important;
}
.game-box-slots {
        background: #1b2339;
    margin: 4px;
    padding: 5px;
    border-radius: 10px;
}
div#new-provider-row {
    background-color: #1b2339 !important;
}
.item {
    border-radius: 10px;
    background-color: #090f1f !important;
}
.item.active {
    border-radius: 10px;
}
.rasio {
    display: block;
    padding: 15px;
    padding-bottom: 8px;
    padding-left: 8px;
    padding-right: 8px;
    background: #1b2339;
    border-radius: 18px;
    margin: 10px;
    margin-bottom: -5px;
}
img.imgone {
        width: 100%;
    height: auto;
    border-radius: 18px;
}
h3.kelass {
    margin-left: 25px;
    margin-top: -15px;
}
.container.mb-lg {
    display: none;
}
.select-lang {
        background-color: #1b2339 !important;
}
.slider-olx {
    width: 80%;
    margin: 0 auto;
}
.slick-slide img {
    width: 100%;
}
.form-control {
    color: orange !important;
}
.bungkus-jackpot {
    margin-left: auto;
    margin-right: auto;
    width: 90%;
    display: flex;
    align-items: center;
    margin-top: -22px;
    justify-content: center;
    border-radius: 0px;
}
.progresif-jackpot {
    font-size: 22px;
    font-weight: bold;
    padding: 28px;
    border-radius: 5px;
    text-align: center;
    color: Black;
    background: url(https://cdnimg0.wordpress.com/wp-content/uploads/2025/09/progresive-jackpot.gif) center no-repeat;
    background-size: 100%;
    width: 100%;
    margin: 10px auto;
    height: 79px;
}
.progresif-jackpot span {
    color: white;
    margin-right: 15px;
}
.list-menu-mobile {
    width: 100%;
    margin-top: -10px;
    margin-bottom: 10px;
    padding-right: 5px;
    padding-left: 5px;
    padding-bottom: 10px;
background: #071726bf url(https://superliga168assets.com/images/head.jpg) !important;
}
.list-menu-mobile a {
 width: 25% !important;
 padding: 0px 5px;
 display: inline-block;
 margin-top: -7px;
}
.list-menu-mobile a img {
 width: 100%;
margin-top: 20px;
}
a.grid-btn.grid-btn-icon-top {
    border: #ff000000 !important;
}
.game-item-full {
    display: none !important;
}
.footer-mobile.mt-50 {
    display: block;
    visibility: hidden;
    height: 5px !important;
}
.game-image {
    height: auto !important;
}
.msg-wrapper{
    display: none !important;
}
 #slider {
    border-radius: 29px;
    margin-left: 10px !important;
    margin-right: 10px !important;
    margin-top: 5px !important;
    margin-bottom: 5px !important;
 }
.new-ribbon-navbar {
    display: none;
}
.promo-ribbon-navbar {
    display: none;
}
button.login-btn.btn.btn-primary.btn-login-sm.text-uppercase {
    display: none !important;
}
a.login-btn.btn.btn-success.btn-register-sm.text-uppercase {
    display: none !important;
}
.modal-footer {
    padding: 0.6em 2em;
    height: 41px;
    border: 1px solid orange !important;
    outline: none;
    color: rgb(2 255 0) !important;
    background: #1b2339;
    cursor: pointer;
    z-index: 0;
    -webkit-user-select: none;
    touch-action: manipulation;
}










button.btn.btn-primary.btn-lg.btn-block.text-uppercase.mtb-10 {
    padding: 0.6em 2em;
    margin-bottom: 25px !important;
    border: none;
    outline: none;
    color: white !important;
    background: orange !important;
    cursor: pointer;
    position: relative;
    z-index: 0;
    border-radius: 10px;
    -webkit-user-select: none;
    touch-action: manipulation;
}






.modal-body a {
    color: white !important;
}
input#username {
    border-radius: 15px !important;
    background: white;

}
input#password {
    border-radius: 15px !important;
background: white;
}
.modal-content {
    background: #1b2339 !important;
    margin-top: 15%;
    padding-top: 16px;
    padding-bottom: 34px;
    background-size: 184% !important;
    border: 2px solid #324b95 !important;
    border-radius: 12px !important;
}
h4#loginLabel {
    color: orange !important;
    margin-left: 29%;
    margin-right: 20%;
    font-size: 20px;
    font-weight: 900;
    font-family: sans-serif;
    text-shadow: 1px 1px 1px #000000;
}
a.btn.btn-success.btn-lg.btn-block.text-uppercase {
    border-radius: 40px !important;
    background-color: unset;
    box-shadow: none;
}
.modal-footer{
    margin-bottom: 10px !important;
    width: 93%;
    margin: 0;
    position: relative;
    top: 50%;
    left: 50%;
    margin-top: 18px;
    margin-bottom: -3px !important;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -11%);
    border-radius: 11px !important;
}
.modal.show .modal-dialog {

padding-top: 79px;
    padding-left: 30px;
    padding-right: 30px;
}

.owl-carousel .owl-stage-outer {

}

.sidebar-nav{
    margin: auto !important;
    overflow: auto !important;
    background: #090f1f;
    animation: gradient 15s ease infinite !important;
    background-size: 400% 400% !important;
    background-attachment: fixed !important;
}

@keyframes gradient {
    0% {
        background-position: 0% 0%;
    }
    50% {
        background-position: 100% 100%;
    }
    100% {
        background-position: 0% 0%;
    }
}

button.login-btn.btn.btn-primary.btn-login-lg.text-uppercase {
    appearance: none;
    background-color: #0D23B9;
    text-shadow: -1px -1px 0px rgb(0 0 0 / 62%) !important;
    border-radius: 40em;
    border-style: none;
    box-shadow: #0D23B9 0 -12px 6px inset;
    box-sizing: border-box;
    color: #ffffff !important;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -.24px;
    margin: 0;
    outline: none;
    padding: 7px 1.3rem;
    margin-top: 6px;
    quotes: auto;
    text-align: center;
    text-decoration: none;
    transition: all .15s;
    user-select: none;
    -webkit-user-select: none;
    margin-right: 6px !important;
    touch-action: manipulation;
}

button.login-btn.btn.btn-primary.btn-login-lg.text-uppercase:hover {
    background-color: #00ffff;
    box-shadow: #bdebeb 0 -6px 8px inset;
    transform: scale(1.125) !important;
    
}

button.login-btn.btn.btn-primary.btn-login-lg.text-uppercase:active {
  transform: scale(1.025);
}

@media (min-width: 300px) {
  button.login-btn.btn.btn-primary.btn-login-lg.text-uppercase {
    font-size: 0.95rem !important;
    padding: 0.10rem 0.9rem !important;
    border-radius: 25px !important;
    display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;
  }
}

a.login-btn.btn.btn-success.btn-register-lg.text-uppercase {
    appearance: none;
    text-shadow: -1px -1px 0px rgb(0 0 0 / 62%) !important;
    background: linear-gradient(to bottom, #f5d800, #d4d000, #f8bc01, #ff8e00) !important;
    border-radius: 40em;
    border-style: none;
    box-sizing: border-box;
    color: #ffffff !important;
    cursor: pointer;
    display: inline-block;
    font-family: -apple-system,sans-serif;
    font-size: 1.2rem;
    font-weight: 700;
    letter-spacing: -.24px;
    margin: 0;
    margin-right: 10px !important;
    outline: none;
    padding: 7px 1.3rem;
    margin-top: 6px;
    quotes: auto;
    text-align: center;
    text-decoration: none;
    transition: all .15s;
    user-select: none;
    -webkit-user-select: none;
    touch-action: manipulation;
}

a.login-btn.btn.btn-success.btn-register-lg.text-uppercase:hover {
    background-color: #33ff00;
    box-shadow: #aced9b 0 -6px 8px inset;
    transform: scale(1.125) !important;
}

a.login-btn.btn.btn-success.btn-register-lg.text-uppercase:active {
  transform: scale(1.025);
}

@media (min-width: 300px) {
  a.login-btn.btn.btn-success.btn-register-lg.text-uppercase {
    font-size: 0.95rem !important;
    padding: 0.10rem 0.9rem !important;
    border-radius: 25px !important;
    display: inline-flex !important;
  align-items: center !important;
  min-height: 36px !important;

  }
}
.mb-lg {
        margin-bottom: 4em;
    padding: 0;
    background: #090f1f url() no-repeat center !important;
    background-size: 100% 100% !important;
}

.list-menu-mobile {
 width: 100%;
 margin-top: -18px;
}

.list-menu-mobile a {
 width: 20%;
 padding: 0px 5px;
 display: inline-block;
 margin-top: -7px;
}

.list-menu-mobile a img {
 width: 100%;
margin-top: 20px;
}

form table td,
form table span {
  color: #fff !important;
}


a {
transition: all linear 200ms !important;
}


#sosmed-buttons {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 5px 10px;
padding: 10px 6px;
}

#sosmed-buttons button {
color: #fff;
width: 100%;
padding: 6px 0;
border-top: 2px solid #000;
border-left: 2px solid #000;
border-bottom: 2px solid #1d087a;
border-right: 2px solid #1d087a;
border-top-left-radius: 16px;
border-bottom-right-radius: 16px;
}

#sosmed-buttons > a:nth-child(1) > button {
background: linear-gradient(to right, #E4A300, #55555588, #000);
}

#sosmed-buttons > a:nth-child(2) > button {
background: linear-gradient(to right, #0073a8, #55555588, #000);
}

#sosmed-buttons > a:nth-child(3) > button {
background: linear-gradient(to right, #1d087a, #55555588, #000);
}

#sosmed-buttons > a:nth-child(4) > button {
background: linear-gradient(to right, #4fa74f, #55555588, #000);
}


div.game-item div.game-box {
    background: none;
    margin: 1px 5px;
    border: 2px solid #1d087a;
    border-radius: 10px;
    overflow: hidden;
    display: none;
visibility: hidden;
}


div.game-item h5.game-title {
    background-color: black !important;
    border-top: 2px solid #f9b700;
    color: #f9b700;
}

.navbar-grid > li {
/* width: 20% !important; */
}


@keyframes blink {
0%,
100% {
/* Warna kedap kedip tombol bawah kanan */
background-color: #E09700;
}
50% {
background-color: #000
}
}
.kelass {
  color: #fff !important; /* putih */
}

.byorka {
  color: #fff !important; /* putih */
}

.progresif-jackpot {
  color: #fff !important; /* putih */
}
/***************
 * PAGE SCOPES *
 ***************/

/* ============ PUTIH: /deposit & /withdraw ============ */
.page-finance #page-content-wrapper,
.page-finance #page-content-wrapper :where(h1,h2,h3,h4,h5,h6,p,span,small,div,li,label,strong,em,
.note,.help-block,.title,.subtitle,.text,.text-muted,.table td,.table th,.game-title-slots) {
  color: #fff !important;
}

/* Kalahkan rule lama (mis. form table td/span dan marquee.byorka yang sempat #000) */
.page-finance #page-content-wrapper form table td,
.page-finance #page-content-wrapper form table span,
.page-finance #page-content-wrapper marquee.byorka {
  color: #fff !important;
}

/* Link dalam konten tetap putih; tidak mengganggu navbar */
.page-finance #page-content-wrapper a { color: #fff !important; }

/* Input tetap readable di background gelap */
.page-finance #page-content-wrapper :is(input,select,textarea,.form-control) {
  background: #fff !important;
  color: #111 !important;
  border-color: rgba(255,255,255,.2) !important;
}
.page-finance #page-content-wrapper :is(input::placeholder,textarea::placeholder) {
  color: rgba(17,17,17,.55) !important;
}

/* Jangan ubah header/navbar/footer pada halaman ini */
.page-finance :is(.header, .navbar, .navbar *, .quick-footer, .quick-footer *) {
  color: unset !important;
}


/* ============ PUTIH: /promotion ============ */
.page-promo #page-content-wrapper,
.page-promo #page-content-wrapper :where(h1,h2,h3,h4,h5,h6,p,span,small,div,li,label,strong,em,
.note,.help-block,.title,.subtitle,.text,.text-muted,.table td,.table th,.game-title-slots) {
  color: #fff !important;
}
.page-promo #page-content-wrapper marquee.byorka { color: #fff !important; }
.page-promo #page-content-wrapper a { color: #fff !important; }

.page-promo #page-content-wrapper :is(input,select,textarea,.form-control) {
  background: #fff !important;
  color: #111 !important;
}
.page-promo #page-content-wrapper :is(input::placeholder,textarea::placeholder) {
  color: rgba(17,17,17,.55) !important;
}

/* Jangan ganggu header/footer */
.page-promo :is(.header, .navbar, .navbar *, .quick-footer, .quick-footer *) {
  color: unset !important;
}


/* ============ HITAM: /transaction/history ============ */
.page-history #page-content-wrapper,
.page-history #page-content-wrapper :where(h1,h2,h3,h4,h5,h6,p,span,small,div,li,label,strong,em,
.table td,.table th,.text,.note) {
  color: #000 !important;
}

/* Link di history dibiarkan hitam (ganti sesuai brand bila perlu) */
.page-history #page-content-wrapper a { color: #000 !important; }

/* Jangan ganggu header/footer */
.page-history :is(.header, .navbar, .navbar *, .quick-footer, .quick-footer *) {
  color: unset !important;
}
/* ====== HILANGKAN HORIZONTAL SCROLL DI HOMEPAGE ====== */
.page-home, 
.page-home body,
.page-home #page-content-wrapper {
  overflow-x: hidden !important;
}

/* Pastikan tidak ada elemen yang melebar > viewport */
.page-home #page-content-wrapper,
.page-home #page-content-wrapper * {
  box-sizing: border-box;
  max-width: 100vw; /* cegah meluber */
}

/* Kandidat umum penyebab overflow: slider & list menu */
.page-home .slick-list { overflow: hidden !important; }
.page-home .slick-track { transform: translate3d(0,0,0); } /* cegah offset “geser” */
.page-home .slick-slide img { display:block; max-width:100%; height:auto; }

.page-home .list-menu-mobile { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
.page-home .list-menu-mobile a { padding: 0 5px; box-sizing: border-box; }

/* Banner/box gambar biar tidak lebih dari layar */
.page-home .game-box,
.page-home .game-box-image,
.page-home .banner,
.page-home .item,
.page-home img,
.page-home video {
  max-width: 100% !important;
}

/* Jika ada container yang pakai width > 100% atau margin negatif, netralkan */
.page-home .container,
.page-home .row,
.page-home .content,
.page-home .slider-olx {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/***** LOCK HOMEPAGE HORIZONTAL SCROLL (FINAL) *****/
.page-home,
.page-home body,
.page-home #page-content-wrapper{
  width:100% !important;
  max-width:100% !important;
  overflow-x: clip !important;         /* lebih kuat dari hidden */
  overscroll-behavior-x: none !important;
  touch-action: pan-y !important;      /* cegah geser horizontal */
}

/* Semua anak mengikuti lebar viewport */
.page-home *,
.page-home *::before,
.page-home *::after{
  box-sizing: border-box !important;
  max-width:100vw !important;
}

/* Elemen yang sebelumnya sering bikin overflow di situsmu */
.page-home .list-menu-mobile{
  width:100% !important;               /* sebelumnya pernah 123% */
  margin-left:0 !important;
  margin-right:0 !important;
  overflow:hidden !important;
}
.page-home #slider,
.page-home .rasio,
.page-home .bungkus-jackpot,
.page-home .game-item,
.page-home .game-box,
.page-home .game-box01,
.page-home .game-box02,
.page-home .game-box-image,
.page-home .item,
.page-home .banner,
.page-home .content,
.page-home .container,
.page-home .row,
.page-home .slider-olx{
  width:100% !important;
  max-width:100vw !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* Slick/Carousel kadang menggeser track keluar layar */
.page-home .slick-list{ overflow:hidden !important; }
.page-home .slick-track{ transform:translate3d(0,0,0) !important; }

/* Semua gambar jangan meluber */
.page-home img{
  display:block;
  height:auto !important;
  max-width:100% !important;
}

/* Quick footer: jangan melebihi viewport */
.page-home .quick-footer{
  left:0 !important;
  right:0 !important;
  width:auto !important;
  max-width:100vw !important;
  margin-left:auto !important;
  margin-right:auto !important;
  box-sizing:border-box !important;
}
/***** HARD LOCK HOMEPAGE (ANTI SCROLL KIRI-KANAN) *****/
.page-home,
.page-home body,
.page-home #page-content-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  overflow-x: clip !important;              /* lebih tegas dari hidden */
  overscroll-behavior-x: none !important;
  touch-action: pan-y !important;           /* cegah geser horizontal */
}

/* Semua anak tunduk ke lebar viewport */
.page-home *,
.page-home *::before,
.page-home *::after {
  box-sizing: border-box !important;
  max-width: 100vw !important;
}

/* (1) FIX slider yang pakai margin 10px kiri/kanan */
.page-home #slider {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

/* (2) FIX menu gambar: 20% + padding => overflow */
.page-home .list-menu-mobile {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}
.page-home .list-menu-mobile a {
  flex: 0 0 calc(20% - 10px) !important;   /* 5 kolom, kurangi padding */
  box-sizing: border-box !important;
  padding: 0 5px !important;
}
@media (max-width: 480px) {
  /* di layar kecil, biar lebih aman (4 kolom) */
  .page-home .list-menu-mobile a {
    flex: 0 0 calc(25% - 10px) !important;
  }
}

/* (3) FIX quick footer yg bisa meluber */
.page-home .quick-footer {
  position: fixed;         /* asumsi memang fixed bar */
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;  /* jangan pakai width + left/right bersamaan */
  max-width: 100vw !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

/* Carousel guard */
.page-home .slick-list { overflow: hidden !important; }
.page-home .slick-track { transform: translate3d(0,0,0) !important; }

/* Gambar jangan lebih dari layar */
.page-home img { display: block; height: auto !important; max-width: 100% !important; }
/***** HOMEPAGE: ANTI-SCROLL KIRI-KANAN *****/
.page-home,
.page-home body,
.page-home #page-content-wrapper{
  width:100% !important;
  max-width:100% !important;
  overflow-x: clip !important;        /* lebih tegas dari hidden */
  overscroll-behavior-x: none !important;
  touch-action: pan-y !important;     /* cegah geser horizontal */
}

/* Semua anak ikut width viewport & border-box */
.page-home *,
.page-home *::before,
.page-home *::after{
  box-sizing: border-box !important;
  max-width: 100vw !important;
}

/* (1) slider jangan tambah margin samping */
.page-home #slider{
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}

/* (2) list-menu-mobile: ubah ke flex agar padding tidak bikin overflow */
.page-home .list-menu-mobile{
  width: 100% !important;
  margin: 0 !important;
  padding-left: 5px !important;
  padding-right: 5px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0 !important;
}
.page-home .list-menu-mobile a{
  /* 5 kolom: 20% - padding 10px total */
  flex: 0 0 calc(20% - 10px) !important;
  padding: 0 5px !important;
  display: block !important; /* ganti inline-block untuk hindari white-space bug */
}
@media (max-width: 480px){
  /* layar kecil → 4 kolom biar aman */
  .page-home .list-menu-mobile a{ flex: 0 0 calc(25% - 10px) !important; }
}

/* (3) quick-footer selalu pas layar (border tidak bikin overflow) */
.page-home .quick-footer{
  position: fixed;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;            /* jangan kombinasikan dgn width% + left/right */
  max-width: 100vw !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important; /* hitung border ke dalam width */
}

/* Guard untuk slick/carousel */
.page-home .slick-list{ overflow: hidden !important; }
.page-home .slick-track{ transform: translate3d(0,0,0) !important; }

/* Gambar jangan melebihi parent */
.page-home img{ display:block; height:auto !important; max-width:100% !important; }
/* Banner state */
.banner-clickable { cursor: pointer; }
.banner-disabled  { cursor: default; filter: none; }
/* (opsional) efek hover saat aktif */
.banner-clickable:hover .imgone { filter: brightness(1.03); }
/* Sidebar menu selalu putih di semua halaman */
.sidebar-nav,
.sidebar-nav * {
  color: #fff !important;
}
/* === FORCE SIDEBAR/DRAWER SELALU PUTIH (semua halaman) === */
#sidebar-wrapper,
#sidebar-wrapper .sidebar-nav,
#sidebar-wrapper .sidebar-nav li > a,
#sidebar-wrapper .sidebar-nav li > a *,
#sidebar-wrapper .menu-text,
#sidebar-wrapper .nav-text {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important; /* iOS Safari kalau ada text-fill */
}

/* Hover/aktif tetap kontras */
#sidebar-wrapper .sidebar-nav li > a:hover,
#sidebar-wrapper .sidebar-nav li.active > a {
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
}

/* Badge/label kecil tetap terbaca (opsional, sesuaikan) */
#sidebar-wrapper .badge,
#sidebar-wrapper .label {
  color: #111 !important;
  background: #fff !important;
}
/**********************
 *   /register (PUTIH)
 **********************/

/* Semua teks di area konten /register jadi putih */
.page-register #page-content-wrapper,
.page-register #page-content-wrapper :where(
  h1,h2,h3,h4,h5,h6,
  p,span,small,div,li,label,strong,em,
  .note,.help-block,.text,.text-muted,
  .form-group,.control-label,.section-title,
  form table td, form table span
){
  color:#fff !important;
  -webkit-text-fill-color:#fff !important; /* iOS Safari */
}

/* Placeholder/input tetap gelap biar terbaca */
.page-register #page-content-wrapper :is(input,select,textarea,.form-control){
  background:#fff !important;
  color:#111 !important;
  border-color: rgba(255,255,255,.2) !important;
}
.page-register #page-content-wrapper :is(input::placeholder,textarea::placeholder){
  color: rgba(17,17,17,.55) !important;
}

/* Elemen yang sebelumnya kamu paksa hitam—balik jadi putih hanya di /register */
.page-register #page-content-wrapper marquee.byorka{ color:#fff !important; }

/* Jangan mengubah header/footer/sidebar */
.page-register :is(.header,.navbar,.navbar *,.quick-footer,.quick-footer *){
  color:unset !important;
}

/* Jaga-jaga jika konten bukan di #page-content-wrapper */
.page-register :is(.main,.content,.container){
  color:#fff !important;
}
.page-register :is(.main,.content,.container) :is(input,select,textarea,.form-control){
  background:#fff !important; color:#111 !important;
}
/* ========== /register: pastikan teks di dalam kolom berwarna hitam ========== */
.page-register #page-content-wrapper :is(input, select, textarea, .form-control) {
  background: #fff !important;
  color: #111 !important;                 /* warna teks saat mengetik */
  -webkit-text-fill-color: #111 !important;/* iOS/Safari & Chrome autofill */
  caret-color: #111 !important;            /* warna kursor */
  border-color: rgba(255,255,255,.2) !important;
}

/* Placeholder jangan putih */
.page-register #page-content-wrapper :is(input::placeholder, textarea::placeholder) {
  color: rgba(17,17,17,.55) !important;
}

/* Autofill Chrome (kuning) – tetap hitam & background putih */
.page-register #page-content-wrapper input:-webkit-autofill {
  -webkit-text-fill-color: #111 !important;
  box-shadow: 0 0 0 1000px #fff inset !important;
  caret-color: #111 !important;
}

/* Jaga-jaga untuk password field */
.page-register #page-content-wrapper input[type="password"] {
  color: #111 !important;
  -webkit-text-fill-color: #111 !important;
}
/* Kunci anti-geser di homepage */
.page-home, 
.page-home body, 
.page-home #page-content-wrapper {
  overflow-x: clip !important;
  touch-action: pan-y !important;
  max-width: 100% !important;
}

/* Biang overflow: menu gambar */
.page-home .list-menu-mobile {
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  overflow: hidden !important;
}

/* Jaga elemen lain tak meluber */
.page-home #slider,
.page-home .rasio,
.page-home .game-box,
.page-home .item,
.page-home img,
.page-home video {
  max-width: 100vw !important;
}

/* Quick footer jangan lebih lebar dari layar */
.page-home .quick-footer {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100vw !important;
}
/* parent input harus relative */
.modal-content .toggle-password-wrap { 
  position: relative !important;
}

/* ikon eye selalu tepat di tengah vertikal */
.modal-content .toggle-password{
  position: absolute !important;
  right: 10px !important;

  /* trik center: top & bottom 0 lalu margin auto */
  top: 0 !important;
  bottom: 0 !important;
  margin: auto 0 !important;

  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  line-height: 1 !important;
  cursor: pointer !important;
  z-index: 2 !important;
}

/* ukuran ikon */
.modal-content .toggle-password i{
  font-size: 16px !important;
  opacity: .85;
}
.modal-content .toggle-password:hover i{ opacity: 1; }

/* beri ruang di kanan supaya teks tidak nabrak ikon */
.modal-content .toggle-password-wrap input{
  padding-right: 44px !important;
}
/* Eye toggle di kolom password (popup login) */
.modal-content .toggle-password {
  position: absolute;
  right: 12px;                 /* jarak dari kanan */
  top: 50%;                    /* posisikan di tengah */
  transform: translateY(-1%); /* bener2 pas tengah vertikal */
  width: 28px;
  height: 28px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal-content .toggle-password i {
  font-size: 18px;
  color: #777;
}
/* Matikan ikon lama (bukan yang baru) */
#showPasswordMobile,
.modal-content #showPasswordMobile {
  display: none !important;
  pointer-events: none !important;
}
/* parent input harus relative */
.modal-content .toggle-password-wrap {
  position: relative !important;
}

/* ikon eye: benar2 di tengah vertikal */
.modal-content .toggle-password {
  position: absolute !important;
  right: 10px !important;

  /* trik center vertikal yang tidak bergantung transform */
  top: 0 !important;
  bottom: 0 !important;
  margin: auto 0 !important;
  transform: none !important;

  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  cursor: pointer !important;
  z-index: 2 !important;
}

.modal-content .toggle-password i {
  font-size: 18px !important;
  line-height: 1 !important;
  color: #777 !important;
}

/* beri ruang kanan agar teks tidak ketimpa ikon */
.modal-content .toggle-password-wrap input {
  padding-right: 44px !important;
}
/* Warna khusus untuk prefix di halaman register */
.page-register #phone-prefix-label {
  color: #111 !important;      /* teks hitam */
  font-weight: 600 !important; /* biar lebih tegas */
}
/* === /register: pastikan +62 terlihat === */
.page-register #phone-prefix-label,
.page-register #phone-prefix-label::before,
.page-register #phone-prefix-label * {
  color: #111 !important;
  -webkit-text-fill-color: #111 !important; /* kalahkan rule putih sebelumnya */
}

/* opsional: samakan styling dengan input */
.page-register #phone-prefix-label {
  background: #fff !important;
  border-radius: 15px !important;
  box-shadow: inset 0 0 8px 0 #00afff !important;
  font-weight: 600 !important;
  padding: 8px 10px !important; /* jika perlu */
}
/* Pastikan wrapper mengikuti lebar input */
.modal-content .toggle-password-wrap { position: relative !important; width: 100% !important; }

/* Pastikan input full width di dalam wrapper */
.modal-content .toggle-password-wrap input { width: 100% !important; padding-right: 44px !important; }

/* Pastikan tombol berada di atas (tak tertutup elemen lain) */
.modal-content .toggle-password { z-index: 3 !important; }

/* Jika masih ada ikon lama, pastikan tidak tampil supaya tidak dobel */
.modal-content #showPasswordMobile { display: none !important; }
/**********************
/* Warna putih khusus untuk tulisan "Period:" */
.page-bonus-history #page-content-wrapper span {
  color: #fff !important;
  font-weight: 600; /* opsional biar lebih tegas */
}
/* Ubah warna teks tanggal di dropdown jadi putih */
.page-bonus-history #page-content-wrapper select {
  color: #fff !important;           /* teks putih */
  background-color: #1b2339 !important; /* latar sama dengan tema */
  border: 1px solid #2e4d6d !important;
}

/* Saat dropdown terbuka, isi opsinya tetap hitam biar terbaca */
.page-bonus-history #page-content-wrapper select option {
  color: #111 !important;
  background: #fff !important;
}
/**********************
 *   /contact-us (PUTIH)
 **********************/
.page-contact-us #page-content-wrapper,
.page-contact-us #page-content-wrapper :where(
  h1,h2,h3,h4,h5,h6,
  p,span,small,div,li,label,strong,em,
  .note,.help-block,.text,.text-muted,
  .form-group,.control-label,.section-title,
  form table td, form table span
){
  color:#fff !important;
  -webkit-text-fill-color:#fff !important; /* iOS Safari */
}

/* Placeholder & input biar tetap kontras */
.page-contact-us #page-content-wrapper :is(input,select,textarea,.form-control){
  background:#fff !important;
  color:#111 !important;
  border-color: rgba(255,255,255,.2) !important;
}
.page-contact-us #page-content-wrapper :is(input::placeholder,textarea::placeholder){
  color: rgba(17,17,17,.55) !important;
}

/* Jangan ganggu header/footer */
.page-contact-us :is(.header,.navbar,.navbar *,.quick-footer,.quick-footer *){
  color:unset !important;
}
/**********************
 *   /memo (HITAM)
 **********************/
.page-memo #page-content-wrapper,
.page-memo #page-content-wrapper :where(
  h1,h2,h3,h4,h5,h6,
  p,span,small,div,li,label,strong,em,
  .note,.help-block,.text,.text-muted,
  .form-group,.control-label,.section-title,
  form table td, form table span
){
  color:#111 !important;
  -webkit-text-fill-color:#111 !important; /* Safari/iOS */
}

/* input, select, textarea tetap readable */
.page-memo #page-content-wrapper :is(input,select,textarea,.form-control){
  background:#fff !important;
  color:#111 !important;
  border:1px solid #ccc !important;
}
.page-memo #page-content-wrapper :is(input::placeholder,textarea::placeholder){
  color: rgba(17,17,17,.55) !important;
}

/* Jangan ganggu header/footer */
.page-memo :is(.header,.navbar,.navbar *,.quick-footer,.quick-footer *){
  color:unset !important;
}
/**********************
 *  /memo – hanya area tabel
 **********************/
.page-memo #page-content-wrapper .table,
.page-memo #page-content-wrapper .table thead th,
.page-memo #page-content-wrapper .table tbody td,
.page-memo #page-content-wrapper .table tfoot td {
  background: #1b2339 !important;   /* ganti “kolom putih” jadi gelap */
  color: #fff !important;            /* teks putih di kolom */
  border-color: #2e4d6d !important;  /* garis tabel senada */
}

/* Bila ada striping/hover dari theme, samakan warnanya */
.page-memo #page-content-wrapper .table-striped > tbody > tr:nth-child(odd) > td,
.page-memo #page-content-wrapper .table-hover   > tbody > tr:hover > td {
  background: #202b44 !important;
  color: #fff !important;
}

/* Link/aksi di dalam tabel tetap putih */
.page-memo #page-content-wrapper .table a {
  color: #fff !important;
  text-decoration: underline;
}

/* Header/tab (Kotak Masuk, Sent Box, Compose) tetap terbaca */
.page-memo #page-content-wrapper .nav,
.page-memo #page-content-wrapper .nav * {
  color: #fff !important;
}

/* Pastikan navbar/header/footer TIDAK ikut berubah */
.page-memo :is(.header, .navbar, .navbar *, .quick-footer, .quick-footer *) {
  color: unset !important;
}
/**********************
 *  /memo – hanya area tabel
 **********************/
.page-memo #page-content-wrapper .table,
.page-memo #page-content-wrapper .table thead th,
.page-memo #page-content-wrapper .table tbody td,
.page-memo #page-content-wrapper .table tfoot td {
  background: #1b2339 !important;   /* ganti “kolom putih” jadi gelap */
  color: #fff !important;            /* teks putih di kolom */
  border-color: #2e4d6d !important;  /* garis tabel senada */
}

/* Bila ada striping/hover dari theme, samakan warnanya */
.page-memo #page-content-wrapper .table-striped > tbody > tr:nth-child(odd) > td,
.page-memo #page-content-wrapper .table-hover   > tbody > tr:hover > td {
  background: #202b44 !important;
  color: #fff !important;
}

/* Link/aksi di dalam tabel tetap putih */
.page-memo #page-content-wrapper .table a {
  color: #fff !important;
  text-decoration: underline;
}

/* Header/tab (Kotak Masuk, Sent Box, Compose) tetap terbaca */
.page-memo #page-content-wrapper .nav,
.page-memo #page-content-wrapper .nav * {
  color: #fff !important;
}

/* Pastikan navbar/header/footer TIDAK ikut berubah */
.page-memo :is(.header, .navbar, .navbar *, .quick-footer, .quick-footer *) {
  color: unset !important;
}
/* ===== /memo: hanya style isi tabel ===== */
.page-memo #page-content-wrapper .table,
.page-memo #page-content-wrapper .table * {
  color: #fff !important;
}

.page-memo #page-content-wrapper
  :is(.content-body, .panel-body, .container, .row) .table
  :is(th, td) {
  background: #111a2b !important;      /* gelap, satu tema */
  border-color: #2e4d6d !important;
}

/* striping/hover (kalau tabelnya pakai .table-striped / .table-hover) */
.page-memo #page-content-wrapper .table-striped > tbody > tr:nth-child(odd) > td {
  background: #17233a !important;
}
.page-memo #page-content-wrapper .table-hover > tbody > tr:hover > td {
  background: #1f2c46 !important;
}

/* link seperti [Baca] tetap kontras */
.page-memo #page-content-wrapper table a {
  color: #fff !important;
  text-decoration: underline;
}

/* tab "Kotak Masuk / Sent Box / Compose" tetap putih */
.page-memo #page-content-wrapper .nav,
.page-memo #page-content-wrapper .nav * {
  color: #fff !important;
}

/* jangan mengubah header / saldo / quick-footer */
.page-memo :is(.header, .navbar, .navbar *, .quick-footer, .quick-footer *) {
  color: unset !important;
}
/* Jangan ubah warna user info di /memo */
.page-memo .user-info,
.page-memo .user-info * {
  color: #fff !important;  /* balik ke putih */
  -webkit-text-fill-color: #fff !important;
}
/* Jangan ubah warna info user di halaman /memo */
.page-memo .user-info,
.page-memo .user-info *,
.page-memo .user-welcome,
.page-memo .user-welcome *,
.page-memo .user-balance,
.page-memo .user-balance * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
/* Paksa warna putih untuk salam user di memo */
.page-memo .user-welcome,
.page-memo .user-welcome span,
.page-memo .user-welcome * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
/* ===== /memo: paksa teks putih di header kanan (Hi, user + saldo) ===== */
.page-memo .header .user-info,
.page-memo .header .user-info *,
.page-memo .header .user-welcome,
.page-memo .header .user-welcome *,
.page-memo .header .user-balance,
.page-memo .header .user-balance * {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* ===== /memo: paksa teks putih di navbar bawah ===== */
.page-memo .quick-footer,
.page-memo .quick-footer *,
.page-memo .quick-footer-navbar,
.page-memo .quick-footer-navbar *,
.page-memo .navbar-grid a,
.page-memo .navbar-grid a *,
.page-memo .navbar-grid li * {
  color:#fff !important;
  fill:#fff !important;          /* untuk svg/icon yang mengikuti fill */
}

/* jaga-jaga kalau ada state link yang override */
.page-memo .quick-footer a:link,
.page-memo .quick-footer a:visited,
.page-memo .quick-footer a:hover,
.page-memo .quick-footer a:active {
  color:#fff !important;
}
/* ===== /memo: paksa warna putih untuk info user di kanan header ===== */
.page-memo .header .user-info,
.page-memo .header .user-info *,
.page-memo .header .user-welcome,
.page-memo .header .user-welcome *,
.page-memo .header .user-balance,
.page-memo .header .user-balance *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  opacity:1 !important;
}

/* ===== /memo: paksa warna putih untuk teks & ikon navbar bawah ===== */
.page-memo .quick-footer,
.page-memo .quick-footer *,
.page-memo .quick-footer-navbar,
.page-memo .quick-footer-navbar *,
.page-memo .navbar-grid a,
.page-memo .navbar-grid a *,
.page-memo .grid-btn,
.page-memo .grid-btn *{
  color:#fff !important;
  fill:#fff !important; /* untuk ikon SVG */
}

/* Jika “Bank info” perlu tampil, ini menonaktifkan rule global yang menyembunyikannya */
.page-memo li.bank-info{
  visibility: visible !important;
}
/* ===== /memo: paksa putih untuk info user di kanan header ===== */
html.page-memo .user-info,
html.page-memo .user-info *,
html.page-memo .user-welcome,
html.page-memo .user-welcome *,
html.page-memo .user-balance,
html.page-memo .user-balance *{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  opacity:1 !important;
}

/* ===== /memo: paksa putih untuk teks & ikon navbar bawah ===== */
html.page-memo .quick-footer,
html.page-memo .quick-footer *,
html.page-memo .quick-footer-navbar,
html.page-memo .quick-footer-navbar *,
html.page-memo .navbar-grid a,
html.page-memo .navbar-grid a *,
html.page-memo .grid-btn,
html.page-memo .grid-btn *{
  color:#fff !important;
  fill:#fff !important; /* untuk ikon SVG */
}

/* Opsional: kalau mau tampilkan Bank Info di semua halaman */
li.bank-info { visibility: visible !important; }
/* === FIX /memo: paksa teks putih di header kanan (user info, welcome, saldo) === */
html.page-memo body .header .user-info,
html.page-memo body .header .user-info *,
html.page-memo body .header .user-welcome,
html.page-memo body .header .user-welcome *,
html.page-memo body .header .user-balance,
html.page-memo body .header .user-balance * {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  opacity: 1 !important;
}

/* === FIX /memo: paksa teks putih di quick-footer & navbar bawah === */
html.page-memo body .quick-footer,
html.page-memo body .quick-footer *,
html.page-memo body .quick-footer-navbar,
html.page-memo body .quick-footer-navbar *,
html.page-memo body .navbar-grid a,
html.page-memo body .navbar-grid a *,
html.page-memo body .navbar-grid li,
html.page-memo body .navbar-grid li * {
  color: #fff !important;
  fill: #fff !important;  /* untuk icon SVG */
}
/* Lottery horizontal */
.page-lottery #new-provider-row {
  display: flex !important;
  flex-wrap: wrap !important;     /* biar turun ke baris baru kalau penuh */
  justify-content: center !important; /* bisa diganti space-between/space-around */
  gap: 10px;                      /* jarak antar icon */
}

/* Biar item di dalamnya tidak full width */
.page-lottery #new-provider-row > div {
  flex: 0 0 auto !important;      /* biar sesuai ukuran konten, tidak stretch */
  display: inline-block !important;
}
.page-lottery #new-provider-row,
.page-arcade #new-provider-row {
  display:flex !important;
  flex-wrap:wrap !important;
  gap:12px !important;
  justify-content:flex-start !important;
}
.page-lottery #new-provider-row > *,
.page-arcade #new-provider-row > * {
  flex:0 0 auto !important;
  display:inline-flex !important;
  align-items:center !important;
}
/* ===== Lottery & Arcade: susun ikon horizontal ===== */
.page-lottery  #new-provider-row,
.page-arcade   #new-provider-row{
  display:flex !important;           /* kalahkan grid bawaan */
  flex-wrap:wrap !important;         /* turun ke baris berikutnya */
  gap:12px !important;
  align-items:center !important;
  justify-content:flex-start !important;

  /* netralkan properti grid yang memaksa vertikal */
  grid-template-rows:unset !important;
  grid-auto-flow:unset !important;
}

/* Lebar tiap tile (3 kolom per baris, silakan ubah) */
.page-lottery  #new-provider-row > *,
.page-arcade   #new-provider-row > *{
  flex:0 0 calc(33.333% - 12px) !important;
  max-width:calc(33.333% - 12px) !important;
}

/*.floating-left {*/
/*    left: 10px !important;*/
/*    bottom: 55px !important;*/
/*    z-index: 55 !important;*/
/*}*/

.evenrow {
    background: #090f1f !important;
}

.oddrow {
    background: #090f1f !important;
}

body {
    color: #fff !important;
}