@extends('frontend.layouts.master')
@section('title') Teams @endsection
@section('main-content')

<div id="banner-area">
    <img src="{{ asset('frontend/images/banner/banner1.jpg') }}" alt=""/>
    <div class="parallax-overlay"></div>
    <!-- Subpage title start -->
    <div class="banner-title-content">
        <div class="text-center">
            <h2>Our Teams</h2>
            <ul class="breadcrumb">
                <li><a href="{{ route('home') }}">Home</a></li>
                <li>Our Teams</li>
            </ul>
        </div>
    </div><!-- Subpage title end -->
</div><!-- Banner area end -->

<!-- Main container start -->
<section id="main-container">
    <div class="container">

        <div class="row text-center">
            <div class="col-md-12 heading">
                <div class="isotope-nav" data-isotope-nav="isotope">
                    <ul>
                        @foreach(Helper::teamCategoryList('categories') as $category)
                            <li>
                                <a class="{{ Request::path() == 'team.category.'.$category['slug'] ? 'active' : '' }}"
                                   href="{{ route('team.category', $category['slug']) }}"
                                   data-filter=".{{ $category['slug'] }}">
                                    {{ $category->title }}
                                </a>
                            </li>
                        @endforeach
                    </ul>
                </div>
            </div>
        </div>
        
        <div class="row">
            <div class="col-md-12">
                <div class="category-title">
                    <h2>
                        @if(isset($selectedCategory) && $selectedCategory->slug !== 'directors')
                            {{ $selectedCategory->title }}
                        @else
                            Directors <!-- Display the default category name -->
                        @endif
                    </h2>
                </div>
            </div>
        </div>

        <div class="row text-center">
            @if($teams)
                @foreach($teams as $team)
                    @if($team->teamcat_info->slug == 'directors')
                        <!-- Directors -->
                        <div class="col-md-6 col-sm-6">
                            <div class="team team-list wow slideInLeft">
                                <div class="img-hexagon">
                                    @php
                                        $photo=explode(',',$team->photo);
                                    @endphp
                                    <img src="{{ Storage::url($team->photo) }}" alt="{{ Storage::url($team->photo) }}">
                                    <span class="img-top"></span>
                                    <span class="img-bottom"></span>
                                </div>
                                <div class="team-content">
                                    <h3>{{$team->name}}</h3>
                                    <p>{{$team->position}}</p>
                                    <p>{{$team->email}}</p>
                                </div>
                            </div>
                        </div>
                    @elseif($team->teamcat_info->slug == 'managers')
                        <!-- Managers -->
                        <div class="col-md-6 col-sm-6">
                            <div class="team team-list wow slideInLeft">
                                <div class="img-hexagon">
                                    @php
                                        $photo=explode(',',$team->photo);
                                    @endphp
                                    <img src="{{ Storage::url($team->photo) }}" alt="{{ Storage::url($team->photo) }}">
                                    <span class="img-top"></span>
                                    <span class="img-bottom"></span>
                                </div>
                                <div class="team-content">
                                    <h3>{{$team->name}}</h3>
                                    <p>{{$team->position}}</p>
                                    <p>{{$team->email}}</p>
                                </div>
                            </div>
                        </div>
                    @elseif($team->teamcat_info->slug == 'officers')
                        <!-- Officers -->
                        <div class="col-md-3 col-sm-6">
                            <div class="team wow slideInLeft">
                                <div class="img-hexagon">
                                    @php
                                        $photo=explode(',',$team->photo);
                                    @endphp
                                    <img src="{{ Storage::url($team->photo) }}" alt="{{ Storage::url($team->photo) }}">
                                    <span class="img-top"></span>
                                    <span class="img-bottom"></span>
                                </div>
                                <div class="team-content">
                                    <h3>{{$team->name}}</h3>
                                    <p>{{$team->position}}</p>
                                    <p>{{$team->email}}</p>
                                </div>
                            </div>
                        </div>
                    @endif
                @endforeach
            @endif
        </div><!--/ Content row end -->

    </div><!--/ container end -->

</section><!--/ Main container end -->

@endsection