@extends('layouts.apps')
@section('title', 'Pastors - Africa Inland Church Tanzania(AICT)')
@section('title', 'Pastors')

@section('content')
<div class="container py-5">
  <h2 class="text-center">Pastors</h2>

  {{-- Filter --}}
  <form method="GET" action="{{ route('frontend.show-pastor') }}" class="form-inline text-center mb-4">
    <label for="diocese">Choose Diocese:</label>
    <select name="diocese_id" class="form-control" id="diocese">
      <option value="">-- Select Diocese --</option>
      @foreach($dioceses as $diocese)
        <option value="{{ $diocese->id }}" {{ request('diocese_id') == $diocese->id ? 'selected' : '' }}>
          {{ $diocese->name }}
        </option>
      @endforeach
    </select>
    <button type="submit" class="btn btn-primary">Select</button>
  </form>

  {{-- Pastors List --}}
  <div class="row">
    @forelse($pastors as $pastor)
      <div class="col-sm-3 text-center">
        <div class="thumbnail">
          <img src="{{ Storage::url($pastor->photo) }}" class="img-responsive" style="height:200px; object-fit:cover;">
          <div class="caption">
            <h4>Pastor</h4>
            <strong>{{ $pastor->full_name }}</strong><br>
            <em>{{ $pastor->church->pastorate->name ?? 'Unknown Pastorate' }}</em><br>
            <a href="{{ route('frontend.pastor-profile', $pastor->id) }}" class="btn btn-xs btn-default">Read more</a>
          </div>
        </div>
      </div>
    @empty
      <p class="text-muted text-center">No pastors found for this diocese.</p>
    @endforelse
  </div>
</div>

@endsection