    <style>
        /* FIX: Pastikan footer tidak keluar dari layar */
        .bottom-nav {
            box-sizing: border-box;
            width: 103vw;
            margin-left: calc(-52vw + 50%);
            padding: 0;
            display: flex;
            position: fixed;
            bottom: 0;
            left: 0;
            right: 0;
        }

        .nav-item {
            box-sizing: border-box;
            flex: 1;
        }
    </style>

    <nav class="bottom-nav">
        <a href="index.php" class="nav-item <?php echo $current_page === 'index' ? 'active' : ''; ?>">
            <span class="icon">🏠</span>
            <span class="label">Beranda</span>
        </a>
        <a href="riwayat.php" class="nav-item <?php echo $current_page === 'riwayat' ? 'active' : ''; ?>">
            <span class="icon">📝</span>
            <span class="label">Riwayat</span>
        </a>
                <a href="totalsaldo.php" class="nav-item <?php echo $current_page === 'pengingat' ? 'active' : ''; ?>">
            <span class="icon">💰</span>
            <span class="label">Saldo</span>
        </a>
        <a href="ringkasan.php" class="nav-item <?php echo $current_page === 'ringkasan' ? 'active' : ''; ?>">
            <span class="icon">📊</span>
            <span class="label">Grafik</span>
        </a>
        <a href="ai.php" class="nav-item <?php echo $current_page === 'ai' ? 'active' : ''; ?>">
            <span class="icon">🤖</span>
            <span class="label">AI</span>
        </a>
        <a href="pengaturan.php" class="nav-item <?php echo $current_page === 'pengaturan' ? 'active' : ''; ?>">
            <span class="icon">⚙️</span>
            <span class="label">Lainnya</span>
        </a>
    </nav>

    <script>
        function logout() {
            if (confirm('Keluar dari aplikasi?')) {
                window.location.href = 'login.php?logout=1';
            }
        }

        function showLoading() {
            document.getElementById('loading').classList.add('show');
        }

        function hideLoading() {
            document.getElementById('loading').classList.remove('show');
        }

        function formatCurrency(amount) {
            return 'Rp ' + new Intl.NumberFormat('id-ID').format(amount);
        }

        function formatDate(date) {
            const d = new Date(date);
            const days = ['Minggu', 'Senin', 'Selasa', 'Rabu', 'Kamis', 'Jumat', 'Sabtu'];
            const months = ['Jan', 'Feb', 'Mar', 'Apr', 'Mei', 'Jun', 'Jul', 'Agu', 'Sep', 'Okt', 'Nov', 'Des'];
            return `${days[d.getDay()]}, ${d.getDate()} ${months[d.getMonth()]} ${d.getFullYear()} ${d.toLocaleTimeString('id-ID', {hour: '2-digit', minute: '2-digit'})}`;
        }

        // Register Service Worker
        if ('serviceWorker' in navigator) {
            navigator.serviceWorker.register('service-worker.js');
        }
    </script>
</body>
</html>
