@extends('reachassuree_web/layouts.main')
@section('title', $data['title'])
@section('title', $data['feedback'])
@section('content')

<style>
    .single-review-item {
        background-color: #f1f5fe;
    }

    .col-lg-4.col-sm-6 {

        margin-bottom: 30px;
    }

    p.description {
        white-space: normal;
        word-wrap: break-word;
        height: 150px;
    }
</style>
<!-- Start Page Title Area -->
<div class="page-title-area">
    <div class="container">
        <div class="page-title-content">
            <h2>Client Review</h2>
            <ul>
                <li><a href="{{ route('home.page') }}">Home</a>
                <li class="active">Client Review</li>
            </ul>
        </div>
    </div>
    <img src="{{ asset('rassets/images/subscribe-shape-1.png') }}" alt="Image" class="shape shape-1" data-speed="0.04" data-revert="true">
    <img src="{{ asset('rassets/images/subscribe-shape-2.png') }}" alt="Image" class="shape shape-2" data-speed="0.04" data-revert="true">
</div>
<!-- End Page Title Area -->
<div class="blog-area pt-50 pb-50">
    <div class="container">
        <div class="section-title">
            <h3>See what our clients honestly say about us.</h3>
        </div>
        <div class="row justify-content-center">
            @foreach ($data['feedback'] as $key => $value)
            <div class="col-lg-4 col-sm-6">
                <div class="single-review-item">
                    <div class="review-img">
                        <img src="{{ asset('assets/images/reviewQuote.svg')}}" alt="reviewQuote">
                    </div>
                    @for ($i = 0; $i < $value['rating']; $i++) <li><i class="ri-star-fill"></i></li>
                        @endfor
                        <p class="description" style="font-style: italic;">{{ $value['description'] }}</p>
                        <div class="review-content-text d-flex justify-content-end">
                            <div class="review-icon" style="margin-right: 10px;">
                                <img src="{{ asset('assets/images/userReview.svg')}}" alt="Review Icon">
                            </div>
                            <div class="review-contents">
                                <span>{{ $value['firm_name'] }}</span>
                                <p class="text-sm text-black opacity-8">Read the Success Story</p>
                            </div>
                        </div>
                </div>
            </div>
            @endforeach
        </div>

        <div class=""> {{$data['feedback']->links() }} </div>
    </div>
</div>
</div>
<!-- End Blog Area -->

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="{{ asset('rassets/js/jquery.min.js') }}"></script>
<script src="{{ asset('rassets/js/bootstrap.bundle.min.js') }}"></script>


@endsection