@extends('front.layouts.master')
@section('title', isset($title) ? $title : 'Home')
@section('description', isset($description) ? $description : '')
@section('keywords', isset($keywords) ? $keywords : '')
@section('content')
    <!-- breadcrumb area start here  -->
    <div class="breadcrumb-area">
        <div class="container">
            <div class="breadcrumb-wrap text-center">
                <h2 class="page-title">{{ __('Grassroot support') }}</h2>
                <ul class="breadcrumb-pages">
                    <li class="page-item"><a class="page-item-link" href="{{ route('front') }}">{{ __('Home') }}</a></li>
                    <li class="page-item">{{ __('Grassroot support') }}</li>
                </ul>
            </div>
        </div>
    </div>
    <!-- breadcrumb area end here  -->
    <div class="grassroot-support-wrapper">
        <div class="first-content-warpper">
            <div class="section">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-12 col-lg-6 order-2 order-lg-1 rscnGrassTxt">
                            {!! langConverter(
                                isset($natureconversvationdata['en_grassroot_descriprion'])
                                    ? $natureconversvationdata['en_grassroot_descriprion']
                                    : '',
                                isset($natureconversvationdata['fr_grassroot_descriprion'])
                                    ? $natureconversvationdata['fr_grassroot_descriprion']
                                    : '',
                            ) !!}
                        </div>
                        <div class="col-12 col-lg-6 order-1 mb-5 mb-lg-0 order-lg-2">
                            <img src="{{ isset($natureconversvationdata['grassroot_image']) ? asset(IMG_GRASSROOT . $natureconversvationdata['grassroot_image']) : '' }}" class="img-alignment">
                        </div>
                    </div>
                </div>
            </div>
            <div class="title-box">
                <div class="section">
                    <div class="container">
                        <h2>{{ __('What is unique about the sponsorship opportunities RSCN is offering?') }}</h2>
                    </div>
                </div>
            </div>
        </div>
        <div class="secound-content-warpper">
            <div class="section">
                <div class="container-fluid">
                    <div class="row align-items-center">
                        <div class="col-12 col-lg-6">
                            <div class="pilot-list-style rscnGrassrootSponsorship">
                                {!! langConverter(
                                    isset($natureconversvationdata['en_grassroot_sponsorship_left'])
                                        ? $natureconversvationdata['en_grassroot_sponsorship_left']
                                        : '',
                                    isset($natureconversvationdata['fr_grassroot_sponsorship_left'])
                                        ? $natureconversvationdata['fr_grassroot_sponsorship_left']
                                        : '',
                                ) !!}
                            </div>
                        </div>
                        <div class="col-12 col-lg-6">
                            <div class="pilot-list-style rscnGrassrootSponsorship">
                                {!! langConverter(
                                    isset($natureconversvationdata['en_grassroot_sponsorship_right'])
                                        ? $natureconversvationdata['en_grassroot_sponsorship_right']
                                        : '',
                                    isset($natureconversvationdata['fr_grassroot_sponsorship_right'])
                                        ? $natureconversvationdata['fr_grassroot_sponsorship_right']
                                        : '',
                                ) !!}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="third-content-warpper">
            <div class="section pb-0">
                <div class="container">
                    <div class="row align-items-center">
                        <div class="col-12 col-lg-6">
                            <!-- <img src="{{ asset('frontend/assets/images/water-img.png') }}"> -->
                            <img src="{{ isset($natureconversvationdata['grassroot_list_image']) ? asset(IMG_GRASSROOT . $natureconversvationdata['grassroot_list_image']) : '' }}" class="img-grassroot">
                        </div>
                        <div class="col-12 col-lg-6">
                            <div class="check-list-style rscnGrassrootList">
                                {!! langConverter(
                                    isset($natureconversvationdata['en_grassroot_do_list']) ? $natureconversvationdata['en_grassroot_do_list'] : '',
                                    isset($natureconversvationdata['fr_grassroot_do_list']) ? $natureconversvationdata['fr_grassroot_do_list'] : '',
                                ) !!}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @if(count(grasrootCategory()) > 0)
        <div class="forth-content-warpper">
            <div class="container">
                <div class="tabs-box section">
                    <ul class="nav nav-tabs" role="tablist" id="grassroot">
                        @foreach (grasrootCategory() as $category)
                            <li class="nav-item" role="presentation">
                                <a href="{{ route('grassroot.front', $category->id) }}?to=#grassroot">
                                    <button class="rscnGrassrootTab nav-link @if ($category->id == request()->grasscategory) active @endif"
                                        id="new-arrival-tab" data-bs-toggle="tab"
                                        data-bs-target="#{{ $category['en_name'] }}" type="button" role="tab"
                                        aria-controls="{{ $category['en_name'] }}" aria-selected="true">
                                        <div class="image-box">
                                            <img src="{{ asset(IMG_GRASSROOTCATEGORY . $category->icon) }}" class="rscnGrassrootIcon" />
                                        </div>
                                        <span class="rscnGrassTit">{{ langConverter($category->en_name, $category->fr_name) }}</span>
                                    </button>
                                </a>
                            </li>
                        @endforeach
                    </ul>
                    <div class="tab-content" id="myTabContent">
                        <div class="tab-pane fade box-shadow show active p-5" role="tabpanel"
                            aria-labelledby="horchid-categoryome-tab">
                            <div class="emzHistoryBox">
                                <div class="rscnSettingBox">
                                    <img src="{{ asset(IMG_GRASSROOTCATEGORY . $grasscategory->image) }}" class="emzHisImg">
                                    <div class="emzHisDescription rscnGrassBox">
                                        {!! langConverter(
                                            isset($grasscategory->en_description) ? $grasscategory->en_description : '',
                                            isset($grasscategory->fr_description) ? $grasscategory->fr_description : '',
                                        ) !!}
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
    </div>
@endsection