@extends('layouts.admin')

@section('header')
    <h2 class="font-semibold text-xl text-white">Employee Resignation</h2>
@endsection

@section('content')
<div class="max-w-2xl mx-auto bg-white shadow rounded-lg p-6">
    <div class="mb-6">
        <h3 class="text-2xl font-semibold text-gray-800">Resign Employee</h3>
        <p class="text-gray-600 mt-2">Employee: <strong>{{ $employee->full_name }}</strong></p>
        <p class="text-gray-600">Employee No: <strong>{{ $employee->employee_no }}</strong></p>
    </div>

    <div class="bg-orange-50 border-l-4 border-orange-500 p-4 mb-6">
        <p class="text-orange-700">
            <strong>⚠️ Warning:</strong> This action will mark the employee as resigned and move them to the ex-employees list.
        </p>
    </div>

    <form action="{{ route('employees.resign', $employee) }}" method="POST" class="space-y-6">
        @csrf
        @method('PATCH')

        <div>
            <label for="resigned_at" class="block text-sm font-medium text-gray-700 mb-2">
                Resignation Date <span class="text-red-600">*</span>
            </label>
            <input type="date" id="resigned_at" name="resigned_at" 
                   value="{{ old('resigned_at', date('Y-m-d')) }}"
                   max="{{ date('Y-m-d') }}"
                   class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500 @error('resigned_at') border-red-500 @enderror"
                   required>
            @error('resigned_at')
                <p class="text-red-600 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>

        <div>
            <label for="resignation_reason" class="block text-sm font-medium text-gray-700 mb-2">
                Reason for Resignation <span class="text-gray-500">(Optional)</span>
            </label>
            <textarea id="resignation_reason" name="resignation_reason" 
                      rows="4"
                      placeholder="Enter the reason for resignation..."
                      class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-orange-500 @error('resignation_reason') border-red-500 @enderror">{{ old('resignation_reason') }}</textarea>
            @error('resignation_reason')
                <p class="text-red-600 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>

        <div class="flex gap-4 pt-4">
            <button type="submit" class="flex-1 px-6 py-3 bg-orange-600 text-white font-semibold rounded-lg hover:bg-orange-700 transition">
                ✓ Confirm Resignation
            </button>
            <a href="{{ route('employees.index') }}" class="flex-1 px-6 py-3 bg-gray-400 text-white font-semibold rounded-lg hover:bg-gray-500 transition text-center">
                ✕ Cancel
            </a>
        </div>
    </form>
</div>
@endsection