@extends('portal.portal-layout')

@section('pages-content')
    <div class="max-w-[654px]">

        <a type="submit" class="inline-flex gap-4 items-center font-medium text-lg text-primary-600 hover:underline mb-12" href="{{route('references.index')}}">
            <svg class="w-4" fill="none" stroke="currentColor" stroke-width="4" viewBox="0 0 24 24"
                xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
                <path stroke-linecap="round" stroke-linejoin="round" d="M15.75 19.5L8.25 12l7.5-7.5"></path>
            </svg>
            <span>References</span>
        </a>
            
        <h1 class="text-5xl">Past references</h1>

        <div class="breadcrumbs flex gap-4 items-center text-sm mt-6 mb-10">
            <a href="{{route('portal.account')}}">@svg('img/icons/home-alt', 'text-gray-600') </a>
            <a href="{{route('references.index')}}">References</a>
            @svg('img/icons/chevron-right', 'text-blue-500')
            <a href="#">Past references</a>
        </div>

        @foreach ($past_references as $reference)
            <div 
                class="p-6 border rounded-lg shadow text-gray-900 bg-gray-100 flex justify-between items-center mb-5">
                <div>
                    <div class="flex items-center justify-between">
                        <span class="text-lg font-bold">{{$reference->referee_first_name}} {{$reference->referee_last_name}}</span>
                    </div>
                    <div class="flex flex-col">
                        @if($reference->is_referee_unsuitable)
                            <span class="text-base text-red-600 font-semibold my-1">Referee rejected</span>
                        @else
                            <span class="text-base text-red-600 font-semibold my-1">Expired</span>
                            <span class="text-gray-500 text-base">Expired on {{$reference?->expiresOn()?->format('jS F Y')}}</span>
                        @endif
                    </div>
                </div>
                @svg('img/icons/lock-closed')
            </div>
        @endforeach
        @if (count($past_references) < 1)
            <span class="mb-5 text-gray-500">No data available</span><br><br>
        @endif
    </div>
@endsection