<!-- 🔥 WRAPPER KHUSUS HOME -->
<div class="relative w-full h-screen overflow-hidden">

    <!-- 🔥 BACKGROUND GAMBAR -->
<div class="absolute inset-0">
    <img src="assets/img/ikan.jpg" 
         class="w-full h-full object-cover blur-sm scale-105">
    
    <!-- overlay biar lebih soft -->
    <div class="absolute inset-0 bg-black/30"></div>
</div>



    <!-- 🔥 ISI DASHBOARD -->
    <div class="relative z-10 p-6 text-white">

        <h2 class="text-2xl font-bold mb-6">Dashboard</h2>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">

            <!-- Monitoring -->
            <div onclick="window.location='dashboard.php?page=monitoring'"
                 class="bg-white/80 backdrop-blur-md p-6 rounded-2xl shadow hover:shadow-xl cursor-pointer text-black">

                <i class="fas fa-chart-line text-3xl text-blue-500 mb-3"></i>
                <h3 class="font-semibold text-lg">Monitoring</h3>
                <p class="text-sm text-gray-600">Lihat data suhu & kelembaban</p>
            </div>

            <!-- Kontrol -->
            <div onclick="window.location='dashboard.php?page=kontrol'"
                 class="bg-white/80 backdrop-blur-md p-6 rounded-2xl shadow hover:shadow-xl cursor-pointer text-black">

                <i class="fas fa-sliders-h text-3xl text-green-500 mb-3"></i>
                <h3 class="font-semibold text-lg">Kontrol</h3>
                <p class="text-sm text-gray-600">Atur alat pengering</p>
            </div>

        </div>
    </div>

</div>
