@extends('layouts.app')

@section('title', __('team.page_title'))
@section('meta_description', __('team.meta_description'))

@section('content')
<div class="edu-breadcrumb-area breadcrumb-style-1 bg-image bg-image--191">
    <div class="container">
        <div class="breadcrumb-inner">
            <div class="page-title">
                <h1 class="title">{{ __('team.page_title') }}</h1>
            </div>
            <ul class="edu-breadcrumb">
                <li class="breadcrumb-item">
                    <a href="{{ route('home') }}">{{ __('team.breadcrumb_home') }}</a>
                </li>
                <li class="separator"><i class="icon-angle-right"></i></li>
                <li class="breadcrumb-item active" aria-current="page">{{ __('team.breadcrumb_team') }}</li>
            </ul>
        </div>
    </div>
</div>

<div class="edu-team-area team-area-1 gap-tb-text">
    <div class="container">
        <!-- <div class="section-title section-center" data-sal-delay="150" data-sal="slide-up" data-sal-duration="800">
            <span class="pre-title">{{ __('team.section_subtitle') }}</span>
            <h2 class="title">{{ __('team.section_title') }}</h2>
            <span class="shape-line"><i class="icon-19"></i></span>
        </div> -->
        
        <div class="row g-5">
            @forelse($members as $member)
            <div class="col-lg-3 col-sm-6 col-12 mb--10" data-sal-delay="150" data-sal="slide-up" data-sal-duration="800">
                <div class="edu-team-grid team-style-1">
                    <div class="inner">
                        <div class="thumbnail-wrap">
                            <div class="thumbnail">
                                <a href="{{ route('team.show', ['slug' => $member->slug]) }}">
                                    @if($member->image_url)
                                    <img src="{{ $member->image_url }}" alt="{{ $member->full_name }}">
                                    @else
                                    <img src="{{ asset('assets/images/no-photo.png') }}" alt="{{ $member->full_name }}">
                                    @endif
                                </a>
                            </div>
                            @if($member->facebook || $member->twitter || $member->linkedin)
                            <ul class="team-share-info">
                                <li><a href="#"><i class="icon-share-alt"></i></a></li>
                                @if($member->facebook)
                                <li><a href="{{ $member->facebook }}" target="_blank" rel="noopener"><i class="icon-facebook"></i></a></li>
                                @endif
                                @if($member->twitter)
                                <li><a href="{{ $member->twitter }}" target="_blank" rel="noopener"><i class="icon-twitter"></i></a></li>
                                @endif
                                @if($member->linkedin)
                                <li><a href="{{ $member->linkedin }}" target="_blank" rel="noopener"><i class="icon-linkedin2"></i></a></li>
                                @endif
                                </ul>
                            @endif
                        </div>
                        <div class="content">
                            <h5 class="title">
                                <a href="{{ route('team.show', ['slug' => $member->slug]) }}">{{ $member->full_name }}</a>
                            </h5>
                            <span class="designation">{{ $member->title }}</span>
                        </div>
                    </div>
                </div>
            </div>
            @empty
            <div class="col-12">
                <div class="alert alert-info text-center">
                    {{ __('team.no_members') }}
                </div>
            </div>
            @endforelse
        </div>

        @if($members->hasPages())
        <div class="row mt-5">
            <div class="col-12">
                <div class="d-flex justify-content-center">
                    {{ $members->withQueryString()->links('layouts.custom-pagination') }}
                </div>
            </div>
        </div>
        @endif
    </div>
</div>
@endsection