/* ===== TELEBUILD fix2.css (dimuat paling akhir) =====
   1. margin samping nol di semua halaman (tidak ke tengah / tidak ada batas lebar)
   2. ikon selalu tepat di tengah tombol
   3. pindah tab & layar tanpa delay (tanpa clip-path, tanpa animasi berat)
   4. bar balas status di bawah
   5. banner profil transparan polos */

/* ---------- 1. margin samping kecil (8px), tidak ke tengah, tidak nempel layar ---------- */
.tb-scr,.tb-pad,.ch-list,.gp .gp-body,.gp.chat .ch-list{max-width:none!important;margin-left:0!important;margin-right:0!important}
.tb-scr,.tb-pad{width:100%;padding-left:8px!important;padding-right:8px!important}
.gp .gp-body{padding-left:8px!important;padding-right:8px!important}
.gp.chat .gp-body{padding-left:0!important;padding-right:0!important}
.gp-body>.tb-pad{width:100%!important;margin:0!important}
.gp.chat .ch-list,.ch-list{padding-left:8px!important;padding-right:8px!important}
.gp.chat .ch-m,.ch-m{max-width:86%}
.tb-sr{margin:0 0 10px!important}
.tb-list,.tb-arv .tb-list{gap:8px}
.tb-sec,.tb-sec2,.tb-sub2{margin-left:2px!important;margin-right:2px!important}
.tb-stories,.tb-chips{padding-left:2px;padding-right:2px}
.tb-rgrid,.tb-bgrid{padding:0}
@media (min-width:760px){.tbm{max-width:none!important;left:0!important;right:0!important;translate:none!important;border-left:0!important;border-right:0!important}}

/* Terminal/menu lama tidak boleh tembus di belakang Messenger (terutama saat ada background) */
html.tb-on #app{visibility:hidden!important}
html.tb-on.tb-hasbg #tbm{background:transparent}

/* ---------- 2. ikon tepat di tengah ---------- */
button:has(>svg:only-child),
.gp-b,.gp-r>button,.tb-nic,.tb-pic,.tb-fab,.tb-ibtn,.tb-rnd,.tb-rb2,.tb-vb2,.tb-qx,.tb-archic,.tb-upic,.tb-cb,.tb-send,.tb-sendfab,.tb-pal,.tb-playov,.tb-ow,.tb-del,.tb-up,
.ch-send,.ch-at,.pro-rc,.pro-rs,.pc-b,.gp-ib,.tb-micbtn,.tb-sp,.tb-rxa{display:inline-grid;place-items:center;align-content:center;justify-content:center;padding:0;line-height:0;text-align:center}
.tb-fab,.tb-ibtn,.tb-rnd,.tb-rb2,.tb-vb2,.ch-send,.ch-at,.gp-ib,.tb-micbtn{display:grid}
button>svg:only-child,.tb-nic>svg,.tb-pic>svg,.tb-fab>svg,.tb-ibtn>svg,.gp-b>svg,.gp-ib>svg,.ch-send>svg,.ch-at>svg,.tb-rb2>svg,.tb-rnd>svg,.tb-vb2>svg,.tb-micbtn>svg{display:block;margin:0!important;flex:none;position:static}
.tb-nic{position:relative}
.tb-nic .tb-bdg{position:absolute}
.tb-fab{padding:0!important;margin:0}
.tb-sp{position:absolute}
.tb-pic{width:40px;height:40px;flex:none}
.tb-pi{display:flex;align-items:center}

