@extends('public.layout')

@section('title', 'Kegiatan')

@section('content')

<h1 class="text-3xl font-bold mb-2">Kegiatan</h1>
<p class="text-gray-500 mb-10">Dokumentasi kegiatan organisasi Persegi</p>

<div class="grid md:grid-cols-3 gap-6">
    @forelse($kegiatan as $item)
    <a href="{{ route('kegiatan.detail', $item) }}" class="bg-white rounded-xl shadow hover:shadow-md transition p-5 block">
        <div class="text-xs text-green-600 font-semibold mb-1">
            {{ $item->start_date->format('d M Y') }}
            @if($item->start_date->ne($item->end_date))
                — {{ $item->end_date->format('d M Y') }}
            @endif
        </div>
        <h3 class="font-bold text-gray-800 mb-2">{{ $item->title }}</h3>
        <p class="text-sm text-gray-500 line-clamp-3">{{ $item->description }}</p>
        @if($item->executed_at)
        <span class="mt-3 inline-block text-xs bg-green-100 text-green-700 px-2 py-1 rounded-full">Terlaksana</span>
        @else
        <span class="mt-3 inline-block text-xs bg-yellow-100 text-yellow-700 px-2 py-1 rounded-full">Akan Datang</span>
        @endif
    </a>
    @empty
    <p class="text-gray-400 col-span-3">Belum ada kegiatan.</p>
    @endforelse
</div>

<div class="mt-10">
    {{ $kegiatan->links() }}
</div>

@endsection