@using InfiniLore.Lucide
@addTagHelper *, InfiniLore.Lucide

<div id="mega-menu-2" class="hidden absolute left-0 w-full bg-white shadow-lg border-t border-gray-200 transition-all duration-300 z-40">
    <div class="max-w-6xl mx-auto px-4 py-6 grid grid-cols-1 md:grid-cols-3 gap-4">
        <a href="@Url.Action("Organisasi", "Profil")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
            <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="users"></i></div>
            <div>
                <div class="font-medium text-gray-900 hover:text-orange-700">Struktur Organisasi</div>
                <p class="text-sm text-gray-500">Susunan organisasi DLH.</p>
            </div>
        </a>
        <a href="@Url.Action("Bidang", "Profil")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
            <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="building"></i></div>
            <div>
                <div class="font-medium text-gray-900 hover:text-orange-700">Bidang & UPT</div>
                <p class="text-sm text-gray-500">Informasi bidang kerja & unit pelaksana teknis DLH.</p>
            </div>
        </a>
        <a href="@Url.Action("Tupoksi", "Profil")" class="flex items-start gap-3 p-2 rounded-lg hover:bg-orange-50 transition">
            <div class="bg-orange-100 rounded-full p-2"><i class="w-5 h-5 text-orange-600" data-lucide="clipboard-list"></i></div>
            <div>
                <div class="font-medium text-gray-900 hover:text-orange-700">Tupoksi</div>
                <p class="text-sm text-gray-500">Tugas pokok dan fungsi DLH.</p>
            </div>
        </a>
    </div>
</div>