@extends('layouts.user.app')
@section('content')
<div class="container mx-auto px-4">
    <div class="max-w-2xl mx-auto">
        <h1 class="text-2xl font-bold text-[#8B0000] mb-8">Kritik & Saran</h1>

        <div class="bg-white rounded-lg shadow-lg p-6">
            <form action="{{ route('kritiksaran.store') }}" method="POST" class="space-y-6">
                @csrf
                
                <input type="hidden" name="nama" value="{{ Auth::user()->name }}">
                <input type="hidden" name="email" value="{{ Auth::user()->email }}">

                <div>
                    <label for="nama" class="block text-gray-600 mb-2">Nama</label>
                    <input type="text" id="nama" value="{{ Auth::user()->name }}" disabled
                           class="w-full p-2 border border-gray-300 rounded-lg bg-gray-50 text-gray-600 cursor-not-allowed">
                </div>

                <div>
                    <label for="email" class="block text-gray-600 mb-2">Email</label>
                    <input type="email" id="email" value="{{ Auth::user()->email }}" disabled
                           class="w-full p-2 border border-gray-300 rounded-lg bg-gray-50 text-gray-600 cursor-not-allowed">
                </div>

                <div>
                    <label for="jenis" class="block text-gray-600 mb-2">Jenis</label>
                    <select id="jenis" name="jenis" required
                            class="w-full p-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8B0000] focus:border-transparent">
                        <option value="">Pilih jenis</option>
                        <option value="kritik">Kritik</option>
                        <option value="saran">Saran</option>
                    </select>
                </div>

                <div>
                    <label for="pesan" class="block text-gray-600 mb-2">Pesan</label>
                    <textarea id="pesan" name="pesan" rows="5" required
                              class="w-full p-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#8B0000] focus:border-transparent"
                              placeholder="Tulis pesan Anda di sini..."></textarea>
                </div>

                <div class="flex justify-end space-x-4">
                    <a href="/" class="px-6 py-2 border-2 border-[#8B0000] text-[#8B0000] rounded-lg font-bold hover:bg-[#8B0000] hover:text-white transition">
                        Kembali
                    </a>
                    <button type="submit" class="px-6 py-2 bg-[#8B0000] text-white rounded-lg font-bold hover:bg-[#660000] transition">
                        Kirim
                    </button>
                </div>
            </form>
        </div>

        @if(session('success'))
        <div class="mt-6 p-4 bg-green-100 text-green-800 rounded-lg">
            {{ session('success') }}
        </div>
        @endif

        @if($errors->any())
        <div class="mt-6 p-4 bg-red-100 text-red-800 rounded-lg">
            <ul class="list-disc list-inside">
                @foreach($errors->all() as $error)
                <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
        @endif
    </div>
</div>
@endsection