@extends('layouts.apps')
@section('title', 'Pastor Profile - Africa Inland Church Tanzania(AICT)')
@section('title', $pastor->full_name . ' Profile')

@section('content')
<div class="container py-5">
  <div class="row">

    {{-- Left: Photo + Biography + Photos --}}
    <div class="col-md-4">
      {{-- Main Photo --}}
      <div class="thumbnail">
        <img src="{{ asset('storage/' . $pastor->photo) }}" alt="{{ $pastor->full_name }}" class="img-responsive">
      </div>

      {{-- Biography --}}
      <hr>
      <h4>Biography</h4>
      <p>{{ $pastor->biography ?? 'No biography provided.' }}</p>

      {{-- Additional Photos --}}
      <h4>Photos</h4>
      @if($pastor->photos && $pastor->photos->isNotEmpty())
        <div class="row">
          @foreach($pastor->photos as $photo)
            <div class="col-xs-6">
              <img src="{{ asset('storage/' .$photo->image_path) }}" class="img-responsive img-thumbnail">
            </div>
          @endforeach
        </div>
      @else
        <p class="text-muted">No additional photos.</p>
      @endif
    </div>

    {{-- Center: Details --}}
    <div class="col-md-6">
      <h2>{{ $pastor->full_name }}</h2>
      <p><strong>Title:</strong> Pastor</p>
      <p><strong>Date of Birth:</strong> {{ \Carbon\Carbon::parse($pastor->dob)->format('d/m/Y') }}</p>
      <p><strong>Married To:</strong> {{ $pastor->married_to ?? 'N/A' }}</p>

      <p><strong>Local Church:</strong> {{ $pastor->church->name ?? 'N/A' }}</p>
      <p><strong>Pastorate:</strong> {{ $pastor->church->pastorate->name ?? 'N/A' }}</p>
      <p><strong>Diocese:</strong> {{ $pastor->church->pastorate->diocese->name ?? 'N/A' }}</p>
    </div>

    {{-- Right: Quick Links --}}
    <div class="col-md-2">
      <h4>Quick Links</h4>
      <ul class="list-unstyled">
        <li><a href="{{ route('frontend.show-bishop') }}">Bishops</a></li>
        <li><a href="{{ route('frontend.show-bishop') }}">Pastors</a></li>
        <li><a href="{{ route('frontend.show-bishop') }}">Department Leaders</a></li>
      </ul>
    </div>

  </div>
</div>
@endsection