@extends('layouts.app')

@section('title', 'Edit Katalog Akses')
@section('subtitle', 'Perbarui master data hak akses')

@section('breadcrumb')
    <li class="flex items-center">
        <i class="fas fa-chevron-right text-xs text-secondary-400 mx-2"></i>
        <a href="{{ route('access-catalogs.index') }}" class="text-sm font-medium text-secondary-500 hover:text-primary-600">Katalog Akses</a>
    </li>
    <li class="flex items-center">
        <i class="fas fa-chevron-right text-xs text-secondary-400 mx-2"></i>
        <span class="text-sm font-medium text-secondary-700">Edit</span>
    </li>
@endsection

@section('content')
<div class="max-w-3xl mx-auto">
    <form action="{{ route('access-catalogs.update', $accessCatalog) }}" method="POST" class="glass-card rounded-2xl p-8">
        @csrf
        @method('PUT')
        
        <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
            <div>
                <label class="block text-sm font-medium text-secondary-700 mb-2">Kode</label>
                <input type="text" value="{{ $accessCatalog->code }}" readonly class="w-full px-4 py-3 bg-secondary-100 border border-secondary-200 rounded-xl text-sm font-mono text-secondary-600 cursor-not-allowed">
                <p class="mt-1 text-xs text-secondary-500">Kode tidak dapat diubah</p>
            </div>

            <div>
                <label class="block text-sm font-medium text-secondary-700 mb-2">Nama Akses <span class="text-rose-500">*</span></label>
                <input type="text" name="name" value="{{ old('name', $accessCatalog->name) }}" required class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500">
            </div>

            <div>
                <label class="block text-sm font-medium text-secondary-700 mb-2">Kategori <span class="text-rose-500">*</span></label>
                <select name="category" required class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500">
                    @foreach(['physical' => 'Akses Fisik', 'digital' => 'Digital', 'network' => 'Network', 'application' => 'Aplikasi', 'cloud' => 'Cloud', 'file' => 'File', 'other' => 'Lainnya'] as $key => $label)
                        <option value="{{ $key }}" {{ old('category', $accessCatalog->category) == $key ? 'selected' : '' }}>{{ $label }}</option>
                    @endforeach
                </select>
            </div>

            <div>
                <label class="block text-sm font-medium text-secondary-700 mb-2">Criticality <span class="text-rose-500">*</span></label>
                <select name="criticality_level" required class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500">
                    @foreach(['low', 'medium', 'high', 'critical'] as $level)
                        <option value="{{ $level }}" {{ old('criticality_level', $accessCatalog->criticality_level) == $level ? 'selected' : '' }}>{{ ucfirst($level) }}</option>
                    @endforeach
                </select>
            </div>

            <div>
                <label class="block text-sm font-medium text-secondary-700 mb-2">Owner Department</label>
                <select name="owner_department_id" class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500">
                    <option value="">Pilih Department</option>
                    @foreach($departments as $dept)
                        <option value="{{ $dept->id }}" {{ old('owner_department_id', $accessCatalog->owner_department_id) == $dept->id ? 'selected' : '' }}>{{ $dept->name }}</option>
                    @endforeach
                </select>
            </div>

            <div>
                <label class="block text-sm font-medium text-secondary-700 mb-2">Status</label>
                <select name="is_active" class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500">
                    <option value="1" {{ old('is_active', $accessCatalog->is_active) == 1 ? 'selected' : '' }}>Aktif</option>
                    <option value="0" {{ old('is_active', $accessCatalog->is_active) == 0 ? 'selected' : '' }}>Nonaktif</option>
                </select>
            </div>
        </div>

        <div class="mb-6">
            <label class="block text-sm font-medium text-secondary-700 mb-2">Deskripsi</label>
            <textarea name="description" rows="3" class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500 resize-none">{{ old('description', $accessCatalog->description) }}</textarea>
        </div>

        <div class="mb-6">
            <label class="block text-sm font-medium text-secondary-700 mb-2">Prosedur Pencabutan</label>
            <textarea name="revocation_procedure" rows="3" class="w-full px-4 py-3 bg-white/60 border border-secondary-200 rounded-xl text-sm focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500 resize-none">{{ old('revocation_procedure', $accessCatalog->revocation_procedure) }}</textarea>
        </div>

        <div class="flex items-center justify-between">
            <div class="flex items-center space-x-4">
                <a href="{{ route('access-catalogs.index') }}" class="px-6 py-3 bg-white hover:bg-secondary-50 text-secondary-700 font-medium rounded-xl border border-secondary-200 transition-all">Batal</a>
                <button type="submit" class="px-8 py-3 bg-primary-500 hover:bg-primary-600 text-white font-medium rounded-xl shadow-lg shadow-primary-500/30 transition-all">
                    <i class="fas fa-save mr-2"></i>Simpan
                </button>
            </div>
        </div>
    </form>
</div>
@endsection