@extends('layouts.landing-page')

@section('content')
    <!-- Explore Navigation -->
    <div class="mb-8">
        <h1 class="text-3xl font-bold mb-2">Kebijakan Privasi</h1>
        <p class="text-gray-300 text-base">
            Kebijakan privasi ini menjelaskan bagaimana kami mengumpulkan, menggunakan, menyimpan, dan melindungi informasi
            pribadi Anda
            saat menggunakan layanan kami. Dengan menggunakan layanan ini, Anda dianggap telah membaca, memahami, dan
            menyetujui
            kebijakan yang berlaku.
        </p>

    </div>

    <section class="mb-11">

        <h2 class="text-xl font-bold mb-4">Kebijakan Privasi</h2>

        <div>
            <h3 class="text-lg font-semibold mb-2">1. Informasi yang Kami Kumpulkan</h3>
            <p>Kami mengumpulkan informasi pribadi saat Anda:</p>
            <ul class="list-disc list-inside ms-4">
                <li>Mendaftar sebagai artist, composer, atau cover creator</li>
                <li>Membeli lisensi lagu</li>
                <li>Mengisi formulir atau menggunakan fitur di website kami</li>
            </ul>
            <p class="mt-2">Informasi yang dapat kami kumpulkan meliputi:</p>
            <ul class="list-disc list-inside ms-4">
                <li>Nama lengkap</li>
                <li>Alamat email</li>
                <li>Nomor telepon</li>
                <li>Informasi pembayaran (melalui pihak ketiga)</li>
                <li>Data aktivitas penggunaan situs</li>
            </ul>
        </div>

        <div>
            <h3 class="text-lg font-semibold mb-2">2. Penggunaan Informasi</h3>
            <p>Informasi pribadi Anda digunakan untuk:</p>
            <ul class="list-disc list-inside ms-4">
                <li>Menyediakan dan meningkatkan layanan kami</li>
                <li>Memproses pembayaran dan transaksi lisensi</li>
                <li>Mengirim notifikasi dan pembaruan terkait akun dan layanan</li>
                <li>Meningkatkan pengalaman pengguna di situs</li>
            </ul>
        </div>

        <div>
            <h3 class="text-lg font-semibold mb-2">3. Keamanan dan Penyimpanan Data</h3>
            <p>
                Kami menyimpan informasi Anda di server yang aman dan menerapkan standar keamanan data.
                Hanya pihak yang berkepentingan yang memiliki akses terbatas terhadap data tersebut.
            </p>
        </div>

        <div>
            <h3 class="text-lg font-semibold mb-2">4. Pembagian Informasi</h3>
            <p>Kami tidak menjual atau menyewakan data pribadi kepada pihak ketiga. Data hanya dibagikan dengan:</p>
            <ul class="list-disc list-inside ms-4">
                <li>Mitra pembayaran (seperti Midtrans, Xendit, dll.)</li>
                <li>Penyedia infrastruktur dan hosting</li>
                <li>Otoritas hukum apabila diwajibkan secara hukum</li>
            </ul>
        </div>

        <div>
            <h3 class="text-lg font-semibold mb-2">5. Hak Anda</h3>
            <p>Anda berhak untuk:</p>
            <ul class="list-disc list-inside ms-4">
                <li>Melihat, memperbarui, atau menghapus informasi pribadi Anda</li>
                <li>Menarik kembali persetujuan penggunaan data</li>
                <li>Menghapus akun secara permanen</li>
            </ul>
        </div>

        <div>
            <h3 class="text-lg font-semibold mb-2">6. Perubahan Kebijakan</h3>
            <p>
                Kebijakan ini dapat diperbarui sewaktu-waktu. Perubahan akan diumumkan di situs resmi kami.
            </p>
        </div>

        <div>
            <p class="mt-4">
                Untuk pertanyaan lebih lanjut, silakan hubungi:
                <a href="mailto:admin@playlistmusic.co.id" class="text-red-600 font-medium">admin@playlistmusic.co.id</a>
            </p>
        </div>

    </section>
@endsection

@section('scripts')
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            // Category pill click
            const categoryPills = document.querySelectorAll('.category-pill');
            categoryPills.forEach(pill => {
                pill.addEventListener('click', function() {
                    categoryPills.forEach(p => p.classList.remove('active'));
                    this.classList.add('active');

                    // Here you would filter content based on the selected category
                });
            });

            // Toggle menu function
            window.toggleMenu = function(menuId) {
                const menu = document.getElementById(menuId);
                if (menu) {
                    menu.classList.toggle('hidden');

                    // Close when clicking outside
                    const closeMenu = function(e) {
                        if (!menu.contains(e.target) && !e.target.closest(
                                `[onclick="toggleMenu('${menuId}')"]`)) {
                            menu.classList.add('hidden');
                            document.removeEventListener('click', closeMenu);
                        }
                    };

                    document.addEventListener('click', closeMenu);
                }
            };

            // Add animation delay to grid items
            document.querySelectorAll('.scroll-item').forEach((item, index) => {
                item.style.setProperty('--index', index);
            });

            // Smooth drag scrolling for horizontal containers
            const sliders = document.querySelectorAll('.scroll-container');

            sliders.forEach(container => {
                container.addEventListener('wheel', (e) => {
                    if (e.deltaY !== 0) {
                        e.preventDefault();
                        container.scrollLeft += e.deltaY;
                    }
                });
            });

            // Initialize AOS animation library if it exists
            if (typeof AOS !== 'undefined') {
                AOS.init({
                    duration: 800,
                    once: true
                });
            }
        });
    </script>
    <script>
        document.addEventListener('DOMContentLoaded', function() {
            const elMain = document.getElementById('mainContent');
            elMain.classList.add('w-full');
        });
    </script>
@endsection