@extends('layouts.app')

@section('content')
<div class="p-6">

    <div class="flex justify-between items-center mb-4">
        <h1 class="text-xl font-bold">Data Kunjungan</h1>

        <a href="{{ route('user.kunjungan.create') }}"
        class="bg-[#1c1d56] text-white px-4 py-2 rounded-lg">
            + Tambah Kunjungan
        </a>
    </div>

    @if(session('success'))
        <div class="bg-green-100 text-green-700 p-3 rounded mb-3">
            {{ session('success') }}
        </div>
    @endif
        <div class="bg-white rounded-lg shadow overflow-hidden">
        <table class="w-full text-sm border-collapse">
        <!-- HEADER -->
            <thead class="bg-[#1c1d56] text-white">

                    <tr>
                        <th class="p-3 border border-gray-300 text-left">
                            Nama Pengunjung
                        </th>

                        <th class="p-3 border border-gray-300 text-left">
                            Tanggal
                        </th>
                    </tr>

                </thead>

                <!-- BODY -->
                <tbody>

                    @foreach($data as $d)

                    <tr class="hover:bg-slate-50 transition">

                        <td class="p-3 border border-gray-300 font-medium">
                            {{ $d->nama_pengunjung }}
                        </td>

                        <td class="p-3 border border-gray-300">
                            {{ $d->tanggal_kunjungan }}
                        </td>

                    </tr>

                    @endforeach

                </tbody>

            </table>

        </div>


</div>
@endsection