<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
  {{-- Nom --}}
  <div>
    <label for="nom" class="block text-sm font-medium text-gray-700">Nom<span class="text-red-500">*</span></label>
    <input id="nom" name="nom" type="text"
      value="{{ old('nom', $donateur->nom ?? '') }}"
      placeholder="Ex : DIOP"
      required
      class="mt-1 block w-full rounded-md border-gray-300 shadow-sm px-3 py-2 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" />
    @error('nom')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
  </div>

  {{-- Prénom --}}
  <div>
    <label for="prenom" class="block text-sm font-medium text-gray-700">Prénom<span class="text-red-500">*</span></label>
    <input id="prenom" name="prenom" type="text"
      value="{{ old('prenom', $donateur->prenom ?? '') }}"
      placeholder="Ex : Fatou"
      required
      class="mt-1 block w-full rounded-md border-gray-300 shadow-sm px-3 py-2 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" />
    @error('prenom')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
  </div>

  {{-- Genre --}}
  <div>
    <label for="sexe" class="block text-sm font-medium text-gray-700">Genre<span class="text-red-500">*</span></label>
    <select id="sexe" name="sexe" required
      class="mt-1 block w-full rounded-md border-gray-300 shadow-sm p-2 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500">
      <option value="">-- Sélectionnez --</option>
      <option value="M" {{ old('sexe', $donateur->sexe ?? '') == 'M' ? 'selected' : '' }}>Homme</option>
      <option value="F" {{ old('sexe', $donateur->sexe ?? '') == 'F' ? 'selected' : '' }}>Femme</option>
    </select>
    @error('sexe')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
  </div>

  {{-- Email --}}
  <div>
    <label for="email" class="block text-sm font-medium text-gray-700">Email</label>
    <input id="email" name="email" type="email"
      value="{{ old('email', $donateur->email ?? '') }}"
      placeholder="exemple@domaine.com"
      class="mt-1 block w-full rounded-md border-gray-300 shadow-sm px-3 py-2 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" />
    @error('email')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
  </div>

  <div>
    <label class="block text-sm font-medium text-gray-700">Fonction</label>
    <input name="fonction" value="{{ old('fonction', $donateur->fonction ?? '') }}"
          class="mt-1 block w-full rounded border-gray-300 focus:border-indigo-500 focus:ring-indigo-500" />
    @error('fonction')<p class="text-red-600 text-sm">{{ $message }}</p>@enderror
  </div>

  {{-- Téléphone --}}
  <div>
    <label for="telephone" class="block text-sm font-medium text-gray-700">Téléphone</label>
    <input id="telephone" name="telephone" type="tel"
      value="{{ old('telephone', $donateur->telephone ?? '') }}"
      placeholder="229xxxxxxxx"
      pattern="229[0-9]{8}"
      class="mt-1 block w-full rounded-md border-gray-300 shadow-sm px-3 py-2 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" />
    <p class="mt-1 text-xs text-gray-500">Format : 229xxxxxxxx</p>
    @error('telephone')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
  </div>

  {{-- Groupes --}}
  <div class="md:col-span-2">
    <label for="groupes" class="block text-sm font-medium text-gray-700">Groupes</label>
    <input id="groupes" name="groupes" type="text"
      value="{{ old('groupes', isset($donateur) ? $donateur->groups->pluck('name')->join(';') : '') }}"
      placeholder="Ex : Campagne A; VIP; Presse"
      class="mt-1 block w-full rounded-md border-gray-300 shadow-sm px-3 py-2 focus:outline-none focus:ring-indigo-500 focus:border-indigo-500" />
    <p class="mt-1 text-xs text-gray-500">Séparez plusieurs groupes par un point-virgule (;).</p>
    @error('groupes')<p class="mt-1 text-sm text-red-600">{{ $message }}</p>@enderror
  </div>
</div>
