@extends('layouts.app')
@section('title', 'Members')
@section('styles')
    <link rel="stylesheet" type="text/css" href="{{ asset('') }}assets/css/style.min.css">
@endsection
@section('content')
    <main class="main">
        <div class="shop-default-banner shop-boxed-banner banner d-flex align-items-center mb-6"
            style="background-image: url(assets/images/star1.png);background-size:contain;background-color: #fbfbfd;height: 170px;">
            <div class="container banner-content">
                <h4 class="banner-subtitle text-center" style="font-size: 27px;">List Of Managing Committee 2023-25</h4>
            </div>
        </div>
        <!-- Start of Breadcrumb -->
        <nav class="breadcrumb-nav">
            <div class="container-fluid">
                <ul class="breadcrumb bb-no">
                    <li><a href="{{ route('home') }}">Home</a></li>
                    <li>Members</li>
                </ul>
            </div>
        </nav>
        <!-- End of Breadcrumb -->

        <!-- Start of Page Content -->
        <div class="page-content mb-10 mt-2">
            <!-- Start of Shop Banner -->
            <!-- End of Shop Banner -->
            <div class="container">

                <section class="mt-10 pt-1 mb-10 pb-1">

                    <div class="row justify-content-center">
                        @foreach ($line1 as $l1)
                            <div class="category-wrap mb-2 col-md-3">
                                <div class="category category-default1 category-absolute br-sm">
                                    <a href="#">
                                        <figure class="category-media">
                                            <img src="{{ asset("storage/$l1->images") }}" alt="{{ $l1->name }}" width="295"
                                                height="295" style="background-color: #C3C8CE;" />
                                        </figure>
                                    </a>
                                    <div class="category-content">
                                        <h4 class="category-name">{{ $l1->name }}</h4>
                                        <span style="font-size: 15px;">{{ $l1->title }}</span>

                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>

                    <div class="row justify-content-center">
                        @foreach ($line2 as $l2)
                            <div class="category-wrap mb-2 col-md-2">
                                <div class="category category-default1 category-absolute br-sm">
                                    <a href="#">
                                        <figure class="category-media">
                                            <img src="{{ asset("storage/$l2->images") }}" alt="{{ $l2->name }}" width="295"
                                                height="295" style="background-color: #C3C8CE;" />
                                        </figure>
                                    </a>
                                    <div class="category-content">
                                        <h4 class="category-name">{{ $l2->name }}</h4>
                                        <span style="font-size: 15px;">{{ $l2->title }}</span>

                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>

                    @if ($line3)
                        <h3 class="text-center mt-6 text-primary">Committee Members</h3>
                        <div class="row justify-content-center">
                            @foreach ($line3 as $l3)
                                <div class="category-wrap mb-2 col-md-2">
                                    <div class="category category-default1 category-absolute br-sm">
                                        <a href="#">
                                            <figure class="category-media">
                                                <img src="{{ asset("storage/$l3->images") }}" alt="{{ $l3->name }}" width="295"
                                                    height="295" style="background-color: #C3C8CE;" />
                                            </figure>
                                        </a>
                                        <div class="category-content">
                                            <h4 class="category-name">{{ $l3->name }}</h4>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    @endif
                </section>
                <!-- End of Element Section -->
            </div>
        </div>
        <!-- End of Page Content -->
    </main>
@endsection