/* =========================================================================
 * PWA / MODE APLIKASI -- polesan sentuh biar terasa seperti aplikasi HP.
 *
 *  - Blok "GLOBAL SENTUH" aman untuk semua perangkat; desktop tak terpengaruh.
 *  - Blok ".pwa-standalone ..." HANYA aktif saat aplikasi dibuka dari ikon
 *    home screen (display-mode: standalone). Di browser biasa tetap normal.
 * ========================================================================= */

/* ---- Global: hilangkan kilau tap biru & auto-zoom teks iOS ---- */
* {
    -webkit-tap-highlight-color: transparent;
}
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* Matikan double-tap-to-zoom HANYA di elemen yang memang di-tap
   (tombol/link/field). JANGAN taruh touch-action di <html>/<body> --
   di sebagian Android/WebView itu ikut mem-block scroll dokumen.
   Pinch-zoom halaman sudah dimatikan lewat viewport user-scalable=no. */
a,
button,
.btn,
.nav-link,
.page-link,
.dropdown-item,
[role="button"],
label,
input,
select,
textarea {
    touch-action: manipulation;
}

/* ---- Hanya saat berjalan sebagai aplikasi terpasang ---- */

/* Matikan pull-to-refresh & efek pantul saat scroll mentok.
   overscroll-behavior HANYA di <body> (bentuk kanonik yang dipakai
   PWA besar) -- TIDAK mempengaruhi kemampuan scroll, hanya menghentikan
   scroll-chaining & bounce di batas. */
.pwa-standalone body {
    overscroll-behavior-y: none;
}

/* "Chrome" aplikasi (topbar, menu, tombol, footer) tidak bisa diseleksi
   atau ditekan-lama -- persis aplikasi native. */
.pwa-standalone .app-topbar,
.pwa-standalone .sidebar,
.pwa-standalone .app-breadcrumb,
.pwa-standalone .app-footer,
.pwa-standalone .btn,
.pwa-standalone .btn-sidebar-toggle,
.pwa-standalone .topbar-icon-btn,
.pwa-standalone .app-user-avatar,
.pwa-standalone .nav-link,
.pwa-standalone .page-link,
.pwa-standalone .dropdown-item {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
}

/* Isi halaman tetap bisa diseleksi / disalin (angka, tabel, catatan, dsb). */
.pwa-standalone .main-content,
.pwa-standalone input,
.pwa-standalone textarea,
.pwa-standalone [contenteditable] {
    -webkit-user-select: text;
    user-select: text;
}

/* Scroll di dalam kontainer terasa "melayang" seperti native (iOS lama). */
.pwa-standalone .table-responsive,
.pwa-standalone .modal-body,
.pwa-standalone .sidebar {
    -webkit-overflow-scrolling: touch;
}

/* =========================================================================
 * Tombol "Pasang Aplikasi" mengambang (Android/Chrome; muncul lewat pwa.js)
 * ========================================================================= */
/* Bulat & kompak di pojok kanan-bawah (pola FAB standar), BUKAN pil lebar
   di tengah-bawah. Pil lebar dengan teks "Pasang Aplikasi" selalu selebar
   ~1 kartu KPI penuh -- di manapun ditaruh (tengah atau kanan) tetap
   menimpa teks kartu di baliknya. Ikon bulat 48px jauh lebih kecil,
   paling banter menutupi sudut 1 kartu saja & terbaca sebagai tombol
   mengambang yang disengaja (bukan elemen nyasar/rusak). Label teks
   tetap ada untuk pembaca layar (lihat .pwa-install-label). */
.pwa-install-fab {
    position: fixed;
    right: max(1rem, env(safe-area-inset-right, 0px));
    bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    z-index: 1080;
    width: 48px;
    height: 48px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: var(--brand-700, #1E3C72);
    color: #fff;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .3);
    cursor: pointer;
    animation: pwaFabIn .25s ease;
}
.pwa-install-fab i {
    font-size: 1.2rem;
}

/* Label "Pasang Aplikasi" -- disembunyikan secara visual (bukan display:none
   supaya tetap terbaca pembaca layar / accessibility tree). aria-label di
   tombolnya sendiri (diset pwa.js) jadi cadangan kalau butuh. */
.pwa-install-label {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Badge "x" kecil menempel di sudut lingkaran, bukan menyatu inline
   dengan teks (karena teksnya sudah disembunyikan). */
.pwa-install-fab .pwa-install-x {
    position: absolute;
    top: -4px;
    right: -4px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    color: var(--brand-700, #1E3C72);
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .25);
}
@keyframes pwaFabIn {
    from { opacity: 0; transform: translateY(12px) scale(.85); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* Kalau sudah jadi aplikasi terpasang, tombol tak perlu tampil. */
.pwa-standalone .pwa-install-fab {
    display: none !important;
}

/* Tombol ini "mengambang" di atas konten (position: fixed) -- tanpa ruang
   ekstra di bawah, ia menimpa baris terakhir halaman (mis. kartu KPI
   dashboard). Beri jarak aman otomatis SELAMA tombolnya ada; begitu
   ditutup/terpasang (elemen dihapus dari DOM oleh pwa.js) jarak ini
   otomatis hilang lagi. */
body:has(.pwa-install-fab) {
    padding-bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
}

@media print {
    .pwa-install-fab {
        display: none !important;
    }
}