/* ============================================================================
   LeraPay UI v3 — lapisan tampilan bersama (presentation only).
   Menyeragamkan SEMUA halaman member dengan Beranda baru:
   Produk, Riwayat, Detail/Struk, Akun, Bantuan, Login, Daftar, Instal, Berita.
   Tidak mengubah logika transaksi apa pun.
   ========================================================================== */

:root{
  /* palet baru (sama dengan Beranda) */
  --lp-navy:#061f4a;--lp-navy2:#0b3f99;--lp-blue:#1471f5;--lp-blue2:#0d57d0;--lp-cyan:#11c8e8;
  --lp-bg:#eef2f8;--lp-card:#fff;--lp-text:#0e2342;--lp-muted:#75849a;
  --lp-line:#e7edf5;--lp-soft:#eff5ff;--lp-success:#0f9d58;--lp-danger:#dc2626;--lp-warn:#d58a00;
  --lp-grad:linear-gradient(150deg,#061f4a 0%,#0b3f99 58%,#1471f5 100%);
  --lp-shadow:0 8px 22px rgba(13,42,82,.06);
  /* alias supaya aturan lama yang memakai --rm-* ikut warna baru */
  --rm-navy:#061f4a;--rm-navy2:#0b3f99;--rm-blue:#1471f5;--rm-cyan:#11c8e8;
  --rm-bg:#eef2f8;--rm-card:#fff;--rm-text:#0e2342;--rm-muted:#75849a;
  --rm-line:#e7edf5;--rm-soft:#eff5ff;--rm-green:#0f9d58;--rm-amber:#d58a00;--rm-red:#dc2626;
}

/* ---------- dasar ---------- */
html{background:var(--lp-bg)!important;color-scheme:light;-webkit-text-size-adjust:100%}
body{font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',Arial,sans-serif!important;
  background:var(--lp-bg)!important;color:var(--lp-text)!important;margin:0!important;min-height:100dvh;
  -webkit-font-smoothing:antialiased;letter-spacing:-.01em}
button,input,select,textarea{font-family:inherit!important}
a{color:var(--lp-blue);-webkit-tap-highlight-color:transparent}
body.lp-ui-v2{visibility:visible!important}
.mwrap{width:100%!important;max-width:520px!important;margin:0 auto!important;
  padding:0 16px calc(96px + env(safe-area-inset-bottom))!important;box-sizing:border-box!important}
.wrap{max-width:760px!important;margin:0 auto!important}

/* ---------- header kecil (logo + ID/EN) ---------- */
.lp-shell-top{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 0 10px;max-width:520px;margin:0 auto;
  position:fixed;top:0;left:0;right:0;z-index:140;background:#fff;
  max-width:none;border-bottom:1px solid var(--lp-line);
  padding-left:max(16px,calc((100% - 520px)/2));
  padding-right:max(16px,calc((100% - 520px)/2));
  box-shadow:0 6px 16px -12px rgba(13,42,82,.55)}
/* bar atas legacy (.hero) juga dikunci lewat aturan .hero di bawah */
.lp-shell-brand{display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--lp-text)!important}
.lp-shell-mark{width:38px;height:38px;background:transparent;border:0;box-shadow:none;display:grid;place-items:center;flex:none;overflow:visible}
.lp-shell-mark img{width:100%;height:100%;object-fit:contain;display:block}
.lp-shell-name{font-size:18px;font-weight:800;letter-spacing:-.4px;white-space:nowrap}
.lp3-wordmark{display:inline-flex;align-items:baseline;letter-spacing:-.4px;font-weight:800}
.lp3-wordmark .mk-1{color:#0b2a5b}
.lp3-wordmark .mk-2{color:#0b2a5b}
.lp-shell-act{display:flex;align-items:center;gap:8px;flex:none}
.lp-shell-ic{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#f2f6fc;border:1px solid var(--lp-line);color:#173c77;position:relative;text-decoration:none}
.lp-shell-ic svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.lp-shell-ic i{position:absolute;right:8px;top:8px;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:#ff3b54}
.lp-lang{display:flex;align-items:center;background:#fff;border:1px solid var(--lp-line);border-radius:999px;padding:3px;box-shadow:var(--lp-shadow)}
.lp-lang button{border:0;background:transparent;color:var(--lp-muted);padding:7px 11px;border-radius:999px;font-weight:700;font-size:12px}
.lp-lang button[aria-current=true]{background:var(--lp-navy2);color:#fff}

/* ---------- kartu / form umum ---------- */
.mhero{display:none!important}
/* logo ganda: header sudah menampilkan logo + nama toko */
.rm-auth-logo{display:none!important}
.mcard,.card:not(.hero),.news-card,.news-empty,.refcard,.iasec,.rvx-card,.rvx-filter,
.pl-card,.qorder,.product,.promocard,.struk{
  background:#fff!important;border:1px solid var(--lp-line)!important;
  border-radius:18px!important;box-shadow:var(--lp-shadow)!important;color:var(--lp-text)!important}
.mcard{padding:16px!important;margin:0 0 12px!important}
.mtitle{font-size:15.5px!important;font-weight:800!important;letter-spacing:-.2px;margin:0 0 10px!important;display:block}
.mrow{display:flex!important;justify-content:space-between!important;align-items:flex-start!important;gap:14px;
  padding:11px 0!important;border-bottom:1px solid #eef3f8!important;font-size:12.5px}
.mrow:last-child{border-bottom:0!important}
.mrow b{text-align:right;font-weight:700;overflow-wrap:anywhere}
.mlabel{display:block!important;font-size:11.5px!important;font-weight:700!important;margin:14px 0 7px!important}
.mcard .mlabel:first-of-type{margin-top:2px!important}
.minput{display:block!important;width:100%!important;margin:0 0 2px!important}
.mbtn{display:block!important;width:100%!important;margin-top:16px!important}
.merr,.mok{display:block;margin:0 0 12px!important}
.mlabel,.news-title,.news-text{color:var(--lp-text)!important}
.mmut,.news-date,.news-empty p{color:var(--lp-muted)!important}
.minput,.input,select,textarea,.qinput,.qpick,.pl-search,.pl-sel{
  background:#fff!important;border:1px solid #cfdae8!important;border-radius:12px!important;
  color:var(--lp-text)!important;min-height:46px;padding:0 13px;font-size:13.5px}
textarea{padding:11px 13px;min-height:96px}
.minput:focus,.input:focus,select:focus,textarea:focus,.pl-search:focus{
  outline:none;border-color:var(--lp-blue)!important;box-shadow:0 0 0 3px rgba(20,113,245,.09)}
.mbtn,.btn,.lgn-btn,.rvx-btn,.rvx-go,.pbtn{
  background:var(--lp-grad)!important;color:#fff!important;border:0!important;
  border-radius:13px!important;min-height:48px;font-weight:800!important;font-size:13px}
.mlink,.news-link{color:var(--lp-blue)!important;font-weight:700}
.merr{background:#fff1f1!important;border:1px solid #ffd5d5!important;color:#b42318!important;
  border-radius:12px!important;padding:11px 13px!important;font-size:12px!important;font-weight:600}

/* ---------- navigasi bawah (dasar lengkap, tidak lagi bergantung file lain) ---------- */
.botnav-spacer{display:block!important;height:calc(84px + env(safe-area-inset-bottom))!important}
.botnav{
  position:fixed!important;z-index:120!important;bottom:0!important;left:50%!important;right:auto!important;
  transform:translateX(-50%)!important;width:100%!important;max-width:520px!important;
  display:grid!important;grid-template-columns:repeat(5,1fr)!important;align-items:end!important;
  padding:8px 8px calc(10px + env(safe-area-inset-bottom))!important;
  background:rgba(255,255,255,.97)!important;border-top:1px solid var(--lp-line)!important;
  box-shadow:0 -6px 20px rgba(16,35,66,.06)!important;backdrop-filter:blur(14px)}
.botnav a{display:flex!important;flex-direction:column!important;align-items:center!important;
  justify-content:center!important;gap:4px!important;min-height:44px!important;text-decoration:none!important;
  color:#8594a9!important;font-size:9.5px!important;font-weight:700!important;line-height:1.15!important}
.botnav a svg{width:21px!important;height:21px!important;fill:none!important;stroke:currentColor!important;
  stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important;display:block!important}
.botnav a.on{color:var(--lp-blue)!important}
.botnav a.on svg{stroke-width:2.2!important}
.botnav a.rm-center{position:relative!important;justify-content:center!important;gap:4px!important;
  min-height:44px!important;color:var(--lp-blue)!important;padding-bottom:0!important}
/* ikon Bayar melayang (absolute), jadi disiapkan kotak setinggi ikon lain
   supaya tulisan Bayar sejajar dengan label menu yang lain */
.botnav a.rm-center::before{content:''!important;display:block!important;width:21px!important;height:21px!important;flex:none!important}
.botnav a.rm-center .rm-center-icon{position:absolute!important;top:-36px!important;left:50%!important;
  transform:translateX(-50%)!important;width:52px;height:52px;border-radius:50%;
  background:linear-gradient(145deg,#1471f5,#0b3f99);display:grid;place-items:center;
  box-shadow:0 8px 18px rgba(20,113,245,.4);border:3px solid #fff}
.botnav a.rm-center .rm-center-icon svg{width:23px!important;height:23px!important;stroke:#fff!important}
.botnav a.rm-center span:not(.rm-center-icon){margin-top:0!important}

/* ---------- login / daftar ---------- */
body.lp-login,body.lp-register{background:var(--lp-bg)!important}
body.lp-login .mwrap,body.lp-register .mwrap{max-width:440px!important;padding-bottom:32px!important}
.rm-auth{padding:4px 0 28px}
.rm-auth-hero{text-align:left;margin:10px 0 22px}
.rm-auth-logo{display:flex;align-items:center;gap:10px;margin-bottom:24px}
.rm-auth-logo img{width:36px;height:36px;border-radius:11px}
.rm-auth-logo b{font-size:20px;font-weight:800;color:var(--lp-blue);letter-spacing:-.4px}
.rm-auth h1,.lgn-title{font-size:24px!important;color:var(--lp-text)!important;margin:0 0 8px!important;font-weight:800!important;text-align:left!important;letter-spacing:-.5px}
.rm-auth p,.lgn-sub{color:var(--lp-muted)!important;font-size:12.5px!important;line-height:1.6!important;margin:0!important}
.rm-auth-card{background:#fff;border:1px solid var(--lp-line);border-radius:20px;padding:18px;box-shadow:var(--lp-shadow)}
.rm-field{margin:0 0 15px;position:relative}
.rm-label{font-size:11.5px;font-weight:700;color:var(--lp-text);margin:0 0 7px;display:block}
.rm-input{width:100%;min-height:48px;padding:0 13px;border:1px solid #cfdae8;border-radius:12px;
  background:#fff;color:var(--lp-text);font-size:13.5px;font-weight:500;box-sizing:border-box}
.rm-input:focus{outline:none;border-color:var(--lp-blue);box-shadow:0 0 0 3px rgba(20,113,245,.09)}
.rm-primary{width:100%;min-height:48px;border:0;border-radius:13px;background:var(--lp-grad);
  color:#fff;font-size:13px;font-weight:800;letter-spacing:.01em}
.rm-secondary{display:block;text-align:center;min-height:46px;line-height:44px;border:1px solid #cfdae8;
  border-radius:13px;color:var(--lp-blue)!important;font-size:12.5px;font-weight:800;text-decoration:none;margin-top:10px;background:#fff}
.rm-auth-links{display:flex;justify-content:space-between;align-items:center;margin:10px 1px 16px;font-size:11.5px}
.rm-auth-links a{color:var(--lp-blue);font-weight:700;text-decoration:none}
.rm-auth-pwa{display:flex;align-items:center;gap:11px;margin-top:15px;padding:12px;border:1px solid var(--lp-line);
  border-radius:14px;text-decoration:none;color:var(--lp-text)!important;background:#f8fbff}
.rm-auth-pwa i{width:38px;height:38px;border-radius:12px;background:var(--lp-soft);display:grid;place-items:center;color:var(--lp-blue);font-style:normal;font-size:18px;flex:none}
.rm-auth-pwa b{font-size:11.5px}
.rm-auth-pwa small{display:block;color:var(--lp-muted);font-size:9.5px;margin-top:2px}
.rm-trust{margin-top:18px;padding:13px 4px 2px;border-top:1px solid #edf2f8;color:var(--lp-muted);font-size:10px;text-align:center;line-height:1.6}
/* daftar.php memakai kelas lama */
body.lp-register .mcard{padding:18px!important}
.lgn-in{background:#fff!important;border:1px solid #cfdae8!important;border-radius:12px!important;padding:13px 14px!important;color:var(--lp-text)!important}
.lgn-lupa,.lgn-daftar{color:var(--lp-blue)!important}
.lgn-btn{width:100%!important;border-radius:13px!important;padding:13px!important}
.lgn-daftar{display:block;text-align:center;border:1px solid #cfdae8;border-radius:13px;padding:13px!important}
.lgn-copy{color:var(--lp-muted)!important;font-size:12px!important;margin:28px 0 20px!important}

/* ---------- riwayat ---------- */
.rvx-top{position:relative!important;top:auto!important;margin:0!important}
.rvx-bar{margin:0!important;border-radius:20px!important;background:var(--lp-grad)!important;color:#fff!important;
  padding:18px!important;box-shadow:0 12px 26px rgba(11,63,153,.18)!important}
.rvx-bar h1{font-size:18px!important;font-weight:800}
.rvx-tabs{margin:12px 0 16px!important;border:1px solid var(--lp-line)!important;border-radius:15px!important;
  overflow:hidden!important;display:grid!important;grid-template-columns:1fr 1fr!important;background:#fff!important}
.rvx-tabs a{padding:12px!important;text-align:center!important;font-size:11.5px!important;font-weight:700!important;
  border-bottom:0!important;background:#fff!important;color:#8594a9!important}
.rvx-tabs a.on{background:var(--lp-soft)!important;color:var(--lp-blue)!important}
.rvx-body{padding:2px 0!important}
.rvx-h2{font-size:16px!important;color:var(--lp-text)!important;font-weight:800}
.rvx-p{color:var(--lp-muted)!important}
.rvx-fbtn{border:1px solid var(--lp-line)!important;border-radius:13px!important;background:#fff!important;color:var(--lp-text)!important;box-shadow:none!important}
.rvx-fbtn svg{stroke:var(--lp-blue)!important}
.rvx-card{margin-bottom:10px!important;padding:14px!important}
.rvx-badge{border-radius:999px!important;font-size:9.5px!important;font-weight:800!important;padding:4px 9px!important}
.rvx-price{color:var(--lp-text)!important;font-size:15px!important;font-weight:800!important}
.rvx-date{color:var(--lp-muted)!important;font-size:10px!important}
.rvx-receipt{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-radius:11px!important;font-weight:800!important}
.rvx-ov{background:rgba(8,31,58,.48)!important}
.rvx-modal{background:#fff!important;border-radius:24px 24px 0 0!important}
.rvx-ch.on{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-color:var(--lp-blue)!important}
.rvx-go,.rvx-btn{border-radius:13px!important}
.rvx-empty{color:var(--lp-muted)!important}

/* ---------- detail transaksi / struk ---------- */
.struk{overflow:hidden!important;padding:0!important;margin:14px 0!important}
.rm-receipt-head{background:var(--lp-grad);color:#fff;border-radius:18px 18px 0 0;padding:24px 18px;text-align:center}
.rm-receipt-check{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;margin:0 auto 12px;
  border:2px solid rgba(255,255,255,.55);background:rgba(255,255,255,.14);font-size:24px;font-weight:800}
.rm-receipt-title{font-size:17px;font-weight:800}
.rm-receipt-id{font-size:10.5px;color:#d5e7fb;margin-top:6px;word-break:break-all;line-height:1.6}
.rm-receipt-body{padding:6px 16px 16px}
.srow{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:12px 0;border-bottom:1px solid #eef3f8;font-size:12px}
.srow span{color:var(--lp-muted)}
.srow b{text-align:right;font-weight:700;word-break:break-word}
.stot{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 0 4px;font-size:13.5px;font-weight:800}
.stot span:last-child{color:var(--lp-blue);font-size:16px}
.sftr{margin-top:12px;padding:11px 12px;background:var(--lp-soft);border-radius:12px;color:#40597a;font-size:10.5px;line-height:1.6;text-align:center}
.prtbar{margin:12px 0 4px}
.pbtn{width:100%;border:0;cursor:pointer}
@media print{.botnav,.botnav-spacer,.prtbar,.lp-shell-top{display:none!important}.struk{box-shadow:none!important;border:0!important}}

/* ---------- akun ---------- */
.iatop{position:relative!important;top:auto!important;margin:0!important}
.iabar{border-radius:20px 20px 0 0!important;background:var(--lp-grad)!important;color:#fff!important;padding:17px!important;box-shadow:none!important}
.iabar b{font-size:17px!important;font-weight:800}
.iasub{background:#fff!important;color:var(--lp-text)!important;border:1px solid var(--lp-line)!important;border-top:0!important;border-radius:0 0 20px 20px!important}
.refcard{margin:13px 0!important;border-radius:18px!important;background:linear-gradient(150deg,#f6faff,#eff5ff)!important}
.refcard .k small{color:var(--lp-blue)!important}
.refcard .k b{color:var(--lp-text)!important}
.refcard button{background:var(--lp-grad)!important;color:#fff!important;border:0!important;border-radius:11px!important}
.iatab{margin:13px 0!important;border:1px solid var(--lp-line)!important;border-radius:18px!important;overflow:hidden!important;background:#fff!important}
.iarow,.iarow:nth-child(even){background:#fff!important;border-bottom:1px solid #eef3f8!important;padding:13px 15px!important}
.iak{font-size:11.5px!important;color:var(--lp-muted)!important}
.iav{font-size:11.5px!important;font-weight:700}
.iav.u{color:var(--lp-blue)!important}
.iasec{border-radius:18px!important}
.iaico{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-radius:11px!important}
.rm-account-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}
.rm-account-actions a{display:flex;align-items:center;gap:9px;padding:13px;border:1px solid var(--lp-line);
  border-radius:15px;background:#fff;text-decoration:none;color:var(--lp-text)!important;font-size:11px;font-weight:700;box-shadow:var(--lp-shadow)}
.rm-account-actions i{width:34px;height:34px;border-radius:11px;background:var(--lp-soft);display:grid;place-items:center;color:var(--lp-blue);font-style:normal;flex:none}
.tagadm{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-radius:999px!important}

/* ---------- halaman akun ---------- */
.ak-top{display:flex;align-items:center;gap:13px;background:var(--lp-grad);color:#fff;border-radius:20px;padding:17px;margin:2px 0 12px;box-shadow:0 12px 26px rgba(11,63,153,.18)}
.ak-ava{width:52px;height:52px;border-radius:50%;flex:none;display:grid;place-items:center;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);font-size:17px;font-weight:800;letter-spacing:.5px}
.ak-id{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.ak-id b{font-size:15px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ak-id small{font-size:11px;color:rgba(255,255,255,.82)}
.ak-id .ak-mid{font-size:9.5px;color:rgba(255,255,255,.62);letter-spacing:.02em;overflow-wrap:anywhere}
.ak-qr{flex:none;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3);display:grid;place-items:center;color:#fff;padding:0}
.ak-qr svg{width:21px;height:21px;stroke:currentColor;fill:none;stroke-width:1.8}
.ak-saldo{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--lp-line);border-radius:17px;padding:14px 15px;margin-bottom:12px;box-shadow:var(--lp-shadow)}
.ak-saldo small{display:block;font-size:10.5px;color:var(--lp-muted);font-weight:700;margin-bottom:3px}
.ak-saldo b{font-size:19px;font-weight:800;letter-spacing:-.4px}
.ak-saldo a{flex:none;background:var(--lp-grad);color:#fff!important;font-size:11.5px;font-weight:800;padding:11px 14px;border-radius:12px;text-decoration:none}
.ak-h{margin:18px 2px 9px;font-size:12px;font-weight:800;color:var(--lp-muted);letter-spacing:.03em;text-transform:uppercase}
/* ACC-7 — halaman yang DIMULAI dengan judul bagian (tg.php) menumpuk
   dua jarak: 14px jeda kotak gulir + 18px margin .ak-h = 32px, di luar
   ambang 10-22px yang dipakai seluruh aplikasi. Kotak gulirnya sudah
   memberi jarak, jadi judul pertama tidak menambah lagi.
   Dipakai lewat kelas eksplisit .ak-h1, BUKAN :first-of-type — bar atas
   juga sebuah <div>, jadi :first-of-type memilih bar itu dan aturannya
   tidak pernah kena sasaran. */
.ak-h.ak-h1{margin-top:0}
.ak-lang{cursor:default}
.ak-lang .lp-lang{margin-left:auto;flex:none;box-shadow:none}
.ak-lang .lp-lang button{padding:6px 11px;font-size:11px;font-weight:800}
.ak-out b{color:#c0392b!important}
.ak-out .rm-help-icon{background:#fdecec!important;color:#dc2626!important}
.refcard{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px;padding:14px 15px!important;margin:0 0 12px!important}
.refcard .k{display:flex;flex-direction:column;gap:2px;min-width:0}
.refcard .k small{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.refcard .k b{font-size:19px;font-weight:800;letter-spacing:1px}
.refcard button{flex:none;border:0;padding:11px 15px;border-radius:12px;font-size:11.5px;font-weight:800;cursor:pointer}
.iatab{margin:0 0 12px!important;background:#fff;border:1px solid var(--lp-line);border-radius:18px;overflow:hidden;box-shadow:var(--lp-shadow)}
.iarow{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:13px 15px;background:#fff;border-bottom:1px solid #eef3f8}
.iarow:last-child{border-bottom:0}
.iak{color:var(--lp-muted);font-size:12px;flex:0 0 auto}
.iav{font-weight:700;color:var(--lp-text);font-size:12px;text-align:right;min-width:0;overflow-wrap:anywhere}
.iav.u{color:var(--lp-blue)}
.tagadm{display:inline-block;font-size:9px;font-weight:800;color:var(--lp-blue);background:var(--lp-soft);border-radius:6px;padding:2px 7px;margin-left:6px;vertical-align:1px;letter-spacing:.03em}

/* ---------- bantuan ---------- */
.rm-help-head{background:var(--lp-grad);border-radius:20px;padding:19px;color:#fff;margin-bottom:14px;box-shadow:0 12px 26px rgba(11,63,153,.16)}
.rm-help-head h1{margin:0;font-size:19px;font-weight:800}
.rm-help-head p{margin:6px 0 0;color:#d3e4f7;font-size:11px;line-height:1.6}
.rm-help-search{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--lp-line);
  border-radius:14px;padding:12px 13px;margin-bottom:12px;color:var(--lp-muted);font-size:11.5px}
.rm-help-list{background:#fff;border:1px solid var(--lp-line);border-radius:18px;overflow:hidden;margin-bottom:12px;box-shadow:var(--lp-shadow)}
.rm-help-item{display:flex;align-items:center;gap:11px;padding:13px 14px;border-bottom:1px solid #eef3f8;text-decoration:none;color:var(--lp-text)!important}
.rm-help-item:last-child{border-bottom:0}
.rm-help-icon{width:38px;height:38px;border-radius:12px;background:var(--lp-soft);display:grid;place-items:center;color:var(--lp-blue);font-weight:800;flex:none}
.rm-help-copy{flex:1;min-width:0}
.rm-help-copy b{display:block;font-size:11.5px}
.rm-help-copy small{display:block;font-size:9.5px;color:var(--lp-muted);margin-top:2px;line-height:1.35}
.rm-help-arrow{color:#9aabba;font-size:19px}

/* ACC-5 — BARIS DAFTAR YANG BISA DIBUKA.
   "Ubah Nama" dulu berupa kartu formulir sendiri, sehingga satu
   halaman Profil punya dua bahasa visual: kartu untuk ubah nama,
   baris daftar untuk keamanan. Sekarang ia baris daftar yang sama,
   formulirnya terbuka di tempat. Tanpa JavaScript: <details>. */
.rm-det{border-bottom:1px solid #eef3f8}
.rm-det:last-child{border-bottom:0}
.rm-det>summary{list-style:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
.rm-det>summary::-webkit-details-marker{display:none}
.rm-det>summary::marker{content:''}
.rm-det>summary.rm-help-item{border-bottom:0}
.rm-det-ar{transition:transform .18s ease;display:inline-block}
.rm-det[open] .rm-det-ar{transform:rotate(90deg)}
.rm-det-isi{padding:2px 14px 14px}
.rm-det-isi .mlabel{margin-top:2px}
.rm-det-isi .mbtn{margin-top:10px}
.rm-help-cta{background:var(--lp-grad);border-radius:18px;padding:16px;color:#fff;margin-top:12px}
.rm-help-cta b{font-size:12.5px}
.rm-help-cta p{font-size:10px;color:#cfe1f5;margin:4px 0 11px}
.rm-help-cta a{display:inline-block;background:#fff;color:var(--lp-navy2)!important;border-radius:10px;padding:9px 12px;text-decoration:none;font-size:10px;font-weight:800}

/* ---------- instal (PWA) ---------- */
.rm-pwa{text-align:center;padding:8px 0 24px}
.rm-pwa-visual{width:132px;height:132px;border-radius:32px;margin:18px auto;background:linear-gradient(150deg,#eef6ff,#fff);
  border:1px solid var(--lp-line);display:grid;place-items:center;position:relative;box-shadow:var(--lp-shadow)}
.rm-pwa-visual img{width:74px;height:74px;object-fit:contain}
.rm-pwa-arrow{position:absolute;right:10px;bottom:9px;width:44px;height:44px;border-radius:50%;
  background:var(--lp-grad);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:800;border:3px solid #fff}
.rm-pwa h1{font-size:19px;color:var(--lp-text);margin:0 0 8px;font-weight:800;letter-spacing:-.3px}
.rm-pwa>p{font-size:11px;color:var(--lp-muted);line-height:1.6;margin:0 auto 16px;max-width:340px}
.rm-pwa-benefits{background:#fff;border:1px solid var(--lp-line);border-radius:18px;text-align:left;padding:4px 14px;margin-bottom:15px;box-shadow:var(--lp-shadow)}
.rm-pwa-benefit{display:flex;gap:11px;align-items:flex-start;padding:12px 0;border-bottom:1px solid #eef3f8}
.rm-pwa-benefit:last-child{border-bottom:0}
.rm-pwa-benefit i{width:34px;height:34px;border-radius:11px;background:var(--lp-soft);color:var(--lp-blue);display:grid;place-items:center;font-style:normal;flex:none}
.rm-pwa-benefit b{display:block;font-size:11px}
.rm-pwa-benefit small{display:block;font-size:9.2px;color:var(--lp-muted);margin-top:2px;line-height:1.4}

/* ---------- daftar harga / produk ---------- */
.pl-top{margin-bottom:12px}
.pl-search,.pl-sel{width:100%;box-sizing:border-box}
.pl-cathead{font-size:14px!important;font-weight:800!important;color:var(--lp-text)!important;margin:16px 2px 9px!important}
.pl-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #eef3f8}
.pl-row:last-child{border-bottom:0}
.pl-name{font-size:12.5px;font-weight:700;line-height:1.35}
.pl-price,.pl-sell{color:var(--lp-blue)!important;font-weight:800!important}
.pl-coret{color:var(--lp-muted)!important;text-decoration:line-through;font-size:11px}
.pl-empty{color:var(--lp-muted)!important;text-align:center;padding:22px 0}

/* ---------- logo tanpa latar di mana pun ---------- */
.rm-auth-logo img,.hero .brand img,.lp3-brand img,.rm-pwa-visual img,#lpInstallLogo{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;padding:0!important;object-fit:contain!important}
.rm-pwa-visual{background:transparent!important;border:0!important;box-shadow:none!important}
.rm-pwa-arrow{border:0!important}

/* ---------- sisa halaman index (tampilan kategori/produk) ---------- */
.menucard{background:#fff!important;border:1px solid var(--lp-line)!important;border-radius:18px!important;margin:14px 0!important;padding:16px 10px!important;box-shadow:var(--lp-shadow)!important}
.menubanner{background:var(--lp-soft)!important;color:var(--lp-text)!important;border-radius:12px!important;padding:11px 15px!important;margin:0 6px 15px!important;font-size:14.5px!important;font-weight:800!important}
.micon{background:var(--lp-soft)!important;color:var(--lp-blue)!important;box-shadow:none!important;border:1px solid #dfeaff!important;border-radius:14px!important}
.micon.micon-bare{background:transparent!important;border:0!important}
.mlabel{color:#4d6079!important}
.product{border-radius:18px!important}
.product .price,.promoprice,.qitem b,.frpr,.silrow .silpr{color:var(--lp-blue)!important}
.back,.cbackbtn{background:#fff!important;border:1px solid var(--lp-line)!important;color:var(--lp-blue)!important;border-radius:12px!important}
.qtabs{border-bottom-color:var(--lp-line)!important}
.qtab{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-radius:11px!important}
.qtab.on{background:var(--lp-grad)!important;color:#fff!important}
.menucard.frcat{background:transparent!important;border:0!important;box-shadow:none!important}
.frbadge,#cBrandLbl{background:var(--lp-navy2)!important}
.bizfooter{color:var(--lp-muted)!important}
.promo-dots .dot{background:#cfd9e8!important}
.promo-dots .dot.active{background:var(--lp-blue)!important}
.promobadge{background:#fee2e2!important;color:#dc2626!important}
.promotimer{background:#fee2e2!important;color:#dc2626!important}

/* ---------- berita / info ---------- */
.lp-news-head{background:var(--lp-grad)!important;border-radius:20px!important;padding:18px!important;color:#fff!important;margin-bottom:14px}
.lp-news-head h1{font-size:19px!important;margin:0;font-weight:800}
.lp-news-head p{color:#d4e4f6!important;font-size:11.5px;margin:6px 0 0}
.news-card{border-radius:18px!important;overflow:hidden!important}
.news-body{padding:14px 16px!important}
.news-title{color:var(--lp-text)!important;font-weight:800}
.news-text{color:#50647f!important;line-height:1.6}
.news-date{color:var(--lp-blue)!important;font-weight:700}
.lp-cloud-note{background:#fff;border:1px solid var(--lp-line);border-radius:18px;padding:16px;margin-bottom:14px;box-shadow:var(--lp-shadow)}
.lp-cloud-note b{display:block}
.lp-cloud-note p{color:var(--lp-muted);font-size:12.5px;line-height:1.6}
.lp-cloud-note .tag{display:inline-block;background:var(--lp-soft);color:var(--lp-blue);border-radius:999px;padding:5px 10px;font-size:10px;font-weight:800}

/* ---------- halaman publik (syarat, kebijakan, dll) ---------- */
.lp-standalone .top{background:var(--lp-grad)!important;color:#fff!important;border-radius:0 0 24px 24px!important;box-shadow:none!important}
.lp-standalone .card{border:1px solid var(--lp-line)!important;border-radius:18px!important}
.lp-standalone .card h2{color:var(--lp-navy)!important}
.lp-standalone .card a{color:var(--lp-blue)!important}
.lp-standalone .card a.btn{background:var(--lp-grad)!important;color:#fff!important}
.lp-standalone .foot{color:var(--lp-muted)!important}

/* ---------- asisten chat ---------- */
#lpa-bubble,.lpa-send{background:var(--lp-grad)!important}
.lpa-head{background:var(--lp-grad)!important}
.lpa-act,.lpa-chip{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-radius:11px!important}

/* ---------- halaman lama (isi saldo, pascabayar, agen, ubah PIN/password) ---------- */
body.lp-ui-v2 .hd,body.lp-ui-v2 .pbhead,body.lp-ui-v2 .fshead,body.lp-ui-v2 .pgh,body.lp-ui-v2 .agh,
body.lp-ui-v2 .lpa-head,body.lp-ui-v2 .lpa-user,body.lp-ui-v2 .lpa-send,body.lp-ui-v2 #lpa-bubble{
  background:var(--lp-grad)!important;color:#fff!important}
body.lp-ui-v2 .sub:not(.hero),body.lp-ui-v2 .pbsub,body.lp-ui-v2 .fssub{background:#fff!important;color:var(--lp-blue)!important;border-color:var(--lp-line)!important}
body.lp-ui-v2 .card2,body.lp-ui-v2 .row,body.lp-ui-v2 .note,body.lp-ui-v2 .agc,body.lp-ui-v2 .sc,
body.lp-ui-v2 .lpa-bot,body.lp-ui-v2 .lpa-chips,body.lp-ui-v2 .lpa-inwrap{background:#fff!important;color:var(--lp-text)!important;border-color:var(--lp-line)!important}
body.lp-ui-v2 .inp,body.lp-ui-v2 .search,body.lp-ui-v2 .pin,body.lp-ui-v2 .lpa-inwrap input{background:#fff!important;color:var(--lp-text)!important;border-color:#cfdae8!important}
body.lp-ui-v2 .inp:focus,body.lp-ui-v2 .search:focus,body.lp-ui-v2 .pin:focus,body.lp-ui-v2 .lpa-inwrap input:focus{border-color:var(--lp-blue)!important;outline:none!important}
body.lp-ui-v2 .btn:not(.ghost),body.lp-ui-v2 .qbuy,body.lp-ui-v2 .depbtn{background:var(--lp-grad)!important;color:#fff!important;border-color:transparent!important}
body.lp-ui-v2 .agc h4,body.lp-ui-v2 .lbl,body.lp-ui-v2 .pl-cathead,body.lp-ui-v2 .pl-sell,body.lp-ui-v2 .lpok{color:var(--lp-blue)!important}
body.lp-ui-v2 .lpa-act:not(.wa),body.lp-ui-v2 .lpa-chip{background:var(--lp-soft)!important;color:var(--lp-blue)!important}
body.lp-ui-v2 #lpa-panel,body.lp-ui-v2 .lpa-inline{border-color:var(--lp-line)!important;box-shadow:0 14px 38px rgba(13,42,82,.16)!important}
.mok{background:#e7f7ee!important;border:1px solid #bfe8d2!important;color:#0f7a48!important;border-radius:12px!important;padding:11px 13px!important;font-size:12px!important;font-weight:700}

/* ---------- pintasan ke Daftar Harga (halaman Produk) ---------- */
.dh-toharga{display:flex;align-items:center;gap:11px;text-decoration:none;color:#fff;border-radius:17px;padding:13px 14px;margin:2px 0 13px;background:var(--lp-grad);box-shadow:0 10px 22px rgba(11,63,153,.18)}
.dh-toharga-ic{flex:none;width:42px;height:42px;border-radius:13px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);display:grid;place-items:center;font-size:14px;font-weight:800}
.dh-toharga span:nth-child(2){flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.dh-toharga b{font-size:12.5px;line-height:1.3}
.dh-toharga small{font-size:9.8px;color:rgba(255,255,255,.82);line-height:1.35}
.dh-toharga .dh-chev{color:rgba(255,255,255,.85);font-size:21px;line-height:1;flex:none}

/* ---------- tampilan kategori (index.php?cat=) : samakan dengan desain baru ---------- */
.hero{background:var(--lp-grad)!important;border-radius:0 0 22px 22px!important;box-shadow:0 10px 24px rgba(11,63,153,.18)!important}
.hero .bname{color:#fff!important}
.hero .btag{color:#cfe0f7!important}
.hero h1 em{color:#8fd8ff!important}
.silband,.silisi{background:transparent!important;color:var(--lp-text)!important;font-weight:800!important}
.catlbl,.qlbl{color:var(--lp-muted)!important;font-weight:700!important}
.qbuy,.btn.cek{background:var(--lp-grad)!important;color:#fff!important;border:0!important;border-radius:13px!important;min-height:48px;font-weight:800!important}
.qinput,.fssearch,.inprow input{border:1px solid #cfdae8!important;border-radius:13px!important;background:#fff!important;color:var(--lp-text)!important;min-height:48px}
.qinput:focus,.fssearch:focus{outline:none!important;border-color:var(--lp-blue)!important;box-shadow:0 0 0 3px rgba(20,113,245,.09)!important}
.silrow,.fsrow{border-bottom:1px solid #eef3f8!important}
.silcard{border-radius:18px!important}
.durchips .durchip,.qtab{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border-radius:11px!important;border:1px solid #dceaff!important}
.durchips .durchip.on,.qtab.on{background:var(--lp-grad)!important;color:#fff!important;border-color:transparent!important}
.idinfo{background:var(--lp-soft)!important;color:var(--lp-blue)!important;border:1px solid #dceaff!important}
.idtutor,.qhint{background:#f6f9ff!important;border:1px solid #dfeaff!important;color:#40597a!important;border-radius:13px!important}
.catnum{background:#fff!important;border:1px solid var(--lp-line)!important;border-radius:18px!important;box-shadow:var(--lp-shadow)!important}

/* ---------- konfirmasi transaksi (order.php, berkas terkunci: hanya lewat CSS) ---------- */
body .hero2{background:var(--lp-grad)!important;box-shadow:0 8px 20px rgba(11,63,153,.2)!important}
body .lpsub{background:linear-gradient(90deg,#0b3f99,#1471f5)!important}
body .lpbtn{background:var(--lp-grad)!important}
body .frbadge2{background:linear-gradient(90deg,#0b3f99,#1471f5)!important}
body .lpok{color:var(--lp-blue)!important}
body .lpprod,body .lpnum{background:#f3f7fc!important;border:1px solid var(--lp-line)!important}
body .lplabel,body .lpnumlbl{color:var(--lp-text)!important}
body .lpov{background:rgba(6,31,74,.55)!important}
body[class] .lpbody{max-width:520px!important}

/* ---------- status warna ---------- */
.rvx-badge.ok,.badge.ok,.st-sukses{background:#e7f7ee!important;color:var(--lp-success)!important}
.rvx-badge.no,.badge.no,.st-gagal{background:#fdecec!important;color:var(--lp-danger)!important}
.rvx-badge.wait,.badge.wait,.st-menunggu{background:#fff5e5!important;color:var(--lp-warn)!important}

/* ---------- bersihkan sisa warna ungu lama ---------- */
[style*="#6d28d9"],[style*="#7c3aed"],[style*="#a855f7"],[style*="#8b5cf6"],[style*="#9333ea"],[style*="#4f46e5"]{color:var(--lp-blue)!important;border-color:var(--lp-line)!important}

@media(max-width:380px){
  .mwrap{padding-left:12px!important;padding-right:12px!important}
  .lp-shell-name{font-size:18px}
  .botnav a{font-size:8.6px!important}
  .botnav a.rm-center .rm-center-icon{width:48px;height:48px;top:-32px!important}
  .rm-pwa-visual{width:118px;height:118px}
}

/* ================= Pemilih kode negara global (lpcc) ================= */
.lpcc{display:flex;align-items:stretch;width:100%;border:1px solid #cfdae8;border-radius:12px;
  background:#fff;overflow:hidden;margin:0 0 12px}
.lpcc:focus-within{border-color:#1471f5;box-shadow:0 0 0 3px rgba(20,113,245,.09)}
.lpcc-btn{flex:none;display:flex;align-items:center;gap:6px;padding:0 10px 0 12px;margin:0;
  border:0;border-right:1px solid #e7edf5;background:#fbfdff;cursor:pointer;
  font:inherit;font-size:13px;font-weight:700;color:#0b2a5b;min-height:48px}
.lpcc-btn:active{background:#f1f6fd}
.lpcc-f{font-size:17px;line-height:1}
.lpcc-d{letter-spacing:.2px}
.lpcc-cev{width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;
  border-top:5px solid #7b8ca3;margin-left:1px}
.lpcc .lpcc-in,.lpcc .minput,.lpcc .rm-input,.lpcc .input{
  flex:1 1 auto;min-width:0;width:100%!important;border:0!important;border-radius:0!important;
  margin:0!important;box-shadow:none!important;background:transparent!important;outline:none!important}
.lpcc .minput{display:block!important}

/* di halaman depan kotaknya sudah punya bingkai sendiri */
.lp3-hp.lpcc{border:1px solid #cfdae8;margin:0 0 14px}
.lp3-hp .lpcc-btn{background:#fbfdff}

/* lembar pilihan negara */
.lpcc-sheet{position:fixed;inset:0;z-index:9999;display:flex;align-items:flex-end;justify-content:center}
.lpcc-sheet[hidden]{display:none}
.lpcc-tirai{position:absolute;inset:0;background:rgba(9,22,44,.45);backdrop-filter:blur(2px)}
.lpcc-panel{position:relative;width:100%;max-width:520px;max-height:82vh;display:flex;flex-direction:column;
  background:#fff;border-radius:18px 18px 0 0;box-shadow:0 -12px 40px rgba(9,22,44,.28);
  animation:lpccNaik .18s ease-out}
@keyframes lpccNaik{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
.lpcc-head{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px 10px;border-bottom:1px solid #eef2f7}
.lpcc-head b{font-size:15px;font-weight:800;color:#0b2a5b}
.lpcc-x{border:0;background:#f1f5fa;color:#5a6b82;width:32px;height:32px;border-radius:50%;
  font-size:20px;line-height:1;cursor:pointer}
.lpcc-cari{padding:10px 16px}
.lpcc-input{width:100%;min-height:44px;padding:0 13px;border:1px solid #dbe4ef;border-radius:11px;
  font:inherit;font-size:14px;color:#0b2a5b;background:#fbfdff;outline:none}
.lpcc-input:focus{border-color:#1471f5;box-shadow:0 0 0 3px rgba(20,113,245,.09)}
.lpcc-list{flex:1 1 auto;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 8px 18px}
.lpcc-kel{padding:12px 10px 5px;font-size:11px;font-weight:800;letter-spacing:.6px;
  text-transform:uppercase;color:#8595ab}
.lpcc-item{display:flex;align-items:center;gap:11px;width:100%;padding:11px 10px;margin:0;
  border:0;border-radius:11px;background:transparent;cursor:pointer;text-align:left;font:inherit}
.lpcc-item:active{background:#f2f7fe}
.lpcc-item .lpcc-f{font-size:20px}
.lpcc-item .lpcc-n{flex:1 1 auto;min-width:0;font-size:14px;font-weight:600;color:#132b4d;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lpcc-item .lpcc-d{font-size:13px;font-weight:700;color:#5a6b82}
.lpcc-kosong{padding:26px 12px;text-align:center;font-size:13px;color:#7b8ca3}
body.lpcc-kunci{overflow:hidden}

/* ikon pensil di blok profil -> membuka halaman Profil Saya */
.ak-pen svg{fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ak-top .ak-pen{display:grid;place-items:center;text-decoration:none}

/* kartu referral & daftar keamanan di halaman Profil Saya */
.mwrap .refcard{margin:14px 0 6px}

/* ================= bar atas halaman kategori disamakan dengan halaman lain =========
   index.php memakai header lama (.hero) yang berlatar biru. Di sini dibuat putih,
   berisi logo + nama toko + lonceng + bantuan, dan tetap terkunci di atas layar. */
body .hero{background:#fff!important;background-image:none!important;color:var(--lp-text)!important;
  position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:140!important;
  margin:0!important;width:auto!important;
  border-radius:0!important;border:0!important;border-bottom:1px solid var(--lp-line)!important;
  padding:0 16px!important;box-shadow:0 6px 16px -12px rgba(13,42,82,.55)!important}
body .hero .herotop{min-height:64px;gap:6px;flex-wrap:nowrap}
body .hero .hero-actions{gap:6px}
body .hero .brand{margin:0 auto 0 0!important;text-align:left!important;gap:10px}
body .hero.sub .brand{margin:0 auto 0 0!important;text-align:left!important}
body .hero .bmark{flex:none;width:30px;height:30px;display:grid;place-items:center}
body .hero .brand>div{min-width:0}
body .hero .bmark img{width:100%;height:100%;object-fit:contain;background:none;border:0}
body .hero .bname{color:var(--lp-navy)!important;font-size:15px!important;font-weight:800!important;
  white-space:nowrap!important;line-height:1.2!important}
body .hero .btag{display:none!important}

/* tombol bulat di bar atas: sama seperti .lp-shell-ic */
body .hero .hero-ic,body .hero .js-home,body .hero .lp-burger{
  background:#f2f6fc!important;border:1px solid var(--lp-line)!important;color:var(--lp-navy2)!important;
  flex:none!important;width:34px!important;height:34px!important;border-radius:11px!important;margin-right:0!important}
body .hero .hero-ic svg,body .hero .js-home svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9}
body .hero .hero-bell{position:relative}
body .hero .hero-bell i{position:absolute;top:8px;right:9px;width:7px;height:7px;border-radius:50%;
  background:#e5484d;border:2px solid #fff}
body .hero .hero-dd{color:var(--lp-text)}
body .hero .hero-sep{background:var(--lp-line)!important}

/* garis judul kategori: lembut, bukan pita biru penuh */
/* ACC-4 — PITA JUDUL SELEBAR ISINYA.
   Sebelumnya margin:0 -16px membuat pita membentang penuh 0..390px,
   sementara daftar di bawahnya menjorok 16..374px. Selisih 32px itu
   yang terbaca "kelebaran": pita dan daftar seolah dua sistem lebar
   yang berbeda. Sekarang pita mengikuti lebar isi, diberi sudut
   membulat supaya terbaca sebagai judul bagian, bukan potongan bar. */
body .hero .lpsubtab{background:#f4f8ff!important;background-image:none!important;
  color:var(--lp-navy2)!important;font-size:13.5px!important;font-weight:800!important;
  padding:9px 14px!important;margin:0 0 10px!important;
  border:1px solid var(--lp-line)!important;border-radius:12px!important;
  letter-spacing:.2px!important}


/* ================= jarak untuk bar atas yang menempel =====================
   Bar atas memakai position:fixed (bukan sticky) karena sticky sering
   tersendat/berkedip saat digulir cepat di ponsel. Tinggi bar diukur oleh
   assets/lera-bar-v1.js lalu dipasang sebagai --lp-bar-atas. */
/* isi halaman diberi jarak sebesar tinggi bar; angka cadangan dipakai
   kalau skrip belum sempat mengukur */
/* ACC-3 — JEDA NAPAS DI BAWAH BAR ATAS.
   Sebelumnya padding atas isi halaman PERSIS setinggi bar, sehingga blok
   pertama (banner Aktivitas, judul Keamanan, kartu identitas Akun/Profil,
   kepala Jelajah/Bantuan, sapaan Beranda) menempel tanpa jarak sama sekali
   ke garis bawah bar — diukur 0-2px di sembilan halaman. Owner: "terlalu
   mepet". Layar PAY sudah memakai 14px dan itulah nilai rumahnya, jadi
   nilai yang sama dipakai untuk semua halaman supaya seragam. */
:root{--lp-atas-jeda:14px}
.mwrap{padding-top:calc(var(--lp-bar-atas,64px) + var(--lp-atas-jeda))!important}
body .wrap{padding-top:calc(var(--lp-bar-atas,100px) + var(--lp-atas-jeda))!important}

/* ---- dokumen dikunci: hanya kotak isi yang menggulir ----------------------
   Dipasang oleh assets/lera-bar-v1.js. Tujuannya supaya bilah alamat Chrome
   tidak pernah menyusut, sehingga bar atas & bawah tidak bergeser sedikit pun. */
html.lp-kunci,html.lp-kunci body{height:100%!important;overflow:hidden!important;
  overscroll-behavior:none!important;position:relative!important}
/* ACC-3 — jeda napas juga dipasang DI SINI. Saat dokumen dikunci
   (jalur normal di ponsel), .mwrap berubah jadi kotak gulir tetap dan
   aturan ini menimpa padding atas .mwrap dengan 0. Itulah sebabnya blok
   pertama menempel ke bar. Nilai jeda dipakai supaya seragam dengan
   layar PAY, dan karena letaknya di dalam kotak gulir, jeda ini ikut
   tergulir seperti seharusnya. */
html.lp-kunci .lp-gulir{position:fixed!important;left:0!important;right:0!important;
  top:var(--lp-bar-atas,0px)!important;bottom:0!important;
  margin-left:auto!important;margin-right:auto!important;
  padding-top:var(--lp-atas-jeda,14px)!important;
  /* ACC-4 — RUANG BAWAH. Kotak gulir dipasang bottom:0, sementara
     navigasi bawah melayang DI ATASNYA setinggi ~63px + tombol PAY.
     .mwrap sudah punya padding bawah 88px, tapi .wrap TIDAK PERNAH
     dapat — akibatnya di layar ber-.wrap (daftar produk index.php,
     Tentang, Syarat) baris terakhir tertutup navigasi. Diukur pada
     daftar merek Tri: baris "Tri Bulanan" tertutup 19px.
     Dipasang di kotak gulirnya sendiri supaya berlaku untuk SEMUA
     halaman, .mwrap maupun .wrap, tidak per-halaman lagi. */
  padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;
  min-height:0!important;height:auto!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch}

/* ============================================================
   PATCH_GO_FINAL_MASTER_V1 — FINAL MASTER VISUAL
   Komponen baru: hero, pencarian, kartu keluarga solusi, kartu
   discovery Global & Travel, PAY hub, halaman Global & Travel,
   catatan saldo lama (baca-saja), dan penanda "Segera Hadir".
   Hanya penambahan; tidak ada aturan lama yang diubah.
   ============================================================ */

/* --- Hero Beranda --- */
.lp3-hero{padding:2px 16px 0}
.lp3-hero-card{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#0b5ed7,#2b88ff);color:#fff;border-radius:18px;padding:18px 18px;text-decoration:none;box-shadow:0 10px 26px rgba(11,94,215,.28)}
.lp3-hero-tx{flex:1;min-width:0}
.lp3-hero-tx b{display:block;font-size:19px;font-weight:800;line-height:1.25;letter-spacing:-.2px}
.lp3-hero-tx small{display:block;margin-top:5px;font-size:12.5px;opacity:.92;line-height:1.4}
.lp3-hero-go{flex:none;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,.22);display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:700}

/* --- Kotak pencarian --- */
.lp3-search{position:relative;display:flex;align-items:center;margin:14px 16px 2px}
.lp3-search-ic{position:absolute;left:14px;display:flex;width:18px;height:18px;pointer-events:none;color:#8a93a8}
.lp3-search-ic svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp3-search input{width:100%;border:1px solid #e2e8f2;background:#fff;border-radius:14px;padding:13px 14px 13px 40px;font:inherit;font-size:14px;color:#102542;outline:none}
.lp3-search input:focus{border-color:#2b88ff;box-shadow:0 0 0 3px rgba(43,136,255,.13)}

/* --- Kartu keluarga solusi (grid 2x2) --- */
.lp3-fams{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.lp3-fam{position:relative;display:flex;flex-direction:column;gap:9px;background:#fff;border:1px solid #eef2f8;border-radius:16px;padding:14px 13px;text-decoration:none;box-shadow:0 4px 14px rgba(15,39,72,.06);min-width:0}
.lp3-fam-ic{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:#eaf3ff;color:#0b5ed7}
.lp3-fam-ic svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp3-fam-tagihan{background:#fff4e6;color:#c2691a}
.lp3-fam-global{background:#e9f8ee;color:#12804a}
.lp3-fam-digital{background:#f3ecff;color:#6c2ecf}
.lp3-fam-tx{min-width:0}
.lp3-fam-tx b{display:block;font-size:14px;font-weight:800;color:#102542;line-height:1.3;overflow-wrap:anywhere}
.lp3-fam-tx small{display:block;margin-top:3px;font-size:11.5px;color:#71839d;line-height:1.4;overflow-wrap:anywhere}
.lp3-fam.is-off{opacity:.62;cursor:default}
.lp3-soon{position:absolute;top:10px;right:10px;background:#ffe9ec;color:#c8324a;font-size:9.5px;font-weight:800;letter-spacing:.2px;padding:3px 7px;border-radius:999px;white-space:nowrap}

/* --- Kartu discovery Global & Travel di Beranda --- */
.lp3-gt{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#0f766e,#16a394);color:#fff;border-radius:16px;padding:14px;text-decoration:none;box-shadow:0 8px 20px rgba(15,118,110,.24)}
.lp3-gt-ic{flex:none;width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center}
.lp3-gt-ic svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp3-gt-tx{flex:1;min-width:0}
.lp3-gt-tx b{display:block;font-size:14.5px;font-weight:800;line-height:1.3}
.lp3-gt-tx small{display:block;margin-top:3px;font-size:11.5px;opacity:.95}
.lp3-gt-tx small i{font-style:normal;background:rgba(255,255,255,.25);padding:2px 7px;border-radius:999px;font-weight:800}
.lp3-gt-go{flex:none;font-size:22px;opacity:.9}

/* --- FAB PAY pada navigasi bawah --- */
.rm-center-pay{font-size:12.5px;font-weight:800;letter-spacing:.6px}
.lp3-nav .lp3-fab span{font-size:13px;font-weight:800;letter-spacing:.6px}

/* --- Catatan saldo lama (baca-saja, hanya konteks Akun) --- */
.lp-legacy-bal{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px;margin:12px 16px 0;padding:11px 13px;background:#f6f8fc;border:1px solid #e4eaf4;border-radius:13px}
.lp-legacy-bal b{font-size:12.5px;font-weight:800;color:#42506b}
.lp-legacy-bal span{font-size:14.5px;font-weight:800;color:#102542}
.lp-legacy-bal small{flex:0 0 100%;font-size:11px;color:#71839d;line-height:1.45}

/* --- PAY hub (bayar.php) --- */
.payhub{padding:4px 0 8px}
.payhub-head{text-align:center;padding:6px 16px 16px}
.payhub-head h1{margin:0;font-size:24px;font-weight:800;letter-spacing:1px;color:#102542}
.payhub-head p{margin:5px 0 0;font-size:12.5px;color:#71839d}
.payhub-list{display:flex;flex-direction:column;gap:9px}
.payhub-it{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #eef2f8;border-radius:15px;padding:14px 13px;text-decoration:none;box-shadow:0 3px 12px rgba(15,39,72,.05)}
.payhub-it.is-off{opacity:.6;cursor:default}
.payhub-ic{flex:none;width:40px;height:40px;border-radius:13px;background:#eaf3ff;color:#0b5ed7;display:flex;align-items:center;justify-content:center}
.payhub-ic svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.payhub-tx{flex:1;min-width:0}
.payhub-tx b{display:block;font-size:14.5px;font-weight:800;color:#102542;line-height:1.3;overflow-wrap:anywhere}
.payhub-tx small{display:block;margin-top:3px;font-size:11.5px;color:#71839d;line-height:1.4;overflow-wrap:anywhere}
.payhub-go{flex:none;font-size:22px;color:#b9c4d6}
.payhub-soon{flex:none;background:#ffe9ec;color:#c8324a;font-size:9.5px;font-weight:800;padding:4px 8px;border-radius:999px;white-space:nowrap}
.payhub-note{margin:14px 4px 0;font-size:11.5px;color:#71839d;text-align:center;line-height:1.5}

/* --- Halaman Global & Travel --- */
.gtp{padding:2px 0 8px}
.gtp-hero{background:linear-gradient(135deg,#0f766e,#16a394);color:#fff;border-radius:18px;padding:20px 16px;margin-bottom:14px;box-shadow:0 10px 24px rgba(15,118,110,.24)}
.gtp-hero-ic{display:inline-flex;width:40px;height:40px;border-radius:13px;background:rgba(255,255,255,.2);align-items:center;justify-content:center;margin-bottom:10px}
.gtp-hero-ic svg{width:21px;height:21px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gtp-hero b{display:block;font-size:19px;font-weight:800;line-height:1.25}
.gtp-hero small{display:block;margin-top:5px;font-size:12.5px;opacity:.93}
.gtp-list{display:flex;flex-direction:column;gap:9px}
.gtp-it{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid #eef2f8;border-radius:15px;padding:14px 13px;text-decoration:none;box-shadow:0 3px 12px rgba(15,39,72,.05)}
.gtp-it.is-off{opacity:.6;cursor:default}
.gtp-ic{flex:none;width:40px;height:40px;border-radius:13px;background:#e9f8ee;color:#12804a;display:flex;align-items:center;justify-content:center}
.gtp-ic svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gtp-tx{flex:1;min-width:0}
.gtp-tx b{display:block;font-size:14.5px;font-weight:800;color:#102542;line-height:1.3;overflow-wrap:anywhere}
.gtp-tx small{display:block;margin-top:3px;font-size:11.5px;color:#71839d;line-height:1.4;overflow-wrap:anywhere}
.gtp-go{flex:none;font-size:22px;color:#b9c4d6}
.gtp-soon{flex:none;background:#ffe9ec;color:#c8324a;font-size:9.5px;font-weight:800;padding:4px 8px;border-radius:999px;white-space:nowrap}
.gtp-h{margin:18px 2px 10px}
.gtp-h b{font-size:15px;font-weight:800;color:#102542}
.gtp-negara{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:2px}
.gtp-negara::-webkit-scrollbar{display:none}
.gtp-neg{flex:0 0 auto;background:#fff;border:1px solid #eef2f8;border-radius:999px;padding:9px 14px;font-size:12.5px;font-weight:700;color:#42506b;white-space:nowrap}
.gtp-note{margin:16px 4px 0;font-size:11.5px;color:#71839d;text-align:center;line-height:1.5}

/* --- Jelajah: subjudul grup + status nonaktif --- */
.dh-sub{margin:-4px 2px 9px;font-size:11.5px;color:#71839d;line-height:1.45}
.dh-soon{background:#ffe9ec;color:#c8324a;font-size:9.5px;font-weight:800;padding:4px 8px;border-radius:999px;white-space:nowrap}
.dh-sec.is-off .dh-grid{opacity:.6}
.dh-tile.is-off{cursor:default}

/* --- Layar sangat sempit --- */
@media(max-width:359px){
  .lp3-fams{gap:8px}
  .lp3-fam{padding:12px 10px}
  .lp3-fam-tx b{font-size:13px}
  .lp3-fam-tx small{font-size:10.5px}
  .lp3-hero-tx b{font-size:17px}
}

/* --- Item nonaktif "Segera Hadir" pada drawer & grid menu --- */
.lp-dsoon{display:flex;align-items:center;gap:10px;padding:11px 14px;color:#8a93a8;font-weight:600;opacity:.75}
.lp-dsoon i{font-style:normal;background:#ffe9ec;color:#c8324a;font-size:9.5px;font-weight:800;padding:3px 7px;border-radius:999px;margin-left:auto;white-space:nowrap}
.menu-item.is-off{opacity:.55;cursor:default;pointer-events:none}
/* kontras label PAY pada FAB navigasi */
.botnav a.rm-center .rm-center-pay,.rm-center-pay{color:#fff!important;font-size:12.5px!important;font-weight:800!important;letter-spacing:.6px!important}

/* =====================================================================
   RFV-6 / RFV2-E — SISTEM VISUAL SATU BAHASA DESAIN (halaman ber-shell)
   Padanan dari blok token di ui_v2.php::lph_master_css(). Beranda memuat
   CSS-nya sendiri, jadi token yang sama harus ada di dua tempat.
   Berlaku untuk Jelajah (.jl-*), PAY (.payhub-*), dan Global & Travel
   (.gtp-*): proporsi kartu, kotak ikon, radius, jarak, hierarki huruf,
   dan perlakuan nonaktif dibuat identik.

   V2: nilai dirapatkan mengikuti master Owner. Target sentuh tetap
   >= 44px lewat --lp-row/--lp-tap; kerapatan TIDAK dicapai dengan
   mengecilkan area sentuh.
   HANYA properti tampilan. Tidak ada markup, tautan, atau perilaku yang
   berubah, dan tidak ada gaya saldo/wallet yang dihidupkan kembali.
   ===================================================================== */
:root{
  --lp-card-r:14px;
  --lp-hero-r:16px;
  --lp-ic:40px;
  --lp-ic-r:12px;
  --lp-pad:11px 12px;
  --lp-gap:8px;
  --lp-sec:12px;
  --lp-t1:13.5px;
  --lp-t2:10.8px;
  --lp-row:56px;
  --lp-tap:44px;
  --lp-surface:#fff;
  --lp-line:#eef2f8;
  --lp-shadow:0 3px 10px rgba(15,39,72,.05);
  --lp-blue:#0b5ed7;
  --lp-blue2:#2b88ff;
  --lp-ink:#102542;
  --lp-mut:#71839d;
}

/* --- baris kartu: Jelajah / PAY / Global & Travel --- */
.jl-row,.payhub-it,.gtp-it,.jl-help,.jl-tab,.gtp-neg,.payhub-close,.gtp-back{
  /* Komponen ini menghitung sebagai content-box di shell lama, sehingga
     min-height DITAMBAHKAN ke padding+border dan baris membengkak
     (58px min -> 80px nyata). Dipaksa border-box supaya tinggi yang
     ditulis benar-benar tinggi yang tampil. */
  box-sizing:border-box;
}
.jl-row,.payhub-it,.gtp-it{
  border-radius:var(--lp-card-r);
  padding:var(--lp-pad);
  min-height:var(--lp-row);
  background:var(--lp-surface);
  border:1px solid var(--lp-line);
  box-shadow:var(--lp-shadow);
  gap:10px;
}
.jl-rows,.payhub-list,.gtp-list{gap:var(--lp-gap)}

/* --- kotak ikon seragam --- */
.jl-ic,.payhub-ic,.gtp-ic{
  width:var(--lp-ic);height:var(--lp-ic);border-radius:var(--lp-ic-r);flex:none;
  display:flex;align-items:center;justify-content:center;
}
.jl-ic svg,.payhub-ic svg,.gtp-ic svg{width:20px;height:20px}

/* --- hierarki huruf --- */
.jl-tx b,.payhub-tx b,.gtp-tx b{font-size:var(--lp-t1);font-weight:800;color:var(--lp-ink);line-height:1.25}
.jl-tx small,.payhub-tx small,.gtp-tx small{font-size:var(--lp-t2);color:var(--lp-mut);line-height:1.3;margin-top:2px}
.jl-go,.payhub-go,.gtp-go{font-size:19px;color:#b9c4d6}

/* --- judul seksi --- */
.jl-head{padding:2px 4px 10px}
.jl-head h1{font-size:18.5px;font-weight:800;color:var(--lp-ink);letter-spacing:-.2px}
.jl-head p{margin:4px 0 0;font-size:11.5px;color:var(--lp-mut)}

/* ===== RFV2-B: EMPAT TAB MUAT SATU BARIS DI 390px =====
   Sebelumnya .jl-tabs adalah deret bergeser (overflow-x:auto) dengan
   pil selebar isinya; scrollWidth 432px > 390px sehingga "Promo"
   terpotong di ID maupun EN. Diubah menjadi grid 4 kolom sama lebar
   sehingga selalu muat tanpa gulir, di kedua bahasa. */
.jl-tabs{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;overflow:visible;margin:0 0 12px;padding:0;
}
.jl-tab{
  width:100%;min-width:0;padding:9px 4px;font-size:11.5px;font-weight:700;
  border-radius:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  min-height:var(--lp-tap);
}
.jl-search{margin:0 0 10px}
.jl-search input{padding:11px 12px 11px 38px;font-size:13px;border-radius:12px}
.jl-help{padding:var(--lp-pad);border-radius:var(--lp-card-r);margin-top:10px;min-height:var(--lp-row);gap:10px}

/* --- perlakuan nonaktif / Segera Hadir: satu bentuk di semua layar --- */
.jl-row.is-off,.payhub-it.is-off,.gtp-it.is-off{
  opacity:.55;filter:saturate(.35);cursor:default;box-shadow:none;background:#fafbfd;
}
.jl-soon,.payhub-soon,.gtp-soon{
  flex:none;background:#eef1f6;color:#6b7a91;font-size:8.8px;font-weight:800;
  letter-spacing:.2px;padding:3px 8px;border-radius:999px;white-space:nowrap;
}
/* Blok token V1 dihapus di V2: nilainya (--lp-ic:44px, --lp-pad:15px 14px,
   --lp-sec:18px, dst) berada SETELAH blok V2 di berkas ini sehingga
   menimpanya diam-diam — itulah sebab kotak ikon tetap 44px dan baris
   Global & Travel setinggi 80px meski token V2 sudah dirapatkan.
   Definisi tunggal kini hanya ada di blok RFV2-E di atas. */

/* ===== RFV2-C — GLOBAL & TRAVEL: layar khusus bergaya master =====
   Kepala layar sendiri (tombol kembali + judul + subjudul), hero
   bernuansa perjalanan (SVG sebaris, tanpa berkas/permintaan baru),
   baris layanan rapat, dan Negara Populer berupa deretan bendera.
   Status "Segera Hadir" + nonaktif TIDAK diubah; lib_airhub tetap
   tidak pernah dimuat. */
.gtp-top{display:flex;align-items:center;gap:8px;margin:0 0 12px;min-height:var(--lp-tap)}
.gtp-back{flex:none;width:var(--lp-tap);height:var(--lp-tap);margin-left:-8px;
  display:flex;align-items:center;justify-content:center;color:var(--lp-ink);
  text-decoration:none;border-radius:12px;-webkit-tap-highlight-color:transparent}
.gtp-back svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;
  stroke-linecap:round;stroke-linejoin:round}
.gtp-ttl{flex:1;min-width:0;text-align:center;padding-right:var(--lp-tap)}
.gtp-ttl b{display:block;font-size:16.5px;font-weight:800;color:var(--lp-ink);line-height:1.2}
.gtp-ttl small{display:block;margin-top:2px;font-size:11px;color:var(--lp-mut)}

.gtp-hero{position:relative;overflow:hidden;border-radius:var(--lp-hero-r);
  padding:0;min-height:118px;margin-bottom:12px;color:#fff;
  background:linear-gradient(135deg,#0a4fb5,#1f7ae0 52%,#4aa8f0);
  box-shadow:0 8px 18px rgba(11,94,215,.24)}
.gtp-hero .lp3-gt-scene{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}
.gtp-hero-in{position:relative;z-index:2;padding:16px 15px;max-width:64%}
.gtp-hero b{display:block;font-size:17.5px;font-weight:800;line-height:1.22;letter-spacing:-.2px}
.gtp-hero small{display:block;margin-top:6px;font-size:11px;opacity:.95;line-height:1.4}

.gtp-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:14px 2px 8px}
.gtp-h b{font-size:14px;font-weight:800;color:var(--lp-ink)}
.gtp-h a{font-size:11.5px;font-weight:700;color:var(--lp-blue);text-decoration:none}

/* Negara Populer: bendera + nama, bukan pil teks */
.gtp-negara{display:flex;gap:14px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  scrollbar-width:none;padding:2px 0 4px;margin:0}
.gtp-negara::-webkit-scrollbar{display:none}
.gtp-neg{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:5px;
  width:58px;text-align:center;background:none;border:0;padding:0}
.gtp-neg .fl{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;font-size:20px;line-height:1;background:#f2f6fc;
  border:1px solid var(--lp-line);overflow:hidden}
.gtp-neg .nm{font-size:9.8px;font-weight:700;color:#42506b;line-height:1.2;overflow-wrap:anywhere}
.gtp-note{margin:12px 4px 0;font-size:10.8px;color:var(--lp-mut);text-align:center;line-height:1.5}

/* --- judul seksi --- */
.jl-head h1,.payhub-head h1,.gtp-h b{font-size:21px;font-weight:800;color:var(--lp-ink);letter-spacing:-.2px}

/* --- perlakuan nonaktif / Segera Hadir: satu bentuk di semua layar --- */
.jl-row.is-off,.payhub-it.is-off,.gtp-it.is-off{
  opacity:.55;filter:saturate(.35);cursor:default;box-shadow:none;background:#fafbfd;
}
.jl-soon,.payhub-soon,.gtp-soon{
  flex:none;background:#eef1f6;color:#6b7a91;font-size:9.5px;font-weight:800;
  letter-spacing:.2px;padding:4px 9px;border-radius:999px;white-space:nowrap;
}


/* RFV-6 — perbaikan lebar berlebih pada layar sempit.
   .mwrap memakai padding 12px di bawah 380px (aturan lama di berkas ini),
   sedangkan deret bergeser (.jl-tabs, .rvy-chips) memakai bleed -16px,
   sehingga dokumen menjadi 4px lebih lebar dari viewport dan muncul
   gulir mendatar. Bleed disamakan dengan padding shell. */
@media(max-width:380px){
  .jl-tabs,.rvy-chips,.gtp-negara{
    margin-left:-12px!important;margin-right:-12px!important;
    padding-left:12px!important;padding-right:12px!important;
  }
}

/* ===== RFV2-D — PAY sebagai LEMBAR AKSI CEPAT yang ringkas =====
   Master Owner menggambarkan PAY sebagai panel/sheet pendek, bukan
   halaman penuh berisi kartu besar. Hanya presentasi: rute dan status
   aktif/nonaktif tiap baris tidak berubah. */
.payhub-sheet{
  background:var(--lp-surface);
  border-radius:20px 20px var(--lp-card-r) var(--lp-card-r);
  border:1px solid var(--lp-line);
  box-shadow:0 -6px 28px rgba(15,39,72,.10);
  padding:8px 14px 16px;
  margin:6px 0 0;
}
.payhub-grab{width:38px;height:4px;border-radius:999px;background:#dfe6f0;margin:2px auto 10px}
.payhub-head{text-align:center;padding:0 4px 12px}
.payhub-head h1{margin:0;font-size:19px;font-weight:800;color:var(--lp-ink);letter-spacing:.4px}
.payhub-head p{margin:4px 0 0;font-size:11.5px;color:var(--lp-mut)}
.payhub-note{margin:12px 6px 0;font-size:10.8px;color:var(--lp-mut);text-align:center;line-height:1.5}
.payhub-close{
  display:flex;align-items:center;justify-content:center;
  width:var(--lp-tap);height:var(--lp-tap);margin:14px auto 2px;
  border-radius:50%;background:#eef1f6;color:#5b6b85;text-decoration:none;
  -webkit-tap-highlight-color:transparent;
}
.payhub-close svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round}

/* ===== RFV2-F — navigasi tetap tidak boleh menutup konten =====
   .mwrap sudah punya padding bawah; ditegaskan di sini supaya berlaku
   sama pada SEMUA layar master, termasuk yang menambah seksi baru. */
.mwrap{padding-bottom:calc(88px + env(safe-area-inset-bottom))!important}

/* RFV2-C — baris layanan Global & Travel dirapatkan ke proporsi master:
   pil status berada di baris judul, subjudul memakai lebar penuh. */
.gtp-tx{flex:1;min-width:0}
.gtp-ln{display:flex;align-items:center;gap:8px;min-width:0}
.gtp-ln b{flex:0 1 auto;min-width:0;overflow-wrap:anywhere}
.gtp-it{min-height:58px;padding:10px 12px;align-items:center}
/* Judul + pil status harus muat satu baris; pil dikecilkan agar judul
   panjang ("Paket Data Internasional") tidak memaksa baris kedua. */
.gtp-ln{flex-wrap:nowrap}
.gtp-ln b{font-size:13px;line-height:1.25}
.gtp-soon{font-size:8.2px;padding:2px 7px;letter-spacing:.1px}
.gtp-tx small{font-size:10.5px;line-height:1.3;margin-top:2px}
.gtp-hero{min-height:104px}
.gtp-hero-in{padding:14px 15px}
.gtp-hero b{font-size:16.5px}
.gtp-top{margin-bottom:10px}
.gtp-h{margin:12px 2px 8px}
.gtp-note{margin-top:10px}

/* RFV2-C — nama negara panjang ("Amerika Serikat", "Arab Saudi") saling
   berdempet pada lebar 58px. Kolom dilebarkan dan teks dibungkus rapi. */
.gtp-negara{gap:10px}
.gtp-neg{width:66px}
.gtp-neg .nm{white-space:normal;word-break:normal;overflow-wrap:break-word;hyphens:auto}

/* RFV2-B — "Untuk Anda" / "Categories" terpotong elipsis pada kolom 85px.
   Padding & ukuran huruf tab dirapatkan supaya keempat label utuh. */
.jl-tab{padding:9px 2px;font-size:10.8px;letter-spacing:-.1px}

/* RFV2-C — lima negara harus muat dalam satu lebar layar 390px:
   5 x 62 + 4 x 8 = 342 <= 366 (lebar isi shell). */
.gtp-negara{gap:8px}
.gtp-neg{width:62px}
.gtp-neg .nm{font-size:9.2px}

/* RFV2-D — baris PAY memakai pola yang sama dengan Global & Travel:
   pil status di baris judul, subjudul memakai lebar penuh. */
.payhub-tx{flex:1;min-width:0}
.payhub-ln{display:flex;align-items:center;gap:8px;min-width:0;flex-wrap:nowrap}
.payhub-ln b{flex:0 1 auto;min-width:0}
.payhub-it{min-height:58px;padding:10px 12px;align-items:center}
.payhub-soon{font-size:8.2px;padding:2px 7px;letter-spacing:.1px}
.payhub-tx small{font-size:10.5px;line-height:1.3;margin-top:2px}

/* ===== RFV2-E — PERLAKUAN NONAKTIF: JELAS TAPI TERBACA =====
   Versi sebelumnya memakai opacity .55 + saturate(.35); pada layar
   Global & Travel empat dari lima baris jadi nyaris tidak terbaca,
   padahal master Owner menampilkannya dengan kontras normal dan pil
   "Segera Hadir" berwarna merah muda. Sinyal nonaktif dipindah ke
   PERMUKAAN dan PIL, bukan ke keterbacaan teks. */
.jl-row.is-off,.payhub-it.is-off,.gtp-it.is-off,.lp3-fam.is-off{
  opacity:1;filter:none;cursor:default;
  background:#f7f9fc;border-color:#e6ecf5;box-shadow:none;
}
.jl-row.is-off .jl-tx b,.payhub-it.is-off .payhub-tx b,
.gtp-it.is-off .gtp-tx b,.lp3-fam.is-off .lp3-fam-tx b{color:#5a6b83}
.jl-row.is-off .jl-tx small,.payhub-it.is-off .payhub-tx small,
.gtp-it.is-off .gtp-tx small,.lp3-fam.is-off .lp3-fam-tx small{color:#8593a8}
.jl-row.is-off .jl-ic,.payhub-it.is-off .payhub-ic,
.gtp-it.is-off .gtp-ic,.lp3-fam.is-off .lp3-fam-ic{filter:saturate(.55);opacity:.9}
/* pil "Segera Hadir" memakai warna master (merah muda), bukan abu-abu */
.jl-soon,.payhub-soon,.gtp-soon{background:#ffe9ec;color:#c8324a}

/* ===== RFV2-D — PAY sebagai LAPISAN LEMBAR di atas layar =====
   Master menampilkan PAY sebagai panel yang menutupi layar dengan
   latar gelap, bukan halaman putih penuh. Hanya presentasi. */
body.lp-pay .lp-shell-top{display:none!important}
body.lp-pay .mwrap{padding-top:14px!important;background:transparent!important}
body.lp-pay{background:#0f1e33!important}
.payhub-overlay{min-height:calc(100dvh - 120px);display:flex;flex-direction:column;justify-content:flex-end}
.payhub-sheet{margin:0 0 6px}

/* TX-2 — langkah pilih negara pada Pulsa Internasional */
.gtp-ic-flag{font-size:20px;line-height:1;background:#f2f6fc;border:1px solid var(--lp-line);color:inherit}
.gtp-kode{flex:none;background:#eef3fb;color:#4a5c78;font-size:9.5px;font-weight:800;
  padding:2px 7px;border-radius:999px;white-space:nowrap}

/* TX-1 — "Saldo Lama" pada Profil: catatan kecil, jelas bukan alat bayar. */
.iarow .pf-legacy{display:block;margin-top:2px;font-size:10px;font-weight:600;
  color:var(--lp-mut);line-height:1.3;text-align:right}

/* ACC-1 — Saldo Lama (baca-saja) di Bantuan. Bukan kartu dompet:
   tanpa tombol, tanpa CTA, angka sebagai keterangan di sisi kanan. */
.cs-legacy{cursor:default;background:#f7f9fc;border-color:#e6ecf5}
.cs-legacy .rm-help-copy b{color:#5a6b83}
.cs-legacy-nom{flex:none;font-size:13px;font-weight:800;color:#42506b;white-space:nowrap;margin-left:auto}

/* ========================================================================
   UI_CONSISTENCY_FIX_V2 — SINGLE CUSTOMER HEADER SOURCE (19 Sep 2026)
   Clean replacement: intentionally ONE override block only.
   Keeps every existing page style intact; only aligns the shared shell header.
   ======================================================================== */
.lp-shell-top{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  height:64px!important;
  min-height:64px!important;
  margin:0!important;
  padding:0 max(16px,calc((100% - 520px)/2))!important;
  left:0!important;
  right:0!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}
.lp-shell-brand{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
  line-height:1.2!important;
}
.lp-shell-mark{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
}
.lp-shell-name{
  font-size:18px!important;
  line-height:1.2!important;
  letter-spacing:-.4px!important;
  white-space:nowrap!important;
}
.lp-shell-act{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  flex:none!important;
}
.lp-shell-ic{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  flex:0 0 40px!important;
  padding:0!important;
  border-radius:13px!important;
}
.lp-shell-ic svg{width:20px!important;height:20px!important}
@media(max-width:360px){
  .lp-shell-top{padding-left:12px!important;padding-right:12px!important}
}