@php
    $apkEnabled = (bool) \App\Models\Setting::getValue('apk_enabled', false);
    $apkPath    = \App\Models\Setting::getValue('apk_file', '');
    $apkUrl     = $apkPath ? route('apk.download') : null;
    $apkVersion = \App\Models\Setting::getValue('apk_version', '');
    $siteName   = \App\Models\Setting::getValue('site_name', 'Kiostore');
    $siteLogo   = \App\Models\Setting::getValue('site_logo', '');
    $logoUrl    = $siteLogo ? asset('storage/' . $siteLogo) : null;
@endphp

<div id="install-banner" class="install-bar" role="region" aria-label="Pasang aplikasi">
    <span class="install-bar-icon" aria-hidden="true">
        @if($logoUrl)
            <img src="{{ $logoUrl }}" alt="">
        @else
            <i class="fa-solid fa-download"></i>
        @endif
    </span>
    <div class="install-bar-copy">
        <p class="install-bar-title">Pasang {{ $siteName }} sebagai aplikasi</p>
        <p class="install-bar-sub">Buka lebih cepat dari layar utama.</p>
    </div>
    <button id="install-banner-btn" class="install-bar-action" type="button">Pasang</button>
    <button id="install-banner-close" class="install-bar-close" type="button" aria-label="Tutup banner pasang aplikasi">
        <i class="fa-solid fa-xmark" aria-hidden="true"></i>
    </button>
</div>

<style>
    /* Banner di atas konten, bukan tombol melayang, supaya tidak menutupi
       tombol WhatsApp CS dan bottom nav di HP. */
    .install-bar{
        display:none;
        align-items:center;
        gap:10px;
        margin:0 0 12px;
        padding:10px 12px;
        background:var(--surface);
        border:1px solid var(--border2);
        border-radius:12px;
        font-family:'Inter',-apple-system,sans-serif;
    }
    .install-bar.show{display:flex}
    .install-bar-icon{
        width:36px;height:36px;border-radius:8px;flex-shrink:0;
        display:flex;align-items:center;justify-content:center;
        background:var(--elevated);color:var(--accent);
        overflow:hidden;font-size:15px;
    }
    .install-bar-icon img{width:100%;height:100%;object-fit:cover}
    .install-bar-copy{min-width:0;flex:1}
    .install-bar-title{
        margin:0;font-size:13px;font-weight:600;line-height:1.3;
        color:var(--text);
    }
    .install-bar-sub{
        margin:2px 0 0;font-size:12px;line-height:1.35;
        color:var(--text2);
    }
    .install-bar-action{
        flex-shrink:0;
        min-height:44px;padding:0 14px;border-radius:8px;
        background:var(--accent);color:#0c0f17;border:1px solid var(--accent-d);
        font-family:inherit;font-size:13px;font-weight:700;cursor:pointer;
    }
    .install-bar-action:hover{background:var(--accent-d)}
    .install-bar-close{
        flex-shrink:0;
        width:36px;height:36px;border-radius:8px;
        background:transparent;border:none;color:var(--text2);
        display:flex;align-items:center;justify-content:center;
        font-size:14px;cursor:pointer;
    }
    .install-bar-close:hover{background:var(--elevated);color:var(--text)}
    .install-bar-action:focus-visible,
    .install-bar-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
</style>

<script>
(function () {
    var deferredInstallPrompt = null;
    var nativePromptAvailable = false;
    var apkEnabled = @json($apkEnabled);
    var apkUrl     = @json($apkUrl);

    var fab       = document.getElementById('install-banner');
    var btn       = document.getElementById('install-banner-btn');
    var closeBtn  = document.getElementById('install-banner-close');
    if (!fab) return;

    function isStandalone() {
        return window.matchMedia('(display-mode: standalone)').matches
            || window.navigator.standalone === true;
    }

    function showFab(mode) {
        if (isStandalone() || sessionStorage.getItem('nk-install-hidden') === '1') return;
        fab.dataset.mode = mode;
        fab.classList.add('show');
    }

    window.addEventListener('beforeinstallprompt', function (e) {
        e.preventDefault();
        deferredInstallPrompt = e;
        nativePromptAvailable = true;
        showFab('native');
    });

    btn.addEventListener('click', async function () {
        if (fab.dataset.mode === 'native' && deferredInstallPrompt) {
            deferredInstallPrompt.prompt();
            var choice = await deferredInstallPrompt.userChoice;
            deferredInstallPrompt = null;
            if (choice.outcome === 'accepted') fab.classList.remove('show');
        } else if (apkUrl) {
            window.location.href = apkUrl;
        }
    });

    closeBtn.addEventListener('click', function (e) {
        e.stopPropagation();
        fab.classList.remove('show');
        // Cuma disembunyikan untuk sesi ini, muncul lagi kalau buka lagi nanti
        sessionStorage.setItem('nk-install-hidden', '1');
    });

    window.addEventListener('appinstalled', function () {
        fab.classList.remove('show');
    });

    // Kalau browser tidak dukung prompt otomatis, fallback ke tombol download APK manual
    setTimeout(function () {
        if (!nativePromptAvailable && apkEnabled && apkUrl) {
            showFab('download');
        }
    }, 1500);
})();
</script>