@extends('layouts.setup')

@section('content')
<form action="{{ route('setup.store') }}" method="POST"
       class="flex flex-col items-center text-sm text-slate-800 w-full mt-8">
       @csrf

       <!--<p class="font-medium">
              Koperasi Setup
       </p>-->
       
       <h1 class="text-4xl font-bold py-3 text-center">
              Selamat Datang {{$user->name}} !
       </h1>

       <h1 class="text-xl font-bold text-center">
              Tetapan Maklumat Koperasi
       </h1>

       <p class="max-md:text-sm text-gray-500 pb-6 text-center">
              Sila lengkapkan maklumat rasmi pendaftaran dan pengurusan koperasi anda.
       </p>

       <div class="max-w-3xl w-full px-4 ">

       <!-- ===================== -->
       <!-- MAKLUMAT AM -->
       <!-- ===================== 
       <h2 class="text-indigo-600 font-semibold mb-4">Maklumat Am</h2>

       <label class="font-medium">Nama Koperasi</label>
       <div class="flex items-center mt-2 mb-4 h-10 pl-3 border border-slate-300 rounded-full
              focus-within:ring-2 focus-within:ring-indigo-400 transition-all">
       <input type="text" name="name" required
              class="h-full px-2 w-full outline-none bg-transparent border-0"
              placeholder="Contoh: Koperasi Cemerlang Malaysia Berhad">
       </div>-->

       <div class="p-6 bg-white-100 border border-200 rounded-2xl mb-4 shadow-lg">

       <h2 class="text-indigo-600 font-semibold mb-4">
       Maklumat AM
       </h2>

       <label class="font-medium">Tarikh Daftar Koperasi</label>
       <input type="date" name="tarikh_daftar" required
              class="h-10 w-full mt-2 mb-4 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition">

       <label class="font-medium">Alamat Berdaftar</label>
       <textarea name="alamat_berdaftar" rows="3" required
              class="w-full mt-2 mb-4 p-2 border border-slate-300 rounded-lg
                     resize-none outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Alamat berdaftar koperasi"></textarea>

       <label class="font-medium">Alamat Surat Menyurat</label><br><br>
       <label class="font-medium">Line 1</label>
       <input name="alamat_line_1" required
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="113, Jalan Changlun">

       <label class="font-medium">Line 2</label>
       <input name="alamat_line_2" required
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Taman Jitra">

       <label class="font-medium">Poskod</label>
       <input name="poskod" required
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="06000">

       <label class="font-medium">Bandar</label>
       <input name="bandar" required
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Jitra">

       <label class="font-medium">Negeri</label>
       <select name="negeri" required
              class="h-10 w-full mt-2 mb-4 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition">
       <option value="">-- Pilih Negeri --</option>
       <option>Kedah Darul Aman</option>
       <option>Perlis Indera Kayangan</option>
       <option>Pulau Pinang</option>
       <option>Perak Darul Ridzuan</option>
       <option>Selangor Darul Ehsan</option>
       <option>WP Kuala Lumpur</option>
       <option>Johor Darul Ta'zim</option>
       <option>Pahang Darul Makmur</option>
       <option>Kelantan Darul Naim</option>
       <option>Terengganu Darul Iman</option>
       <option>Sabah</option>
       <option>Sarawak</option>
       </select>

       <label class="font-medium">Daerah / Cawangan</label>
       <input type="text" name="district"
              class="h-10 w-full mt-2 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: Kubang Pasu">

       <!--<label class="font-medium">No. Telefon (WhatsApp)</label>
       <input type="text" name="phone"
              class="h-10 w-full mt-2 mb-4 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: 0123456789">

       <label class="font-medium">Emel Koperasi</label>
       <input type="email" name="email_alt"
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="contoh@koperasi.com">-->
       </div>

       <!-- ===================== -->
       <!-- MAKLUMAT PENGURUSAN -->
       <!-- ===================== -->
       <div class="p-6 bg-white-100 border border-200 rounded-2xl mb-4 shadow-lg">
       <h2 class="text-indigo-600 font-semibold mb-4">
       Maklumat Pengurusan
       </h2>

       <!-- Fungsi Koperasi (Dropdown) -->
       <label class="font-medium">Fungsi Koperasi</label>
       <select name="fungsi_koperasi"
              class="h-10 w-full mt-2 mb-4 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition">
       <option value="">-- Pilih Fungsi --</option>
       <option value="Ekonomi">Pengguna</option>
       <option value="Kebajikan">Perkhidmatan</option>
       <option value="Pendidikan">Pertanian</option>
       <option value="Perkhidmatan">Kewangan dan perbankan</option>
       <option value="Pelbagai">Pengangkutan</option>
       <option value="Pelbagai">Perindustrian</option>
       <option value="Pelbagai">Pembinaan</option>
       </select>

       <label class="font-medium">Aktiviti Koperasi</label>
       <input name="aktiviti_koperasi"
              class="h-10 w-full mt-2 mb-4 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: Peruncitan, pembekalan, perkhidmatan"></input>

       <label class="font-medium">Kawasan Operasi</label>
       <input type="text" name="kawasan_operasi"
              class="h-10 w-full mt-2 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: Daerah Kubang Pasu dan sekitar Kedah">

       </div>
       <!-- ===================== -->
       <!-- KEAHLIAN & MODAL -->
       <!-- ===================== --> 
       <div class="p-6 bg-white-100 border border-200 rounded-2xl mb-4 shadow-lg">
       <h2 class="text-indigo-600 font-semibold mb-4">
       Keahlian & Modal
       </h2>

       <label class="font-medium">Minimum Bilangan ALK</label>
       <input type="text" name="min_bilangan_alk" required
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: 6 orang">

       <label class="font-medium">Minimum Syer Anggota (RM)</label>
       <input type="text" name="min_syer" required
              class="h-10 w-full mt-2 mb-6 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: RM100">

       <label class="font-medium">Fi Kemasukan (RM)</label>
       <input type="text" name="fi_kemasukan" required
              class="h-10 w-full mt-2 px-3 border border-slate-300 rounded-full
                     outline-none focus:ring-2 focus:ring-indigo-400 transition"
              placeholder="Contoh: RM20">
       </div>
       <!-- ===================== -->
       <!-- SISTEM -->
       <!-- ===================== -->
       <div class="p-6 bg-white-100 border border-200 rounded-2xl mb-4 shadow-lg">
       <h2 class="text-indigo-600 font-semibold mb-4">Tetapan Sistem</h2>

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

              <!-- Tarikh Tutup Tahun Kewangan -->
              <div>
                     <label class="font-medium">
                     Tarikh Tutup Tahun Kewangan
                     </label>

                     <select name="tarikh_tutup_tahun_sebelum" required
                     class="h-10 w-full mt-2 px-3 border border-slate-300 rounded-full
                            outline-none focus:ring-2 focus:ring-indigo-400 transition">
                     <option value="">-- Pilih Tarikh --</option>
                     <option value="31-01">31 Januari</option>
                     <option value="28-02">28 Februari</option>
                     <option value="31-03">31 Mac</option>
                     <option value="30-04">30 April</option>
                     <option value="31-05">31 Mei</option>
                     <option value="30-06">30 Jun</option>
                     <option value="31-07">31 Julai</option>
                     <option value="31-08">31 Ogos</option>
                     <option value="30-09">30 September</option>
                     <option value="31-10">31 Oktober</option>
                     <option value="30-11">30 November</option>
                     <option value="31-12">31 Disember</option>
                     </select>
              </div>

              <!-- Tahun Kewangan -->
              <div>
                     <label class="font-medium">Tahun Kewangan</label>

                     <select name="tahun_kewangan" required
                     class="h-10 w-full mt-2 px-3 border border-slate-300 rounded-full
                            outline-none focus:ring-2 focus:ring-indigo-400 transition">
                     <option value="">-- Pilih Tahun --</option>
                     <option value="2026">2026</option>
                     <option value="2027">2027</option>
                     <option value="2028">2028</option>
                     <option value="2029">2029</option>
                     <option value="2030">2030</option>
                     </select>
              </div>
       </div>
       </div>


        <button type="submit"
                class="flex items-center justify-center gap-2
                       bg-indigo-500 hover:bg-indigo-600
                       text-white py-3 w-full rounded-full transition">
            Simpan & Teruskan
            <svg width="20" height="20" fill="none" viewBox="0 0 24 24">
                <path d="M13 5l7 7-7 7M5 12h14"
                      stroke="currentColor" stroke-width="2"
                      stroke-linecap="round" stroke-linejoin="round"/>
            </svg>
        </button>

    </div>
</form>
@endsection