/* ---------- 3. tanpa delay ---------- */
.tb-pg.slide,.tb-pg.on{animation:none!important}
.gp{clip-path:none!important;opacity:0!important;transform:translate3d(28px,0,0);transition:transform .2s cubic-bezier(.22,.9,.3,1),opacity .16s ease-out!important;will-change:auto!important;backface-visibility:visible!important;background-color:var(--paper,#fff1d6)}
.gp.in,.gp.in.done{opacity:1!important;transform:none}
.gp.out{opacity:0!important;transform:translate3d(28px,0,0);transition-duration:.14s,.12s!important}
html.tb-hasbg .gp:not(.tb-sv):not(.tb-cmx):not(.chat){background-image:var(--tb-appbg,none);background-size:cover;background-position:center}
.ch-m{animation:none!important}
.tb-sheet,.tb-dlg,.tb-fab,.tb-pop{will-change:auto!important;backface-visibility:visible!important}
.tb-scrim{transition-duration:.12s!important}
.tb-sheet{transition-duration:.16s!important}
.tb-nav button,.tb-pi,.tb-row{transition:none!important}
body.noanim .gp{transition:none!important}

/* ---------- 4. status: bar balas selalu di bawah ---------- */
.tb-vw .tb-rep{position:absolute!important;left:10px;right:10px;top:auto!important;bottom:calc(env(safe-area-inset-bottom) + 10px)!important;z-index:6}
.tb-vw .tb-act{bottom:calc(env(safe-area-inset-bottom) + 76px)!important}
.tb-vw .tb-own{position:absolute!important;bottom:calc(env(safe-area-inset-bottom) + 12px)!important;top:auto!important}
.tb-vw,.tb-stage{touch-action:none!important}
.tb-vl{min-height:96px}
.tb-vl .tb-vsk{display:flex;align-items:center;gap:12px;padding:12px 4px;opacity:.5}
.tb-vl .tb-vsk i{display:block;width:44px;height:44px;border-radius:50%;background:rgba(127,127,127,.35)}
.tb-vl .tb-vsk b{display:block;height:12px;width:50%;border-radius:6px;background:rgba(127,127,127,.35)}

/* ---------- 5. banner profil (transparan polos, diunggah sendiri) ---------- */
.tb-pbn{position:relative;display:block;width:100%;height:132px;margin:0 0 -52px;padding:0;border:0;border-radius:0;background:transparent;overflow:hidden;color:inherit}
.tb-pbn img,.tb-pbn video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.tb-pbn .tb-pbc{position:absolute;right:10px;top:10px;z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:rgba(127,127,127,.28);color:inherit;display:grid;place-items:center;padding:0;line-height:0}
.tb-pbn .tb-pbc svg{display:block;margin:0}
.tb-pcard{padding-top:0!important;overflow:hidden}
.tb-pcard .tb-pav2{position:relative;z-index:1}

/* kartu profil penuh lebar: banner menempel kiri-kanan layar */
.tb-pcard{margin-left:-8px!important;margin-right:-8px!important;border-left:0!important;border-right:0!important;border-radius:0!important;box-shadow:none!important}
.tb-pbn{margin-bottom:-52px}

/* sheet Ubah profil */
.tb-sh3{margin:0 0 12px;font-size:18px;text-align:center}
.tb-eb{position:relative;height:112px;margin:0 -18px;overflow:hidden;background:transparent;border-bottom:1px dashed rgba(127,127,127,.4)}
.tb-eb img,.tb-eb video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tb-eb .tb-pbc{position:absolute;right:10px;top:10px;z-index:2;width:38px;height:38px;border:0;border-radius:50%;background:rgba(127,127,127,.32);color:inherit;display:grid;place-items:center;padding:0;line-height:0}
.tb-eav{position:relative;width:96px;margin:-40px auto 14px;z-index:1}
.tb-eav .gl-av{margin:0 auto}
.tb-eav .tb-pbc.av{position:absolute;right:-4px;bottom:-4px;width:34px;height:34px;border:2px solid var(--bd,#111);border-radius:50%;background:var(--acc,#ffd83d);color:#111;display:grid;place-items:center;padding:0;line-height:0}
.tb-ebs{width:100%;margin-top:6px}

/* ===== status: jarak dari tepi layar ===== */
.tb-sv .tb-bars{left:14px;right:14px}
.tb-sv .tb-vh{padding-left:16px;padding-right:16px}
.tb-vw .tb-rep{left:16px!important;right:16px!important}
.tb-vw .tb-act{right:18px!important}
.tb-vw .tb-own{left:20px!important;right:20px!important}
.cx-top{padding-left:16px!important;padding-right:16px!important}
.cx-bot{padding-left:16px!important;padding-right:16px!important}
.cx-stage>small{right:20px}
.cx-stage textarea{padding:0 20px}
.cx-aud{padding:0 24px}
.cx-modes{padding:0 16px}

/* ===== preview di kartu status (foto / video / audio) ===== */
.tb-sprev.tb-th{padding:0;background-size:cover;background-position:center;background-repeat:no-repeat;opacity:1;display:block}
.tb-sprev .tb-pb{position:absolute;right:8px;bottom:44px;width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.5);display:grid;place-items:center;color:#fff;font-style:normal;line-height:0}
.tb-sprev .tb-pb svg{display:block;margin:0}
.tb-sprev.tb-au{background:linear-gradient(160deg,#2b6a5a,#143a33);padding:0 0 30px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;opacity:1}
.tb-wv{display:flex;align-items:center;gap:4px;height:46px}
.tb-wv s{display:block;width:5px;border-radius:3px;background:rgba(255,255,255,.85);text-decoration:none}
.tb-wv s:nth-child(1){height:14px}.tb-wv s:nth-child(2){height:30px}.tb-wv s:nth-child(3){height:20px}.tb-wv s:nth-child(4){height:44px}.tb-wv s:nth-child(5){height:24px}.tb-wv s:nth-child(6){height:34px}.tb-wv s:nth-child(7){height:16px}

/* ===== pencarian baru: tanpa toolbar, lembut, beranimasi ===== */
.tbm.tb-chat.tb-noh .tb-scr{padding-top:calc(env(safe-area-inset-top) + 12px)!important}
.tb-sr{position:relative;height:48px;padding:0 6px 0 16px;gap:10px;border:0!important;border-radius:999px!important;box-shadow:none!important;background:rgba(127,127,127,.16)!important;transition:background .2s ease,box-shadow .2s ease,transform .2s ease;animation:tbSrIn .28s cubic-bezier(.22,.9,.3,1) both}
.tb-sr svg{transition:transform .25s cubic-bezier(.34,1.4,.64,1),color .2s;opacity:.7}
.tb-sr:focus-within{background:var(--card,#fff)!important;box-shadow:0 0 0 2px var(--tbc,#ff4458),0 8px 22px rgba(0,0,0,.18)!important;transform:translateY(1px)}
.tb-sr:focus-within svg{transform:scale(1.12) rotate(-8deg);color:var(--tbc,#ff4458);opacity:1}
.tb-sr input{font-size:16px}
.tb-sr .tb-qx{width:36px;height:36px;border-radius:50%;background:rgba(127,127,127,.22);border:0;transition:opacity .15s,transform .2s}
.tb-sr .tb-qx.hide{display:grid!important;opacity:0;transform:scale(.6);pointer-events:none}
@keyframes tbSrIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
body.noanim .tb-sr{animation:none}

/* ===== dialog: flat, tanpa border tebal & bayangan keras ===== */
html body .tb-dlg{border:0!important;border-radius:24px!important;box-shadow:0 16px 48px rgba(0,0,0,.38)!important;padding:22px 20px 14px!important;background:var(--sheet,#fff)!important;color:var(--ink,#111)!important}
html body .tb-dlg h3{font-size:19px;margin:0 0 8px;letter-spacing:.02em}
html body .tb-dlg p{opacity:.8;line-height:1.55;margin:0 0 14px}
html body .tb-dlg .tb-row2{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
html body .tb-dlg .tb-btn{min-height:44px;flex:none;min-width:88px;padding:0 18px;border:0!important;box-shadow:none!important;border-radius:999px!important;font-weight:700}
html body .tb-dlg .tb-btn.main,html body .tb-dlg .tb-btn.danger{background:var(--tbc,#ff4458)!important;color:#fff!important}
html body .tb-dlg .tb-btn.ghost{background:transparent!important;color:var(--tbc,#ff4458)!important}
html body .tb-dlg .tb-in{border:0!important;border-bottom:2px solid rgba(127,127,127,.5)!important;border-radius:0!important;background:transparent!important;padding-left:2px}
html body .tb-dlg .tb-in:focus{border-bottom-color:var(--tbc,#ff4458)!important}
html body .tb-dlw .tb-dlg{transition:transform .2s cubic-bezier(.22,.9,.3,1),opacity .15s!important}

/* ===== tombol: flat, tanpa neobrutalism ===== */
html body .tbm .tb-btn,html body .tb-shw .tb-btn,html body .gp .tb-btn{border:0!important;box-shadow:none!important;background:rgba(127,127,127,.2);color:inherit;font-weight:700;transition:transform .12s ease,filter .12s ease}
html body .tbm .tb-btn.main,html body .tb-shw .tb-btn.main,html body .gp .tb-btn.main,html body .tb-btn.danger{background:var(--tbc,#ff4458)!important;color:#fff!important}
html body .tb-btn:active{transform:scale(.97);filter:brightness(.92)}
html body .tb-chips button{border:0!important;box-shadow:none!important;background:rgba(127,127,127,.18)!important;transition:background .15s,color .15s,transform .12s}
html body .tb-chips button.on{background:var(--tbc,#ff4458)!important;color:#fff!important}
html body .tb-chips button:active{transform:scale(.95)}
html body .tb-fab{border:0!important;border-radius:20px!important;box-shadow:0 8px 20px rgba(0,0,0,.35)!important}
html body .tb-sheet{border-top:0!important;box-shadow:0 -10px 40px rgba(0,0,0,.3)}
html body .tb-vst,html body .tb-jel,html body .tb-ebs{border:0!important;box-shadow:none!important}
html body .gl-btn,html body .gp .gl-btn{border:0!important;box-shadow:none!important}
html body .gl-btn:active{transform:scale(.97)}