@{
    ViewData["Title"] = "Informasi Kontak";
}

<!-- Toast Notification -->
<div id="successToast" class="fixed top-20 right-6 z-[9999] hidden">
    <div class="alert bg-green-50 border border-green-200 shadow-lg flex items-start gap-3 pr-12 min-w-[320px]">
        <div class="flex-shrink-0">
            <div class="w-5 h-5 rounded-full bg-green-500 flex items-center justify-center">
                <span class="icon text-white text-xs">check</span>
            </div>
        </div>
        <div class="flex-1">
            <h3 class="font-semibold text-gray-900">Konten berhasil diubah!</h3>
            <p class="text-sm text-gray-600">Berhasil! Konten telah berhasil diubah.</p>
        </div>
        <button onclick="closeToast()" class="absolute top-3 right-3 text-gray-400 hover:text-gray-600">
            <span class="icon text-lg">close</span>
        </button>
    </div>
</div>

<div class="breadcrumbs text-sm mb-6">
    <ul>
        <li class="text-gray-500"><a>CMS</a></li>
        <li>Informasi Kontak</li>
    </ul>
</div>

<div class="flex justify-between items-center mb-6">
    <h2 class="text-2xl font-semibold">Informasi Kontak</h2>
    <a href="/InformasiKontak/Edit" class="btn btn-primary btn-sm rounded-full px-6">
        <span class="icon text-base mr-1">edit</span>
        Edit
    </a>
</div>

<!-- Card Informasi Kontak -->
<div class="bg-white rounded-xl p-8 shadow-sm">
    <div class="space-y-6">
        <!-- Nama Kantor -->
        <div>
            <label class="text-xs text-gray-500 font-medium">Nama Kantor</label>
            <p class="text-sm text-gray-900 mt-1">BPS-RW Mawar Indah</p>
        </div>

        <!-- Alamat Kantor -->
        <div>
            <label class="text-xs text-gray-500 font-medium">Alamat Kantor</label>
            <p class="text-sm text-gray-900 mt-1">Jl. Medan-Ungu No. 12, Jakarta</p>
        </div>

        <!-- Email -->
        <div>
            <label class="text-xs text-gray-500 font-medium">Email</label>
            <p class="text-sm text-gray-900 mt-1">bps.mawarindah@dlhpbps.go.id</p>
        </div>

        <!-- No Telepon -->
        <div>
            <label class="text-xs text-gray-500 font-medium">No Telepon</label>
            <p class="text-sm text-gray-900 mt-1">021-567-8910</p>
        </div>

        <!-- Jam Operasional -->
        <div>
            <label class="text-xs text-gray-500 font-medium">Jam Operasional</label>
            <p class="text-sm text-gray-900 mt-1">Senin - Jumat, 08.00 - 16.00</p>
        </div>

        <!-- Respon Email -->
        <div>
            <label class="text-xs text-gray-500 font-medium">Respon Email</label>
            <p class="text-sm text-gray-900 mt-1">Lorem ipsum</p>
        </div>
    </div>
</div>

<script>
    const urlParams = new URLSearchParams(window.location.search);
    if (urlParams.get('success') === 'true') {
        showSuccessToast();
    }

    function showSuccessToast() {
        const toast = document.getElementById('successToast');
        toast.classList.remove('hidden');
        setTimeout(() => closeToast(), 5000);
    }

    function closeToast() {
        document.getElementById('successToast').classList.add('hidden');
    }
</script>