@extends('layouts.admin')

@section('title', 'Create Institute')

@section('header-title', 'Create Institute')

@section('content')
    <div class="bg-white rounded border border-graphite-400/30 overflow-hidden">
        <div class="p-6">
            <form method="POST" action="{{ route('admin.institutes.store') }}">
                @csrf

                <div class="grid grid-cols-1 gap-6">
                    <div>
                        <label for="name" class="block text-sm font-medium text-ink-600">Name</label>
                        <input type="text" name="name" id="name" value="{{ old('name') }}" required class="mt-1 block w-full rounded border-graphite-400/50 border border-graphite-400/30 focus:border-seal-blue-700 focus:ring-seal-blue-700 text-sm">
                        @error('name')
                            <p class="mt-1 text-sm text-redpen-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <div>
                        <label for="code" class="block text-sm font-medium text-ink-600">Code</label>
                        <input type="text" name="code" id="code" value="{{ old('code') }}" required class="mt-1 block w-full rounded border-graphite-400/50 border border-graphite-400/30 focus:border-seal-blue-700 focus:ring-seal-blue-700 text-sm">
                        @error('code')
                            <p class="mt-1 text-sm text-redpen-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <div>
                        <label for="address" class="block text-sm font-medium text-ink-600">Address</label>
                        <textarea name="address" id="address" rows="3" class="mt-1 block w-full rounded border-graphite-400/50 border border-graphite-400/30 focus:border-seal-blue-700 focus:ring-seal-blue-700 text-sm">{{ old('address') }}</textarea>
                        @error('address')
                            <p class="mt-1 text-sm text-redpen-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <div>
                        <label for="contact_email" class="block text-sm font-medium text-ink-600">Contact Email</label>
                        <input type="email" name="contact_email" id="contact_email" value="{{ old('contact_email') }}" class="mt-1 block w-full rounded border-graphite-400/50 border border-graphite-400/30 focus:border-seal-blue-700 focus:ring-seal-blue-700 text-sm">
                        @error('contact_email')
                            <p class="mt-1 text-sm text-redpen-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <div>
                        <label for="contact_phone" class="block text-sm font-medium text-ink-600">Contact Phone</label>
                        <input type="text" name="contact_phone" id="contact_phone" value="{{ old('contact_phone') }}" class="mt-1 block w-full rounded border-graphite-400/50 border border-graphite-400/30 focus:border-seal-blue-700 focus:ring-seal-blue-700 text-sm">
                        @error('contact_phone')
                            <p class="mt-1 text-sm text-redpen-600">{{ $message }}</p>
                        @enderror
                    </div>

                    <div>
                        <label for="status" class="block text-sm font-medium text-ink-600">Status</label>
                        <select name="status" id="status" required class="mt-1 block w-full rounded border-graphite-400/50 border border-graphite-400/30 focus:border-seal-blue-700 focus:ring-seal-blue-700 text-sm">
                            <option value="pending" {{ old('status') === 'pending' ? 'selected' : '' }}>Pending</option>
                            <option value="approved" {{ old('status') === 'approved' ? 'selected' : '' }}>Approved</option>
                            <option value="rejected" {{ old('status') === 'rejected' ? 'selected' : '' }}>Rejected</option>
                        </select>
                        @error('status')
                            <p class="mt-1 text-sm text-redpen-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>

                <div class="mt-6 flex items-center justify-end gap-3">
                    <a href="{{ route('admin.institutes.index') }}" class="px-4 py-2 bg-white border border-graphite-400/50 rounded font-semibold text-xs text-ink-600 uppercase tracking-widest hover:bg-paper-50 focus:outline-none focus:ring-2 focus:ring-ink-600 focus:ring-offset-2 transition ease-in-out duration-150">
                        Cancel
                    </a>
                    <button type="submit" class="px-4 py-2 bg-seal-blue-700 border border-transparent rounded font-semibold text-xs text-white uppercase tracking-widest hover:bg-seal-blue-700/90 focus:bg-seal-blue-700 active:bg-seal-blue-700 focus:outline-none focus:ring-2 focus:ring-seal-blue-700 focus:ring-offset-2 transition ease-in-out duration-150">
                        Submit
                    </button>
                </div>
            </form>
        </div>
    </div>
@endsection