@extends('layouts.app')

@section('title', isset($employee) ? 'Edit Employee' : 'Add Employee')

@section('content')
<div class="space-y-6">
    <!-- Page Header -->
    <div class="bg-white rounded-lg shadow p-6">
        <div class="flex items-center justify-between">
            <div>
                <h1 class="text-2xl font-bold text-gray-900">
                    @if(isset($employee))
                        Edit Employee
                    @else
                        Add Employee
                    @endif
                </h1>
                <p class="mt-1 text-sm text-gray-500">
                    @if(isset($employee))
                        Update employee information
                    @else
                        Create a new employee record
                    @endif
                </p>
            </div>
            <div class="flex space-x-3">
                <a href="{{ route('employees.index') }}" class="px-4 py-2 bg-gray-600 text-white rounded-lg hover:bg-gray-700 transition-colors duration-200">
                    <i class="fas fa-arrow-left mr-2"></i>Back to List
                </a>
            </div>
        </div>
    </div>

    <!-- Form -->
    <div class="bg-white rounded-lg shadow p-6">
        <form action="{{ isset($employee) ? route('employees.update', $employee->id) : route('employees.store') }}" method="POST" enctype="multipart/form-data" class="space-y-8">
            @csrf
            @if(isset($employee))
                @method('PUT')
            @endif

            <!-- Personal Information -->
            <div class="border-b border-gray-200 pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-blue-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-user text-blue-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Personal Information</h3>
                        <p class="text-sm text-gray-500">Basic employee details and contact information</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="first_name" class="block text-sm font-medium text-gray-700">First Name</label>
                        <input type="text" id="first_name" name="first_name" value="{{ old('first_name', $employee->first_name ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('first_name') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter First Name">
                        @error('first_name')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="last_name" class="block text-sm font-medium text-gray-700">Last Name</label>
                        <input type="text" id="last_name" name="last_name" value="{{ old('last_name', $employee->last_name ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('last_name') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Last Name">
                        @error('last_name')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="email" class="block text-sm font-medium text-gray-700">Email</label>
                        <input type="email" id="email" name="email" value="{{ old('email', $employee->email ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('email') border-red-500 focus:ring-red-500 @enderror" placeholder="john.doe@example.com">
                        @error('email')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="password" class="block text-sm font-medium text-gray-700">Password</label>
                        <input type="password" id="password" name="password" 
                               placeholder="{{ isset($employee) ? 'Leave blank to keep current' : 'Min. 8 characters' }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('password') border-red-500 focus:ring-red-500 @enderror">
                        @error('password')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="phone" class="block text-sm font-medium text-gray-700">Phone</label>
                        <input type="tel" id="phone" name="phone" value="{{ old('phone', isset($employee) && $employee->profile ? $employee->profile->phone : '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('phone') border-red-500 focus:ring-red-500 @enderror" placeholder="+919876543210">
                        @error('phone')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="date_of_birth" class="block text-sm font-medium text-gray-700">Date of Birth</label>
                        <input type="date" id="date_of_birth" name="date_of_birth" value="{{ old('date_of_birth', isset($employee) && $employee->profile && $employee->profile->date_of_birth ? $employee->profile->date_of_birth->format('Y-m-d') : '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('date_of_birth') border-red-500 focus:ring-red-500 @enderror">
                        @error('date_of_birth')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Work Information -->
            <div class="border-b border-gray-200 pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-emerald-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-briefcase text-emerald-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Work Information</h3>
                        <p class="text-sm text-gray-500">Job details and employment information</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="department_id" class="block text-sm font-medium text-gray-700">Department</label>
                        <select id="department_id" name="department_id" 
                                class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('department_id') border-red-500 focus:ring-red-500 @enderror">
                            <option value="">Select Department</option>
                            @foreach($departments as $department)
                                <option value="{{ $department->id }}" {{ old('department_id', isset($employee) && $employee->departments->first() ? $employee->departments->first()->id : '') == $department->id ? 'selected' : '' }}>
                                    {{ $department->name }}
                                </option>
                            @endforeach
                        </select>
                        @error('department_id')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="designation_id" class="block text-sm font-medium text-gray-700">Designation</label>
                        <select id="designation_id" name="designation_id" 
                                class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('designation_id') border-red-500 focus:ring-red-500 @enderror">
                            <option value="">Select Designation</option>
                            @foreach($designations as $designation)
                                <option value="{{ $designation->id }}" {{ old('designation_id', isset($employee) && $employee->designations->first() ? $employee->designations->first()->id : '') == $designation->id ? 'selected' : '' }}>
                                    {{ $designation->name }}
                                </option>
                            @endforeach
                        </select>
                        @error('designation_id')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="join_date" class="block text-sm font-medium text-gray-700">Join Date</label>
                        <input type="date" id="join_date" name="join_date" value="{{ old('join_date', isset($employee) && $employee->profile && $employee->profile->join_date ? $employee->profile->join_date->format('Y-m-d') : '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('join_date') border-red-500 focus:ring-red-500 @enderror">
                        @error('join_date')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="annual_ctc" class="block text-sm font-medium text-gray-700">Annual CTC (₹)</label>
                        <input type="number" id="annual_ctc" name="annual_ctc" value="{{ old('annual_ctc', isset($employee) && $employee->profile ? $employee->profile->annual_ctc : '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('annual_ctc') border-red-500 focus:ring-red-500 @enderror" placeholder="500000">
                        @error('annual_ctc')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="petrol_allowance" class="block text-sm font-medium text-gray-700">Petrol/Conveyance Allowance (Monthly ₹)</label>
                        <input type="number" id="petrol_allowance" name="petrol_allowance" value="{{ old('petrol_allowance', isset($employee) && $employee->profile ? $employee->profile->petrol_allowance : 0) }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('petrol_allowance') border-red-500 focus:ring-red-500 @enderror" placeholder="2000">
                        @error('petrol_allowance')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="status_id" class="block text-sm font-medium text-gray-700">Status</label>
                        <select id="status_id" name="status_id" 
                                class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('status_id') border-red-500 focus:ring-red-500 @enderror">
                            <option value="">Select Status</option>
                            @foreach($statuses as $status)
                                <option value="{{ $status->id }}" {{ old('status_id', $employee->status_id ?? '') == $status->id ? 'selected' : '' }}>
                                    {{ $status->name }}
                                </option>
                            @endforeach
                        </select>
                        @error('status_id')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Indian Compliance -->
            <div class="border-b border-gray-200 pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-amber-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-landmark text-amber-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Indian Compliance</h3>
                        <p class="text-sm text-gray-500">Statutory compliance and identification details</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="pan_number" class="block text-sm font-medium text-gray-700">PAN Number *</label>
                        <input type="text" id="pan_number" name="pan_number" value="{{ old('pan_number', $employee->profile->pan_number ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('pan_number') border-red-500 focus:ring-red-500 @enderror" placeholder="ABCDE1234F">
                        @error('pan_number')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="aadhar_number" class="block text-sm font-medium text-gray-700">Aadhaar Number *</label>
                        <input type="text" id="aadhar_number" name="aadhar_number" value="{{ old('aadhar_number', $employee->profile->aadhar_number ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('aadhar_number') border-red-500 focus:ring-red-500 @enderror" placeholder="1234-5678-9012">
                        @error('aadhar_number')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="pf_number" class="block text-sm font-medium text-gray-700">PF Number (Optional)</label>
                        <input type="text" id="pf_number" name="pf_number" value="{{ old('pf_number', $employee->profile->pf_number ?? '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('pf_number') border-red-500 focus:ring-red-500 @enderror" placeholder="MH/BAN/1234567/123">
                        @error('pf_number')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="esi_number" class="block text-sm font-medium text-gray-700">ESI Number (Optional)</label>
                        <input type="text" id="esi_number" name="esi_number" value="{{ old('esi_number', $employee->profile->esi_number ?? '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('esi_number') border-red-500 focus:ring-red-500 @enderror" placeholder="1234567890">
                        @error('esi_number')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="pf_entitled" class="block text-sm font-medium text-gray-700">PF (Provident Fund) Compliance</label>
                        <select id="pf_entitled" name="pf_entitled" required
                                class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('pf_entitled') border-red-500 focus:ring-red-500 @enderror">
                            <option value="1" {{ old('pf_entitled', $employee->profile->pf_entitled ?? 1) == 1 ? 'selected' : '' }}>Compliance - Employee is entitled to PF benefits</option>
                            <option value="0" {{ old('pf_entitled', $employee->profile->pf_entitled ?? 1) == 0 ? 'selected' : '' }}>Non-Compliance - Employee is not entitled to PF benefits</option>
                        </select>
                        @error('pf_entitled')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="esi_entitled" class="block text-sm font-medium text-gray-700">ESI (Employee State Insurance) Compliance</label>
                        <select id="esi_entitled" name="esi_entitled" required
                                class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('esi_entitled') border-red-500 focus:ring-red-500 @enderror">
                            <option value="1" {{ old('esi_entitled', $employee->profile->esi_entitled ?? 1) == 1 ? 'selected' : '' }}>Compliance - Employee is entitled to ESI benefits</option>
                            <option value="0" {{ old('esi_entitled', $employee->profile->esi_entitled ?? 1) == 0 ? 'selected' : '' }}>Non-Compliance - Employee is not entitled to ESI benefits</option>
                        </select>
                        @error('esi_entitled')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Bank Details -->
            <div class="border-b border-gray-200 pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-purple-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-university text-purple-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Bank Details</h3>
                        <p class="text-sm text-gray-500">Bank account information for salary payments</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="account_number" class="block text-sm font-medium text-gray-700">Bank Account Number</label>
                        <input type="text" id="account_number" name="account_number" value="{{ old('account_number', $employee->bankDetails->account_number ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('account_number') border-red-500 focus:ring-red-500 @enderror" placeholder="1234567890123">
                        @error('account_number')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="account_holder_name" class="block text-sm font-medium text-gray-700">Account Holder Name</label>
                        <input type="text" id="account_holder_name" name="account_holder_name" value="{{ old('account_holder_name', $employee->bankDetails->account_holder_name ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('account_holder_name') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Account Holder Name">
                        @error('account_holder_name')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="bank_name" class="block text-sm font-medium text-gray-700">Bank Name</label>
                        <input type="text" id="bank_name" name="bank_name" value="{{ old('bank_name', $employee->bankDetails->bank_name ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('bank_name') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Bank Name">
                        @error('bank_name')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="ifsc_code" class="block text-sm font-medium text-gray-700">IFSC Code</label>
                        <input type="text" id="ifsc_code" name="ifsc_code" value="{{ old('ifsc_code', $employee->bankDetails->ifsc_code ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('ifsc_code') border-red-500 focus:ring-red-500 @enderror" placeholder="SBIN0000123">
                        @error('ifsc_code')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Address Information -->
            <div class="border-b border-gray-200 pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-indigo-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-home text-indigo-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Address Information</h3>
                        <p class="text-sm text-gray-500">Residential and permanent address details</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="current_street_address" class="block text-sm font-medium text-gray-700">Current Street Address</label>
                        <input type="text" id="current_street_address" name="current_street_address" value="{{ old('current_street_address', $employee->profile->current_street_address ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('current_street_address') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Current Street Address">
                        @error('current_street_address')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="current_city" class="block text-sm font-medium text-gray-700">Current City</label>
                        <input type="text" id="current_city" name="current_city" value="{{ old('current_city', $employee->profile->current_city ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('current_city') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Current City">
                        @error('current_city')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="current_state" class="block text-sm font-medium text-gray-700">Current State</label>
                        <input type="text" id="current_state" name="current_state" value="{{ old('current_state', $employee->profile->current_state ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('current_state') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Current State">
                        @error('current_state')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="current_pincode" class="block text-sm font-medium text-gray-700">Current Pincode</label>
                        <input type="text" id="current_pincode" name="current_pincode" value="{{ old('current_pincode', $employee->profile->current_pincode ?? '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('current_pincode') border-red-500 focus:ring-red-500 @enderror" placeholder="400001">
                        @error('current_pincode')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>

                <div class="mt-6">
                    <label class="inline-flex items-center">
                        <input type="checkbox" name="permanent_same_as_current" value="1" {{ old('permanent_same_as_current', $employee->profile->permanent_same_as_current ?? false) ? 'checked' : '' }}
                               class="rounded border-gray-300 text-primary-600 shadow-sm focus:border-primary-500 focus:ring-primary-500">
                        <span class="ml-2 text-sm text-gray-700">Permanent address is same as current address</span>
                    </label>
                </div>

                <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mt-6">
                    <div>
                        <label for="permanent_street_address" class="block text-sm font-medium text-gray-700">Permanent Street Address</label>
                        <input type="text" id="permanent_street_address" name="permanent_street_address" value="{{ old('permanent_street_address', $employee->profile->permanent_street_address ?? '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('permanent_street_address') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Permanent Street Address">
                        @error('permanent_street_address')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="permanent_city" class="block text-sm font-medium text-gray-700">Permanent City</label>
                        <input type="text" id="permanent_city" name="permanent_city" value="{{ old('permanent_city', $employee->profile->permanent_city ?? '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('permanent_city') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Permanent City">
                        @error('permanent_city')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="permanent_state" class="block text-sm font-medium text-gray-700">Permanent State</label>
                        <input type="text" id="permanent_state" name="permanent_state" value="{{ old('permanent_state', $employee->profile->permanent_state ?? '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('permanent_state') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Permanent State">
                        @error('permanent_state')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="permanent_pincode" class="block text-sm font-medium text-gray-700">Permanent Pincode</label>
                        <input type="text" id="permanent_pincode" name="permanent_pincode" value="{{ old('permanent_pincode', $employee->profile->permanent_pincode ?? '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('permanent_pincode') border-red-500 focus:ring-red-500 @enderror" placeholder="400001">
                        @error('permanent_pincode')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Emergency Contacts -->
            <div class="pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-red-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-phone-alt text-red-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Emergency Contacts</h3>
                        <p class="text-sm text-gray-500">Contact information for emergency situations</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="primary_contact_name" class="block text-sm font-medium text-gray-700">Primary Emergency Contact Name</label>
                        <input type="text" id="primary_contact_name" name="primary_contact_name" value="{{ old('primary_contact_name', isset($employee) ? ($employee->contacts->where('is_primary', true)->first()->name ?? '') : '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('primary_contact_name') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Primary Contact Name">
                        @error('primary_contact_name')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="primary_contact_relationship" class="block text-sm font-medium text-gray-700">Relationship</label>
                        <input type="text" id="primary_contact_relationship" name="primary_contact_relationship" value="{{ old('primary_contact_relationship', isset($employee) ? ($employee->contacts->where('is_primary', true)->first()->relationship ?? '') : '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('primary_contact_relationship') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Relationship">
                        @error('primary_contact_relationship')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="primary_contact_phone" class="block text-sm font-medium text-gray-700">Contact Phone</label>
                        <input type="tel" id="primary_contact_phone" name="primary_contact_phone" value="{{ old('primary_contact_phone', isset($employee) ? ($employee->contacts->where('is_primary', true)->first()->phone ?? '') : '') }}" required
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('primary_contact_phone') border-red-500 focus:ring-red-500 @enderror" placeholder="+919876543210">
                        @error('primary_contact_phone')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="secondary_contact_name" class="block text-sm font-medium text-gray-700">Secondary Emergency Contact Name</label>
                        <input type="text" id="secondary_contact_name" name="secondary_contact_name" value="{{ old('secondary_contact_name', isset($employee) ? ($employee->contacts->where('is_primary', false)->first()->name ?? '') : '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('secondary_contact_name') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Secondary Contact Name">
                        @error('secondary_contact_name')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="secondary_contact_relationship" class="block text-sm font-medium text-gray-700">Relationship</label>
                        <input type="text" id="secondary_contact_relationship" name="secondary_contact_relationship" value="{{ old('secondary_contact_relationship', isset($employee) ? ($employee->contacts->where('is_primary', false)->first()->relationship ?? '') : '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('secondary_contact_relationship') border-red-500 focus:ring-red-500 @enderror" placeholder="Enter Relationship">
                        @error('secondary_contact_relationship')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="secondary_contact_phone" class="block text-sm font-medium text-gray-700">Contact Phone</label>
                        <input type="tel" id="secondary_contact_phone" name="secondary_contact_phone" value="{{ old('secondary_contact_phone', isset($employee) ? ($employee->contacts->where('is_primary', false)->first()->phone ?? '') : '') }}"
                               class="mt-1 block w-full px-3 py-2 border border-gray-300 rounded-lg shadow-sm focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-primary-500 sm:text-sm @error('secondary_contact_phone') border-red-500 focus:ring-red-500 @enderror" placeholder="+919876543210">
                        @error('secondary_contact_phone')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Employee Documents -->
            <div class="pb-8">
                <div class="flex items-center mb-6">
                    <div class="bg-sky-100 rounded-lg p-3 mr-4">
                        <i class="fas fa-file-alt text-sky-600 text-xl"></i>
                    </div>
                    <div>
                        <h3 class="text-lg font-semibold text-gray-900">Employee Documents</h3>
                        <p class="text-sm text-gray-500">Upload required employee documents</p>
                    </div>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
                    <div>
                        <label for="aadhaar_document" class="block text-sm font-medium text-gray-700">Aadhaar Card Copy {{ isset($employee) ? '(Optional)' : '(Required)' }}</label>
                        <input type="file" id="aadhaar_document" name="aadhaar_document"
                               class="mt-1 block w-full text-sm text-gray-700 @error('aadhaar_document') border-red-500 @enderror">
                        @error('aadhaar_document')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="pan_document" class="block text-sm font-medium text-gray-700">PAN Card Copy {{ isset($employee) ? '(Optional)' : '(Required)' }}</label>
                        <input type="file" id="pan_document" name="pan_document"
                               class="mt-1 block w-full text-sm text-gray-700 @error('pan_document') border-red-500 @enderror">
                        @error('pan_document')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="cv_document" class="block text-sm font-medium text-gray-700">CV/Resume {{ isset($employee) ? '(Optional)' : '(Required)' }}</label>
                        <input type="file" id="cv_document" name="cv_document"
                               class="mt-1 block w-full text-sm text-gray-700 @error('cv_document') border-red-500 @enderror">
                        @error('cv_document')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="address_proof_document" class="block text-sm font-medium text-gray-700">Address Proof</label>
                        <input type="file" id="address_proof_document" name="address_proof_document"
                               class="mt-1 block w-full text-sm text-gray-700 @error('address_proof_document') border-red-500 @enderror">
                        @error('address_proof_document')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="education_documents" class="block text-sm font-medium text-gray-700">Educational Certificates</label>
                        <input type="file" id="education_documents" name="education_documents[]" multiple
                               class="mt-1 block w-full text-sm text-gray-700 @error('education_documents.*') border-red-500 @enderror">
                        @error('education_documents.*')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                    <div>
                        <label for="experience_documents" class="block text-sm font-medium text-gray-700">Experience Certificates</label>
                        <input type="file" id="experience_documents" name="experience_documents[]" multiple
                               class="mt-1 block w-full text-sm text-gray-700 @error('experience_documents.*') border-red-500 @enderror">
                        @error('experience_documents.*')
                            <p class="mt-1 text-sm text-red-600">{{ $message }}</p>
                        @enderror
                    </div>
                </div>
            </div>

            <!-- Form Actions -->
            <div class="flex justify-between items-center pt-8 border-t border-gray-200">
                <div class="text-sm text-gray-500">
                    <i class="fas fa-info-circle mr-1"></i>
                    Required fields are marked with *
                </div>
                <div class="flex space-x-3">
                    <a href="{{ route('employees.index') }}" class="px-6 py-3 bg-gray-200 text-gray-700 rounded-lg hover:bg-gray-300 transition-colors duration-200 font-medium">
                        <i class="fas fa-times mr-2"></i> Cancel
                    </a>
                    <button type="submit" class="px-6 py-3 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition-colors duration-200 font-medium shadow-sm hover:shadow-md">
                        <i class="fas fa-save mr-2"></i>
                        @if(isset($employee))
                            Update Employee
                        @else
                            Create Employee
                        @endif
                    </button>
                </div>
            </div>
        </form>
    </div>
</div>
@endsection