@extends('layouts.app')

@section('immersive', '1')
@section('pageTitle', 'Kebijakan Privasi')
@section('pageDescription', 'Informasi tentang data yang digunakan Kiostore untuk akun, pesanan, pembayaran, dan dukungan pelanggan.')

@push('styles')
<style>
/* Ruang atas pengganti topbar yang disembunyikan */
.sp-wrap{
    max-width:760px;margin:0 auto;
    padding:env(safe-area-inset-top,0px) 0 calc(env(safe-area-inset-bottom,0px) + 32px);
}
.sp-topbar{
    display:flex;align-items:center;justify-content:space-between;
    padding:12px 16px;
    border-bottom:1px solid var(--border);
    margin-bottom:4px;
}
.sp-back{
    display:inline-flex;align-items:center;gap:6px;min-height:44px;
    color:var(--text2);font-size:13px;font-weight:600;text-decoration:none;
    transition:color var(--transition);
}
.sp-back:hover{color:var(--text)}
.sp-logo{
    display:inline-flex;align-items:center;gap:7px;
    font-size:14px;font-weight:700;color:var(--text);text-decoration:none;
}
.sp-logo-mark{
    width:26px;height:26px;border-radius:7px;
    background:var(--accent);
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.sp-content{padding:0 16px}
.sp-h1{font-size:22px;font-weight:700;letter-spacing:-.3px;color:var(--text);margin-bottom:6px;line-height:1.25}
.sp-lead{font-size:14px;color:var(--text2);line-height:1.65;margin-bottom:24px}
.sp-section{margin-bottom:20px}
.sp-h2{font-size:15px;font-weight:700;color:var(--text);margin-bottom:6px}
.sp-p{font-size:14px;color:var(--text2);line-height:1.65;margin-bottom:6px}
.sp-link{color:var(--accent);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.sp-link:hover{opacity:.8}
.sp-footer{
    margin-top:32px;padding:16px 16px calc(env(safe-area-inset-bottom,0px) + 16px);
    border-top:1px solid var(--border);
    display:flex;flex-wrap:wrap;gap:12px 20px;
    font-size:12px;color:var(--muted);
}
.sp-footer a{color:var(--muted);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.sp-footer a:hover{color:var(--text2)}
</style>
@endpush

@section('content')
@php
    $siteName    = \App\Models\Setting::getValue('site_name', config('app.name', 'Kiostore'));
    $siteLogo    = \App\Models\Setting::getValue('site_logo');
    $operatorName= trim(\App\Models\Setting::getValue('operator_name', ''));
    $contactEmail= trim(\App\Models\Setting::getValue('contact_email', ''));
    $contactWhatsappDisplay = trim(\App\Models\Setting::getValue('cs_whatsapp', ''));
    $contactWhatsapp = preg_replace('/[^0-9]/', '', $contactWhatsappDisplay);
@endphp

<div class="sp-wrap">
    {{-- Bar atas: tombol Kembali (kiri) + logo K (kanan) --}}
    <div class="sp-topbar">
        <a href="{{ url()->previous() !== url()->current() ? url()->previous() : route('home') }}"
           class="sp-back" aria-label="Kembali">
            <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor"
                 stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <path d="M19 12H5M12 5l-7 7 7 7"/>
            </svg>
            Kembali
        </a>
        <a href="{{ route('home') }}" class="sp-logo" aria-label="{{ $siteName }} — Beranda">
            @if($siteLogo)
                <img src="{{ asset('storage/'.$siteLogo) }}" alt="{{ $siteName }}"
                     style="height:24px;width:auto;object-fit:contain;max-width:100px">
            @else
                <div class="sp-logo-mark" aria-hidden="true">
                    <svg width="13" height="13" viewBox="0 0 16 16" fill="none">
                        <rect x="2" y="1" width="8" height="14" rx="2" stroke="white" stroke-width="1.6"/>
                        <circle cx="6" cy="12" r="1" fill="white"/>
                        <path d="M11 5h3M11 8h4M11 11h3" stroke="white" stroke-width="1.5" stroke-linecap="round"/>
                    </svg>
                </div>
                <span>{{ $siteName }}</span>
            @endif
        </a>
    </div>

    <div class="sp-content">
        <h1 class="sp-h1">Kebijakan Privasi</h1>
        <p class="sp-lead">Halaman ini menjelaskan kategori data yang digunakan saat kamu mengakses {{ $siteName }} dan tujuan penggunaannya.</p>

        <div class="sp-section" aria-labelledby="privacy-data-title">
            <h2 id="privacy-data-title" class="sp-h2">Data yang digunakan</h2>
            <p class="sp-p">Bergantung pada fitur yang kamu gunakan, data dapat mencakup informasi akun seperti nama dan email, rincian tujuan pesanan yang kamu masukkan, informasi transaksi, serta data teknis yang diperlukan untuk sesi, keamanan, dan fungsi situs.</p>
        </div>

        <div class="sp-section" aria-labelledby="privacy-use-title">
            <h2 id="privacy-use-title" class="sp-h2">Penggunaan dan pembagian data</h2>
            <p class="sp-p">Data digunakan untuk mengelola akun, memproses pesanan dan pembayaran, menampilkan riwayat atau status transaksi, serta menanggapi permintaan bantuan. Untuk memenuhi pesanan, data yang diperlukan dapat diteruskan kepada penyedia produk digital atau penyedia pembayaran terkait.</p>
        </div>

        <div class="sp-section" aria-labelledby="privacy-storage-title">
            <h2 id="privacy-storage-title" class="sp-h2">Penyimpanan di perangkat</h2>
            <p class="sp-p">Situs menggunakan penyimpanan browser untuk fungsi seperti menjaga sesi dan mengingat pilihan tema. Jika kamu mengaktifkan notifikasi, izin dan langganan notifikasi dikelola melalui browser atau perangkatmu.</p>
        </div>

        <div class="sp-section" aria-labelledby="privacy-request-title">
            <h2 id="privacy-request-title" class="sp-h2">Pertanyaan tentang data</h2>
            <p class="sp-p">
                Untuk pertanyaan atau permintaan terkait data, hubungi kami melalui halaman
                <a class="sp-link" href="{{ route('contact') }}">Kontak</a>.@if($operatorName) Pengelola: {{ $operatorName }}.@endif
                @if($contactEmail)
                    Email: <a class="sp-link" href="mailto:{{ $contactEmail }}">{{ $contactEmail }}</a>.
                @endif
                @if($contactWhatsapp)
                    WhatsApp: <a class="sp-link" href="https://wa.me/{{ $contactWhatsapp }}" target="_blank" rel="noopener noreferrer">{{ $contactWhatsappDisplay }}</a>.
                @endif
            </p>
        </div>

        <footer class="sp-footer" aria-label="Navigasi situs">
            <span>© {{ date('Y') }} {{ $siteName }}</span>
            <a href="{{ route('home') }}">Beranda</a>
            <a href="{{ route('terms') }}">Syarat &amp; Ketentuan</a>
            <a href="{{ route('contact') }}">Kontak</a>
        </footer>
    </div>
</div>
@endsection