@extends('layouts.app')

@section('content')
<div class="max-w-5xl mx-auto px-6 py-10">

    <h1 class="text-2xl font-bold text-gray-800 mb-2">
        📝 Minit Mesyuarat Agung — Tambah Baru
    </h1>
    <p class="text-gray-500 mb-6">
        Lengkapkan maklumat mesyuarat mengikut format SKM terkini.
    </p>

    <form method="POST"
      action="{{ route('minit.store', $notis->id) }}">
    @csrf

        {{-- =========================
            MAKLUMAT MESYUARAT
        ========================== --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">Maklumat Mesyuarat</h2>

            <div class="grid sm:grid-cols-2 gap-4">
                <label class="text-sm">Tarikh Mesyuarat</label>
                <label class="text-sm">Masa Mesyuarat</label>
            </div>

            <div class="grid sm:grid-cols-2 gap-4 mt-1">
                <input type="date"
                    name="tarikh"
                    class="border rounded px-3 py-2"
                    value="{{ \Carbon\Carbon::parse($notis->tarikh_mesyuarat)->format('Y-m-d') }}"
                    readonly>
                <input type="text"
                    name="masa"
                    class="border rounded px-3 py-2"
                    value="{{ $notis->masa_mesyuarat }}"
                    readonly>
            </div>

            <div class="grid sm:grid-cols-2 gap-4 mt-4">
                <label class="text-sm">Tempat Mesyuarat</label>
                <label class="text-sm">Jumlah Hadir</label>
            </div>

            <div class="grid sm:grid-cols-2 gap-4 mt-1">
                <input type="text"
                    name="tempat"
                    class="border rounded px-3 py-2"
                    value="{{ $notis->tempat_mesyuarat }}"
                    readonly>

                <input type="number" name="jumlah_hadir"
                       class="border rounded px-3 py-2" required>
            </div>
        </div>

        {{-- =========================
            UCAPAN
        ========================== --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">Ucapan</h2>

            <textarea name="ucapan_pengerusi"
                class="border rounded px-3 py-2 w-full mb-3"
                rows="3"
                placeholder="Ucapan Pengerusi"></textarea>

            {{-- - <textarea name="ucapan_perasmian"
                class="border rounded px-3 py-2 w-full"
                rows="3"
                placeholder="Ucapan Perasmian (jika ada)"></textarea>--}}
        </div>

        {{-- =========================
            PRE-AGENDA
        ========================== --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Pre-Agenda: Lantikan Pengerusi Mesyuarat
            </h2>

            <div class="grid sm:grid-cols-2 gap-4">
                @foreach([
                    'pencadang' => 'Pencadang',
                    'dilantik'  => 'Dilantik',
                    'dicadang'  => 'Dicadang',
                    'disokong'  => 'Disokong',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>

                        <select name="preagenda[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full"
                                required>
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">
                                    {{ $a->nama }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- =========================
            AGENDA 1–11 (PATTERNED)
        ========================== --}}

        {{-- AGENDA 1 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 1: Pengesahan Minit Mesyuarat Terdahulu
            </h2>

            <div class="grid sm:grid-cols-3 gap-4">
                @foreach([
                    'pembentang' => 'Pembentang',
                    'dicadang'   => 'Dicadang Terima Oleh',
                    'disokong'   => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>

                        <select name="agenda1[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full"
                                required>
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">
                                    {{ $a->nama }}
                                </option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 2 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 2: Laporan Lembaga & Jawatankuasa Audit Dalaman
            </h2>

            <div class="grid sm:grid-cols-2 gap-4">

                {{-- Pembentang --}}
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Pembentang
                    </label>
                    <select name="agenda2[pembentang]"
                            class="border rounded px-3 py-2 w-full"
                            required>
                        <option value="">-- Pilih Pembentang --</option>
                        @foreach($anggotas as $a)
                            <option value="{{ $a->id }}">{{ $a->nama }}</option>
                        @endforeach
                    </select>
                </div>

                {{-- Tahun Laporan --}}
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Tahun Laporan
                    </label>
                    <input type="text"
                        name="agenda2[tahun]"
                        class="border rounded px-3 py-2 w-full"
                        placeholder="Contoh: 2024"
                        required>
                </div>

                {{-- Dicadang & Disokong --}}
                @foreach([
                    'dicadang' => 'Dicadang Terima Oleh',
                    'disokong' => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>
                        <select name="agenda2[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full"
                                required>
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach

            </div>
        </div>

        {{-- AGENDA 3 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 3: Akaun Teraudit & Pembahagian Keuntungan
            </h2>

            {{-- Pembentang & Tahun --}}
            <div class="grid sm:grid-cols-2 gap-4 mb-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Pembentang
                    </label>
                    <select name="agenda3[pembentang]"
                            class="border rounded px-3 py-2 w-full"
                            required>
                        <option value="">-- Pilih Pembentang --</option>
                        @foreach($anggotas as $a)
                            <option value="{{ $a->id }}">{{ $a->nama }}</option>
                        @endforeach
                    </select>
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Tahun Kewangan Berakhir
                    </label>
                    <input type="text"
                        name="agenda3[tahun_kewangan_berakhir]"
                        class="border rounded px-3 py-2 w-full"
                        value="{{ \Carbon\Carbon::parse($koperasi->tarikh_tutup_tahun_sebelum)->format('d-m-Y')}}"
                        placeholder="Contoh: 31/12/2024"
                        readonly>
                </div>
            </div>

            {{-- Kewangan --}}
            <div class="grid sm:grid-cols-3 gap-4 mb-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Untung Bersih (RM)
                    </label>
                    <input type="number"
                        name="agenda3[untung_bersih]"
                        class="border rounded px-3 py-2 w-full">
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Dividen
                    </label>
                    <input type="number"
                        name="agenda3[dividen]"
                        class="border rounded px-3 py-2 w-full">
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Honorarium
                    </label>
                    <input type="number"
                        name="agenda3[honorarium]"
                        class="border rounded px-3 py-2 w-full">
                </div>
            </div>

            {{-- Dicadang & Disokong --}}
            <div class="grid sm:grid-cols-2 gap-4">
                @foreach([
                    'dicadang' => 'Dicadang Terima Oleh',
                    'disokong' => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>
                        <select name="agenda3[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full"
                                required>
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 4 — PEMILIHAN ALK --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 4: Pemilihan Anggota Lembaga
            </h2>

            {{-- Cari Anggota --}}
            <div class="mb-3">
                <label class="block text-sm font-medium text-gray-700 mb-1">
                    Cari Anggota
                </label>
                <input type="text"
                    id="agenda4-search"
                    onkeyup="filterAgenda4()"
                    placeholder="Taip nama anggota..."
                    class="border rounded px-3 py-2 w-full text-sm">
            </div>

            {{-- Senarai Anggota --}}
            <label class="block text-sm font-medium text-gray-700 mb-2">
                Senarai Anggota Layak Dipilih
            </label>

            <div id="agenda4-alk"
                data-max="{{ $bilAlk }}"
                class="grid sm:grid-cols-2 md:grid-cols-3 gap-2
                        border rounded p-3
                        max-h-[240px] overflow-y-auto">

                @foreach($anggotas as $a)
                    @php
                        $cukupTempoh = \Carbon\Carbon::parse($a->tarikh_masuk)
                                        ->lte(now()->subYears(2));
                    @endphp

                    @if($cukupTempoh)
                    <label class="flex items-center space-x-2 text-sm agenda4-item h-8">
                        <input type="checkbox"
                            name="agenda4[senarai_alk][]"
                            value="{{ $a->id }}"
                            data-name="{{ strtolower($a->nama) }}"
                            onchange="updateSelectedList()"
                            class="rounded border-gray-300">

                        <span class="truncate">{{ $a->nama }}</span>
                    </label>
                    @endif
                @endforeach
            </div>

            {{-- Selected list --}}
            <div id="agenda4-selected"
                class="mt-4 hidden border rounded bg-gray-50 p-3">
                <h3 class="text-sm font-semibold mb-2 text-gray-700">
                    Senarai Anggota Dipilih (<span id="agenda4-count">0</span>)
                </h3>

                <ul id="agenda4-selected-list"
                    class="list-disc list-inside text-sm text-gray-700 space-y-1">
                </ul>
            </div>

            {{-- Pembentang / Dicadang / Disokong --}}
            <div class="grid sm:grid-cols-3 gap-4 mt-4">
                @foreach([
                    'pembentang' => 'Pembentang',
                    'dicadang'   => 'Dicadang Terima Oleh',
                    'disokong'   => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>
                        <select name="agenda4[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full">
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 5 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 5: Belanjawan Tahunan
            </h2>

            <div class="grid sm:grid-cols-3 gap-4">
                @foreach([
                    'pembentang' => 'Pembentang',
                    'dicadang'   => 'Dicadang Terima Oleh',
                    'disokong'   => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>

                        <select name="agenda5[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full">
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

       {{-- AGENDA 6 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 6: Elaun / Saraan Anggota Lembaga
            </h2>

            {{-- Pembentang, Nilai & Tempoh --}}
            <div class="grid sm:grid-cols-3 gap-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Pembentang
                    </label>
                    <select name="agenda6[pembentang]"
                            class="border rounded px-3 py-2 w-full">
                        <option value="">-- Pilih Pembentang --</option>
                        @foreach($anggotas as $a)
                            <option value="{{ $a->id }}">{{ $a->nama }}</option>
                        @endforeach
                    </select>
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Nilai Elaun (RM)
                    </label>
                    <input type="number"
                        name="agenda6[nilai]"
                        class="border rounded px-3 py-2 w-full"
                        placeholder="Contoh: 500">
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Tahun / Tempoh
                    </label>
                    <input type="text"
                        name="agenda6[tahun]"
                        class="border rounded px-3 py-2 w-full"
                        placeholder="Contoh: 2025">
                </div>
            </div>

            {{-- Dicadang & Disokong --}}
            <div class="grid sm:grid-cols-2 gap-4 mt-4">
                @foreach([
                    'dicadang' => 'Dicadang Terima Oleh',
                    'disokong' => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>

                        <select name="agenda6[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full">
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 7 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 7: Pelantikan Juruaudit
            </h2>

            {{-- Pembentang, Firma & Tahun --}}
            <div class="grid sm:grid-cols-3 gap-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Pembentang
                    </label>
                    <select name="agenda7[pembentang]"
                            class="border rounded px-3 py-2 w-full">
                        <option value="">-- Pilih Pembentang --</option>
                        @foreach($anggotas as $a)
                            <option value="{{ $a->id }}">{{ $a->nama }}</option>
                        @endforeach
                    </select>
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Nama Firma Juruaudit
                    </label>
                    <input type="text"
                        name="agenda7[nama_firma]"
                        class="border rounded px-3 py-2 w-full"
                        placeholder="Contoh: ABC & Co">
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Tahun Kewangan Berakhir
                    </label>
                    <input type="text"
                        name="agenda7[tahun_kewangan_berakhir]"
                        class="border rounded px-3 py-2 w-full"
                        value="{{ \Carbon\Carbon::parse($koperasi->tarikh_tutup_tahun_sebelum)->format('d-m-Y')}}"
                        placeholder="Contoh: 31/12/2024"
                        readonly>
                </div>
            </div>

            {{-- Dicadang & Disokong --}}
            <div class="grid sm:grid-cols-2 gap-4 mt-4">
                @foreach([
                    'dicadang' => 'Dicadang Terima Oleh',
                    'disokong' => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>
                        <select name="agenda7[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full">
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 8 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 8: Had Pelaburan
            </h2>

            <div class="grid sm:grid-cols-2 gap-4">

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Pencadang
                    </label>
                    <select name="agenda8[pencadang]"
                            class="border rounded px-3 py-2 w-full">
                        <option value="">-- Pilih Pencadang --</option>
                        @foreach($anggotas as $a)
                            <option value="{{ $a->id }}">{{ $a->nama }}</option>
                        @endforeach
                    </select>
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Had Pelaburan (RM)
                    </label>
                    <input type="number"
                        name="agenda8[had_pelaburan]"
                        class="border rounded px-3 py-2 w-full"
                        placeholder="Contoh: 100000">
                </div>

                @foreach([
                    'dicadang' => 'Dicadang Terima Oleh',
                    'disokong' => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>
                        <select name="agenda8[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full">
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 9 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 9: Had Maksimum Keterhutangan
            </h2>

            <div class="grid sm:grid-cols-2 gap-4">

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Pencadang
                    </label>
                    <select name="agenda9[pencadang]"
                            class="border rounded px-3 py-2 w-full">
                        <option value="">-- Pilih Pencadang --</option>
                        @foreach($anggotas as $a)
                            <option value="{{ $a->id }}">{{ $a->nama }}</option>
                        @endforeach
                    </select>
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Had Maksimum Hutang (RM)
                    </label>
                    <input type="number"
                        name="agenda9[had_pelaburan]"
                        class="border rounded px-3 py-2 w-full"
                        placeholder="Contoh: 200000">
                </div>

                @foreach([
                    'dicadang' => 'Dicadang Terima Oleh',
                    'disokong' => 'Disokong Oleh',
                ] as $field => $label)

                    <div>
                        <label class="block text-sm font-medium text-gray-700 mb-1">
                            {{ $label }}
                        </label>
                        <select name="agenda9[{{ $field }}]"
                                class="border rounded px-3 py-2 w-full">
                            <option value="">-- Pilih {{ strtolower($label) }} --</option>
                            @foreach($anggotas as $a)
                                <option value="{{ $a->id }}">{{ $a->nama }}</option>
                            @endforeach
                        </select>
                    </div>

                @endforeach
            </div>
        </div>

        {{-- AGENDA 10 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 10: Jawatankuasa Menentusahkan Draf Minit
            </h2>

            {{-- Pencadang --}}
            <div class="mb-6">
                <label class="block text-sm font-medium text-gray-700 mb-1">
                    Pencadang
                </label>
                <select name="agenda10[pencadang]"
                        class="border rounded px-3 py-2 w-full">
                    <option value="">-- Pilih Pencadang --</option>
                    @foreach($anggotas as $a)
                        <option value="{{ $a->id }}">{{ $a->nama }}</option>
                    @endforeach
                </select>
            </div>

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

                {{-- PANEL A — ALK --}}
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-2">
                        Senarai ALK
                    </label>

                    <input type="text"
                        id="agenda10-alk-search"
                        onkeyup="filterAgenda10('alk')"
                        placeholder="Cari nama ALK..."
                        class="border rounded px-3 py-2 w-full mb-3 text-sm">

                    <div id="agenda10-alk"
                        data-max="4"
                        class="grid sm:grid-cols-2 gap-2 border rounded p-3 max-h-[240px] overflow-y-auto">

                        @foreach($anggotas as $a)
                            @php
                                $cukupTempoh = \Carbon\Carbon::parse($a->tarikh_masuk)
                                                ->lte(now()->subYears(2));
                            @endphp

                            @if($cukupTempoh)
                            <label class="flex items-center space-x-2 text-sm agenda10-alk-item h-8">
                                <input type="checkbox"
                                    name="agenda10[alk][]"
                                    value="{{ $a->id }}"
                                    data-name="{{ strtolower($a->nama) }}"
                                    onchange="updateAgenda10Selected('alk')"
                                    class="rounded border-gray-300">

                                <span class="truncate">{{ $a->nama }}</span>
                            </label>
                            @endif
                        @endforeach
                    </div>

                    <div id="agenda10-alk-selected"
                        class="mt-3 hidden border rounded bg-gray-50 p-3">
                        <h4 class="text-sm font-semibold mb-2">
                            ALK Dipilih (<span id="agenda10-alk-count">0</span>)
                        </h4>
                        <ul id="agenda10-alk-list"
                            class="list-disc list-inside text-sm space-y-1"></ul>
                    </div>
                </div>

                {{-- PANEL B — ANGGOTA BIASA --}}
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-2">
                        Senarai Anggota Biasa
                    </label>

                    <input type="text"
                        id="agenda10-biasa-search"
                        onkeyup="filterAgenda10('biasa')"
                        placeholder="Cari nama anggota biasa..."
                        class="border rounded px-3 py-2 w-full mb-3 text-sm">

                    <div id="agenda10-biasa"
                        data-max="6"
                        class="grid sm:grid-cols-2 gap-2 border rounded p-3 max-h-[240px] overflow-y-auto">

                        @foreach($anggotas as $a)
                            <label class="flex items-center space-x-2 text-sm agenda10-biasa-item h-8">
                                <input type="checkbox"
                                    name="agenda10[anggota_biasa][]"
                                    value="{{ $a->id }}"
                                    data-name="{{ strtolower($a->nama) }}"
                                    onchange="updateAgenda10Selected('biasa')"
                                    class="rounded border-gray-300">
                                <span class="truncate">{{ $a->nama }}</span>
                            </label>
                        @endforeach
                    </div>

                    <div id="agenda10-biasa-selected"
                        class="mt-3 hidden border rounded bg-gray-50 p-3">
                        <h4 class="text-sm font-semibold mb-2">
                            Anggota Biasa Dipilih (<span id="agenda10-biasa-count">0</span>)
                        </h4>
                        <ul id="agenda10-biasa-list"
                            class="list-disc list-inside text-sm space-y-1"></ul>
                    </div>
                </div>

            </div>
        </div>

        {{-- AGENDA 11 --}}
        <div class="bg-white border rounded-lg p-6">
            <h2 class="font-semibold mb-4">
                Agenda 11: Usul / Urusan Lain
            </h2>

            {{-- Pengerusi --}}
            <div class="mb-4">
                <label class="block text-sm font-medium text-gray-700 mb-1">
                    Pengerusi
                </label>
                <select name="agenda11[pencadang]"
                        class="border rounded px-3 py-2 w-full">
                    <option value="">-- Pilih Pengerusi --</option>
                    @foreach($anggotas as $a)
                        <option value="{{ $a->id }}">{{ $a->nama }}</option>
                    @endforeach
                </select>
            </div>

            <div class="overflow-x-auto">
                <table class="w-full text-sm border rounded">
                    <colgroup>
                        <col style="width:20%">
                        <col style="width:30%">
                        <col style="width:30%">
                        <col style="width:20%">
                    </colgroup>    

                    <thead class="bg-gray-100 text-gray-700">
                        <tr>
                            <th class="border px-3 py-2">Nama Anggota</th>
                            <th class="border px-3 py-2">Usul / Cadangan</th>
                            <th class="border px-3 py-2">Ulasan ALK</th>
                            <th class="border px-3 py-2 w-10 text-center">Keputusan</th>
                        </tr>
                    </thead>

                    <tbody>
                        @forelse($usuls as $index => $u)
                        <tr>
                            <td class="border px-2 py-2">
                                {{ $u->anggota->nama }}
                                <input type="hidden"
                                    name="agenda11[usul][{{ $index }}][usul_id]"
                                    value="{{ $u->id }}">
                            </td>

                            <td class="border px-2 py-2">
                                {{ $u->cadangan }}
                            </td>

                            <td class="border px-2 py-2">
                                {{ $u->ulasan_alk ?? '-' }}
                            </td>
                            <td class="border px-2 py-2">
                                <textarea
                                    name="agenda11[usul][{{ $index }}][tindakan]"
                                    class="border rounded px-2 py-1 w-full text-sm"
                                    rows="2"
                                    placeholder="Keputusan mesyuarat..."></textarea>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="4" class="text-center text-gray-400 py-4">
                                Tiada usul diterima sebelum MAT.
                            </td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>

        {{-- =========================
            PENANGGUHAN & PENGESAHAN
        ========================== --}}
        <div class="bg-white border rounded-lg p-6">

            <h2 class="font-semibold mb-4">Penangguhan Mesyuarat</h2>

            <div class="grid sm:grid-cols-2 gap-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Masa Tamat Mesyuarat
                    </label>
                    <input type="time"
                        name="masa_tamat"
                        class="border rounded px-3 py-2 w-full">
                </div>
            </div>

            <h2 class="font-semibold mb-4 mt-6">Pengesahan Dokumen</h2>

            {{-- Disediakan --}}
            <div class="grid sm:grid-cols-2 gap-4 mb-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Disediakan Oleh (Nama)
                    </label>
                    <input name="disediakan_oleh[nama]"
                        class="border rounded px-3 py-2 w-full">
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Disediakan Oleh (Jawatan)
                    </label>
                    <input name="disediakan_oleh[jawatan]"
                        class="border rounded px-3 py-2 w-full">
                </div>
            </div>

            {{-- Disemak --}}
            <div class="grid sm:grid-cols-2 gap-4">
                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Disemak Oleh (Nama)
                    </label>
                    <input name="disemak_oleh[nama]"
                        class="border rounded px-3 py-2 w-full">
                </div>

                <div>
                    <label class="block text-sm font-medium text-gray-700 mb-1">
                        Disemak Oleh (Jawatan)
                    </label>
                    <input name="disemak_oleh[jawatan]"
                        class="border rounded px-3 py-2 w-full">
                </div>
            </div>
        </div>

        {{-- =========================
            SUBMIT
        ========================== --}}
        <div class="flex justify-end">
            <a href="{{ route('minit.index') }}"
               class="px-5 py-2 bg-gray-200 rounded mr-3">Kembali</a>
            <button class="px-6 py-2 bg-indigo-600 text-white rounded">
                Simpan Minit
            </button>
        </div>

    </form>
</div>

<script>
function filterAgenda4() {
    const query = document.getElementById('agenda4-search').value.toLowerCase();
    const items = document.querySelectorAll('.agenda4-item');

    items.forEach(item => {
        const name = item.querySelector('input').dataset.name;
        item.style.display = name.includes(query) ? 'flex' : 'none';
    });
}

function updateSelectedList() {

    const container = document.getElementById('agenda4-alk');
    const max = parseInt(container.dataset.max);

    const checkboxes = container.querySelectorAll('input[type=checkbox]');
    const checked = container.querySelectorAll('input[type=checkbox]:checked');

    const list = document.getElementById('agenda4-selected-list');
    const count = document.getElementById('agenda4-count');
    const selectedBox = document.getElementById('agenda4-selected');

    // ❌ Block if exceed limit
    if (checked.length > max) {
        alert(`Maksimum ${max} orang ALK sahaja dibenarkan.`);
        event.target.checked = false;
        return;
    }

    list.innerHTML = '';

    checked.forEach(cb => {
        const li = document.createElement('li');
        li.textContent = cb.nextElementSibling.innerText;
        list.appendChild(li);
    });

    count.textContent = checked.length;
    selectedBox.classList.toggle('hidden', checked.length === 0);
}


function selectAll(containerId) {
    document.querySelectorAll(`#${containerId} input[type="checkbox"]`)
        .forEach(cb => cb.checked = true);
    updateSelectedList();
}

function deselectAll(containerId) {
    document.querySelectorAll(`#${containerId} input[type="checkbox"]`)
        .forEach(cb => cb.checked = false);
    updateSelectedList();
}

function filterAgenda10(type) {
    const query = document
        .getElementById(`agenda10-${type}-search`)
        .value.toLowerCase();

    document
        .querySelectorAll(`.agenda10-${type}-item`)
        .forEach(item => {
            const name = item.querySelector('input').dataset.name;
            item.style.display = name.includes(query) ? 'flex' : 'none';
        });
}

function updateAgenda10Selected(type) {

    const container   = document.getElementById(`agenda10-${type}`);
    const selectedBox = document.getElementById(`agenda10-${type}-selected`);
    const list        = document.getElementById(`agenda10-${type}-list`);
    const countSpan   = document.getElementById(`agenda10-${type}-count`);

    const max = parseInt(container.dataset.max);
    const checkboxes = container.querySelectorAll('input[type="checkbox"]');
    const checked    = container.querySelectorAll('input[type="checkbox"]:checked');

    // ❌ Block if exceed limit
    if (checked.length > max) {
        alert(`Maksimum ${max} orang dibenarkan.`);
        event.target.checked = false;
        return;
    }

    list.innerHTML = '';

    checked.forEach(cb => {
        const li = document.createElement('li');
        li.textContent = cb.nextElementSibling.textContent;
        list.appendChild(li);
    });

    countSpan.textContent = checked.length;

    // Show / hide selected box
    selectedBox.classList.toggle('hidden', checked.length === 0);
}

function addAgenda11Row() {
    const tbody = document.getElementById('agenda11-usul-body');
    const rowCount = tbody.children.length;

    const newRow = tbody.children[0].cloneNode(true);

    newRow.querySelectorAll('select, textarea').forEach(el => {
        el.name = el.name.replace('[0]', `[${rowCount}]`);
        el.value = '';
    });

    tbody.appendChild(newRow);
}

document.addEventListener('click', function (e) {
    if (e.target.classList.contains('remove-usul')) {
        const row = e.target.closest('tr');
        const tbody = document.getElementById('agenda11-usul-body');

        if (tbody.children.length > 1) {
            row.remove();
        }
    }
});
</script>

@endsection