@extends('frontend.layouts.app')
@section('content')
    <div class="container-fluid page-header-modern">
        <div class="container">
            <h1>Member</h1>
            <ol class="breadcrumb breadcrumb-modern">
                <li class="breadcrumb-item"><a href="{{ url('/') }}">Home</a></li>
                <li class="breadcrumb-item">Pages</li>
                <li class="breadcrumb-item active">Team</li>
            </ol>
        </div>
    </div>

    <div class="container-fluid team-section">
        <div class="container">
            <div class="section-header">
                <h4 class="text-primary">Our Team</h4>
                <h1>Meet Our Team Members</h1>
                <p>Get to know the passionate individuals driving Bangladesh Society Bahrain forward with purpose and unity.
                </p>
            </div>

            <div class="row g-4">
                @foreach ($members as $member)
                    <div class="col-6 col-sm-4 col-md-3 col-lg-2">
                        <div class="team-card h-100">
                            <img src="{{ asset('storage/' . $member->photo) }}" alt="{{ $member->full_name }}"
                                class="team-image">
                            <div>
                                <div class="team-name">
                                    <a href="{{ route('memebr-profile', Crypt::encryptString($member->id)) }}">
                                     {{ $member->full_name }}
                                    </a>
                                   
                                </div>
                                <div class="team-role">{{ $member->occupation }}</div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </div>
@endsection