@extends('template.admin')

@section('content')
<div class="max-w-4xl mx-auto p-4 bg-white shadow rounded">
    <h1 class="text-lg font-semibold mb-4 text-gray-700">{{ isset($subkriterium) ? 'Edit' : 'Tambah' }} Sub Kriteria</h1>

    <form action="{{ isset($subkriterium) ? route('sub-kriteria.update', $subkriterium) : route('sub-kriteria.store') }}" method="POST" class="space-y-3">
        @csrf
        @if(isset($subkriterium))
        @method('PUT')
        @endif

        <div>
            <label for="nama_subkriteria" class="block mb-1 text-gray-600 text-sm">Nama Sub Kriteria</label>
            <input type="text" id="nama_subkriteria" name="nama_subkriteria"
                class="w-full border border-gray-300 rounded px-3 py-1.5 text-sm focus:outline-none focus:ring-1 focus:ring-blue-500"
                value="{{ old('nama_subkriteria', $subkriterium->nama_subkriteria ?? '') }}" required>
            @error('nama_subkriteria')
            <p class="text-red-600 text-xs mt-1">{{ $message }}</p>
            @enderror
        </div>

        <div>
            <label for="kriteria_id" class="block mb-1 text-gray-600 text-sm">Kriteria</label>
            <select id="kriteria_id" name="kriteria_id"
                class="w-full border border-gray-300 rounded px-3 py-1.5 text-sm focus:outline-none focus:ring-1 focus:ring-blue-500"
                required>
                <option value="" disabled selected>-- Pilih Kriteria --</option>
                @foreach($kriteria as $item)
                <option value="{{ $item->id }}" {{ (old('kriteria_id', $subkriterium->kriteria_id ?? '') == $item->id) ? 'selected' : '' }}>
                    {{ $item->nama_kriteria }}
                </option>
                @endforeach
            </select>
            @error('kriteria_id')
            <p class="text-red-600 text-xs mt-1">{{ $message }}</p>
            @enderror
        </div>

        <div class="flex justify-end gap-4 mt-4">
            <a href="{{ route('sub-kriteria.index') }}"
                class="flex items-center gap-1 text-gray-500 hover:text-blue-500 transition" title="Batal" aria-label="Batal">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5 stroke-2" fill="none" viewBox="0 0 24 24"
                    stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" d="M6 18L18 6M6 6l12 12" />
                </svg>
                <span class="text-sm">Batal</span>
            </a>

            <button type="submit" title="{{ isset($subkriterium) ? 'Update' : 'Simpan' }}" aria-label="{{ isset($subkriterium) ? 'Update' : 'Simpan' }}"
                class="flex items-center gap-2 text-blue-500 hover:text-blue-700 transition font-medium">
                <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6 stroke-2" fill="none" viewBox="0 0 24 24"
                    stroke="currentColor">
                    <path stroke-linecap="round" stroke-linejoin="round" d="{{ isset($subkriterium) ? 'M11 5H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2v-5m-10-7l8 8m-3 0h3v3' : 'M12 4v16m8-8H4' }}" />
                </svg>
                <span class="text-sm">{{ isset($subkriterium) ? 'Update' : 'Simpan' }}</span>
            </button>
        </div>
    </form>
</div>
@endsection