@csrf

<div class="mb-4">
    <label for="image" class="block font-medium text-slate-700">Image</label>
    <input type="file" id="image" name="image"
        class="mt-1 block w-full px-3 py-2 placeholder-slate-400 border border-slate-500 rounded-md focus:outline-none focus:shadow focus:border-sky-500 focus:ring-1 focus:ring-sky-500">
    @error('image')
        <p class="text-pink-500 text-sm">{{ $message }}</p>
    @enderror
</div>

<div class="mb-4">
    <label for="name" class="block font-medium text-slate-700">Name</label>
    <input type="text" id="name" name="name"
        class="mt-1 block w-full px-3 py-2 placeholder-slate-400 border border-slate-500 rounded-md focus:outline-none focus:shadow focus:border-sky-500 focus:ring-1 focus:ring-sky-500"
        placeholder="Name"
        value="{{ $member->name ?? null }}">
    @error('name')
        <p class="text-pink-500 text-sm">{{ $message }}</p>
    @enderror
</div>

<div class="mb-4">
    <label for="designation" class="block font-medium text-slate-700">Designation</label>
    <input type="text" id="designation" name="designation"
        class="mt-1 block w-full px-3 py-2 placeholder-slate-400 border border-slate-500 rounded-md focus:outline-none focus:shadow focus:border-sky-500 focus:ring-1 focus:ring-sky-500"
        placeholder="Designation"
        value="{{ $member->designation ?? null }}">
    @error('designation')
        <p class="text-pink-500 text-sm">{{ $message }}</p>
    @enderror
</div>

<div class="flex justify-end">
    <button type="submit" class="bg-green-300 px-5 py-3 rounded-md font-medium text-slate-700">Save</button>
</div>