@extends('layout.main')

@section('title', 'বিভাগ তালিকা')

@section('content')
<div class="min-h-screen bg-gray-50 p-4 sm:p-6">
    <div class="max-w-4xl mx-auto">

        {{-- Header --}}
        <div class="flex items-center justify-between mb-6">
            <div>
                <h1 class="text-2xl font-bold text-gray-900">বিভাগ তালিকা</h1>
                <p class="text-sm text-gray-600">বাংলাদেশের সকল বিভাগ</p>
            </div>
            <a href="{{ route('divisions.create') }}"
               class="px-4 py-2 bg-green-600 text-white rounded-lg hover:bg-green-700">
                + নতুন বিভাগ
            </a>
        </div>

        {{-- Flash message --}}
        @if(session('success'))
            <div class="mb-4 p-3 rounded-lg bg-green-100 text-green-700">
                {{ session('success') }}
            </div>
        @endif

        {{-- Table --}}
        <div class="bg-white border rounded-xl shadow-sm overflow-hidden">
            <table class="w-full text-sm">
                <thead class="bg-gray-100 text-gray-700">
                    <tr>
                        <th class="px-4 py-3 text-left">#</th>
                        <th class="px-4 py-3 text-left">বিভাগ (বাংলা)</th>
                        <th class="px-4 py-3 text-left">Division (English)</th>
                        <th class="px-4 py-3 text-right">অ্যাকশন</th>
                    </tr>
                </thead>
                <tbody class="divide-y">
                    @forelse($divisions as $division)
                        <tr class="hover:bg-gray-50">
                            <td class="px-4 py-3">{{ $loop->iteration }}</td>
                            <td class="px-4 py-3 font-medium">{{ $division->name_bn }}</td>
                            <td class="px-4 py-3">{{ $division->name_en }}</td>
                            <td class="px-4 py-3 text-right space-x-2">
                                <a href="{{ route('divisions.edit', $division) }}"
                                   class="px-3 py-1 text-sm border rounded hover:bg-gray-100">
                                    Edit
                                </a>

                                <form action="{{ route('divisions.destroy', $division) }}"
                                      method="POST"
                                      class="inline"
                                      onsubmit="return confirm('আপনি কি নিশ্চিত?');">
                                    @csrf
                                    @method('DELETE')
                                    <button type="submit"
                                            class="px-3 py-1 text-sm border border-red-500 text-red-600 rounded hover:bg-red-50">
                                        Delete
                                    </button>
                                </form>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="4" class="px-4 py-6 text-center text-gray-500">
                                কোনো বিভাগ পাওয়া যায়নি
                            </td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

    </div>
</div>
@endsection