/* ==========================================================================
   LATAR SEMUA HALAMAN — POLOS BIRU (TANPA FOTO)                        v6
   Perubahan (permintaan pemilik): foto bgbaru-besar.jpg DILEPAS dari latar
   halaman, diganti satu warna biru rata. Sebabnya: di HP foto itu masih
   terlihat pecah/berkotak pada layar beberapa merek. Warna rata tidak mungkin
   pecah di merek apapun, dan tetap memakai warna biru situs (#0b1030).
   Susunan sekarang: warna dasar #0b1030 + satu lapisan biru rata (tanpa
   gradasi, tanpa gambar) -> hasil akhirnya satu warna biru tetap,
   kurang lebih rgb(25, 46, 106).

   Berkas gambar bgbaru tetap ada di folder images/vendor (tidak dihapus),
   jadi kalau nanti mau dipakai lagi tinggal dibalikkan.
   ========================================================================== */
/* CATATAN LAMA (tidak berlaku lagi, disimpan sebagai catatan):
   LATAR SEMUA HALAMAN — SATU GAMBAR, SATU LAPISAN BIRU
   Gambar : /images/vendor/bgbaru-besar.jpg  (2560x1440)
            Versi lama bgbaru.png hanya 1254x1254 -> dipaksa 'cover' di layar
            1920px jadi diperbesar 1,5x (terlihat zoom & pecah). Versi baru
            dibuat lebar 2560px: di layar biasa gambar justru DIPERKECIL,
            jadi tajam, dan tidak ada lagi kotak-kotak piksel.
   Lapisan: biru tembus pandang di ATAS gambar, di BAWAH kotak isi.
            Dibuat pakai body::before + z-index:-1, jadi tulisan, panel,
            header, dan tombol tetap DI ATAS lapisan itu (tidak tertutup).
   Dipakai oleh: halaman depan, pusat akun, deposit, penarikan, transaksi,
                 qris, ganti sandi, masuk, daftar -> satu sumber, satu rupa.
   ========================================================================== */

/* ---- 1. satu gambar latar untuk seluruh halaman ---- */
html, body, body.body-mobile, .body-mobile {
    background-color: #0f0a20 !important;
    background-image: url('/images/bgbaru.png') !important;
    background-repeat: repeat !important;
    background-attachment: scroll !important;
    background-size: 100% auto !important;
    background-position: center center !important;
    background-blend-mode: normal !important;
}

/* ---- 2. lapisan biru tembus pandang: di atas gambar, di bawah isi ---- */
body::before {
    content: "" !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: auto !important;
    height: auto !important;
    z-index: -1 !important;
    pointer-events: none !important;
    background-color: rgba(52, 104, 220, 0.34) !important;
    background-image: none !important;
}

/* ---- 3. kotak isi tidak boleh menggandakan gambar latar ----
   (dulu beberapa halaman memasang gambar yang SAMA di body DAN di .main-content,
    hasilnya gambar tampak dobel/belang. Sekarang gambarnya cuma satu: di body) */
.main-content, .mb-content, .page-content, .content-wrap, .content, .all-elements,
main, .container, .container.main, .container.no-bottom, .wrapper2, .wrap {
    background-image: none !important;
}
/* kotak isi harus tembus, kalau tidak gambar latar tertutup warna abu/gelap pekat
   (contoh nyata: #content.page-content berwarna rgb(43,43,43) di halaman depan) */
.page-content, #content.page-content, .all-elements, .content, .content-wrap {
    background-color: transparent !important;
}

/* warna gelap milik kartu/panel dibiarkan apa adanya supaya tulisan tetap jelas */
.inner-wrap, .bank-kotak, .kartu, .card {
    background-repeat: no-repeat !important;
}

/* ---- 5. halaman depan & kategori: pembungkus opak dibikin tembus ----
   Dulu div.container.main, div.owl-carousel, main, section, .row dll berwarna
   gelap pekat (mis. rgb(15,10,32)) sehingga gambar latar TIDAK kelihatan
   sama sekali walau sudah dipasang di body. Sekarang dibikin tembus, jadi
   gambar + lapisan biru tampak di sela-sela kartu. */
.container, .container-fluid, .container.main, .container.no-bottom,
main, .main, .wrapper2, .wrap, .row, section, .section,
.owl-carousel, .owl-theme, .owl-stage-outer, .owl-stage, .owl-item {
    background-color: transparent !important;
}

/* ---- 3b. HP/tablet: hilangkan getar-getar saat digulir ----
   Di HP, `background-attachment: fixed` memaksa browser menggambar ulang gambar
   latar tiap frame -> halaman terlihat getar/kedip (kelihatan di daftar, login,
   dll). Di layar kecil: latar dibiarkan menggulir biasa, dan lapisan biru
   dipaksa jadi satu lapisan GPU supaya tidak ikut menggambar ulang. */
@media (max-width: 900px), (hover: none) and (pointer: coarse), (pointer: coarse) {
    html, body, body.body-mobile, .body-mobile {
        background-attachment: scroll !important;
        background-image: url('/images/bgbaru.png') !important;
        background-repeat: repeat !important;
        background-size: 100% auto !important;
    }
    body::before {
        position: fixed !important;
        transform: translateZ(0) !important;
        -webkit-transform: translateZ(0) !important;
        will-change: transform !important;
        -webkit-backface-visibility: hidden !important;
        backface-visibility: hidden !important;
    }
}

/* ---- 4. lebar penuh: halaman pemain memakai seluruh lebar layar ---- */
.w88-layout {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
}
.w88-utama main, .w88-utama .main-content, .w88-utama .inner-wrap,
.w88-utama .container, .w88-utama .mb-content, .w88-utama .content,
.w88-utama .content-wrap, .w88-utama .wrap {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ---- 6. layar sangat besar: tidak ada lagi berkas 4K, warnanya sudah rata ---- */
