@extends('website.layouts.app')
@section('content')
    <section id="solution_banner" class="s_banner_bg">
        <div class="container-fluid banner_height align-content-center">
            <div class="col-lg-10 col-md-12 col-12 mx-auto">
                <div class="row d-flex justify-content-center">
                    <div class="col-xxl-11 col-lg-12 col-md-10 col-12">
                        <div class="row d-flex justify-content-center ">
                            <div class="col-xl-7 col-lg-6  col-md-6 col-12  align-content-center">
                                <div class="row d-flex justify-content-center">
                                    <div class="col-xxl-12 col-xl-12 col-lg-12 ">
                                        <div class=" tabs-content text-md-start text-center">
                                            <h1>{{ $solution->solution_heading_en }}</h1>
                                            {{-- <h6>{{ $solution->solution_description_en }}</h6> --}}
                                            <div class="p_main_div">
                                                @if (count($solutionItems) > 0)
                                                    @foreach ($solutionItems as $item)
                                                        <div class="pt-2 alignsline">
                                                            <img src="{{ asset('website/assets/images/Layer_1.svg') }}"
                                                                class="itm_margin_solution" alt="mark">
                                                            <span class="para_text ps-2">{{ $item->item_en }}</span>
                                                        </div>
                                                    @endforeach
                                                @endif
                                            </div>
                                            <div class="tabs_buttons">
                                                <span class="get_started">
                                                    <a href="{{ $solution->solution_verification_link }}">Verification</a>
                                                </span>
                                                <span class="talk_sales">
                                                    <a href="{{ $solution->solution_equivalency_link }}">Evaluation</a>
                                                </span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl-5 col-lg-6 col-md-6 col-12 align-content-center">
                                <div class="row d-flex justify-content-center">
                                    <div class="col-xxl-12 col-xl-12 col-lg-12 ">
                                        <div class="s_banner_img">
                                            <img src="{{ asset('uploads/solution_page/' . $solution->solution_image) }}"
                                                class="img-fluid" alt="{{ str_replace('-', ' ', pathinfo($solution->solution_image, PATHINFO_FILENAME)) }}" >
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </section>
    @if (count($solutions) > 0)
        @foreach ($solutions as $index => $solution)
            @if ($index % 2 == 0)
                <section id="verification_solutions">
                    <div class="container-fluid">
                        <div class="col-lg-10 col-md-12 col-12 mx-auto">
                            <div class="row d-flex justify-content-center">
                                <div class="col-xxl-11 col-lg-11 col-md-12 col-12">
                                    <div class="row gy-3">
                                        <div class="col-xl-6 col-lg-12 col-md-12 col-md-12 align-content-center">
                                            <div class="row d-flex justify-content-center">
                                                <div class="col-xxl-10 col-xl-11 col-lg-12">
                                                    <div class="v_solutions_img">
                                                        <img src="{{ asset('uploads/solutions/' . $solution->image) }}"
                                                            class="img-fluid w-100" alt="{{ str_replace('-', ' ', pathinfo(substr($solution->image,11), PATHINFO_FILENAME)) }}" />
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xl-6 col-lg-12 col-md-12">
                                            <div class="row d-flex justify-content-center">
                                                <div class="col-xxl-10 col-xl-11 col-lg-12">
                                                    <div class="v_solutions_content text-xl-start text-center">
                                                        <h2>{{ $solution->title_en }}</h2>
                                                        <h6>
                                                            @if ($solution->category)
                                                                {{ $solution->category->title_en }}
                                                            @endif
                                                        </h6>
                                                        <p>{!! $solution->description_en !!}</p>
                                                        <div class="v_solutions_buttons">
                                                            <span class="get_started">
                                                                <a href="{{ $solution->get_started_link }}">Read More</a>
                                                            </span>
                                                            <span class="talk_sales">
                                                                <a href="{{ $solution->talk_sales_link }}">Apply Now</a>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
            @else
                <section id="verification_solutions_2">
                    <div class="container-fluid">
                        <div class="col-lg-10 col-md-12 col-12 mx-auto">
                            <div class="row d-flex justify-content-center">
                                <div class="col-xxl-11 col-lg-11 col-md-12 col-12">
                                    <div class="row gy-3">
                                        <div class="col-xl-6 col-lg-12 col-md-12">
                                            <div class="row d-flex justify-content-center">
                                                <div class="col-xxl-10 col-xl-11 col-lg-12">
                                                    <div class="v_solutions_content text-xl-start text-center">
                                                        <h2>{{ $solution->title_en }}</h2>
                                                        <h6>
                                                            @if ($solution->category)
                                                                {{ $solution->category->title_en }}
                                                            @endif
                                                        </h6>
                                                        <p>{!! $solution->description_en !!}</p>
                                                        <div class="v_solutions_buttons">
                                                            <span class="get_started">
                                                                <a href="{{ $solution->get_started_link }}">Read More</a>
                                                            </span>
                                                            <span class="talk_sales">
                                                                <a href="{{ $solution->talk_sales_link }}">Apply Now</a>
                                                            </span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-xl-6 col-lg-12 col-md-12 align-content-center">
                                            <div class="row d-flex justify-content-center">
                                                <div class="col-xxl-10 col-xl-11 col-lg-12">
                                                    <div class="v_solutions_img">
                                                        <img src="{{ asset('uploads/solutions/' . $solution->image) }}"
                                                            class="img-fluid w-100"  alt="{{ str_replace('-', ' ', pathinfo(substr($solution->image,11), PATHINFO_FILENAME)) }}"/>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
            @endif
        @endforeach
    @endif
    <section id="banner_need_app_s_page" class="b_n_app_bg">
        <div class="container-fluid">
            <div class="col-lg-10 col-md-12 col-12 mx-auto">
                <div class="row d-flex justify-content-center">
                    <div class="col-lg-11 col-md-11">
                        <div class="row d-flex justify-content-center">
                            <div class="col-xxl-10 col-xl-10 col-lg-11 col-md-11  ">
                                <div class="b_n_app_content text-center">
                                    <h2>{{ $preferences->application_heading_en }}</h2>
                                    <p>{{ $preferences->application_description_en }}</p>
                                    <div class="b_n_app_buttons">
                                        <span class="contact_us">
                                            <a href="{{ $preferences->application_contact_link }}">Contact Us</a>
                                        </span>
                                        <span class="faq">
                                            <a href="{{ $preferences->application_faq_link }}">FAQs</a>
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="b_n_app_img text-center ">
                            <!--<img src="{{ asset('uploads/preferences_page/' . $preferences->application_image) }}"-->
                            <!--    class="img-fluid w-100" alt="{{ str_replace('-', ' ', pathinfo($preferences->application_image, PATHINFO_FILENAME)) }}">-->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section id="register_account">
        <div class="container-fluid">
            <div class="col-lg-10 col-md-12 col-12 mx-auto">
                <div class="row d-flex justify-content-center">
                    <div class="col-xxl-11 col-lg-11 col-md-12 col-12">
                        <div class="row gy-md-4 gy-3 d-flex justify-content-center">
                            <div class="col-xl-4 col-lg-12">
                                <div class="row">
                                    <div class="col-lg-10">
                                        <div class="r_account_c_1_content">
                                            <h2>{{ $preferences->register_heading_en }}</h2>
                                            <p>{{ $preferences->register_description_en }}</p>
                                            <div class="r_account_btn">
                                                <a href="{{ $preferences->register_link }}">
                                                    Contact us
                                                    <i class="fa-solid fa-angle-right ps-md-2 ps-1"></i>
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            <div class="col-xl-4 col-lg-6 ps-xxl-4 ps-xl-2" id="card_1">
                                <div class="card shadow px-lg-4 py-lg-5 border-0">
                                    <div class="r_account_c_2_content">
                                        <h2>{{ $preferences->corporate_heading_en }}</h2>
                                        <p>{{ $preferences->corporate_description_en }}</p>
                                        {{-- <h4>$80/<span class="year">Yr</span></h4> --}}
                                        <div class="r_account_c_2_buttons">
                                            <span class="apply_now">
                                                <a href="{{ $preferences->corporate_link }}"> Apply Now </a>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xl-4 col-lg-6 ps-xxl-4 ps-xl-2">
                                <div class="card shadow px-lg-4 py-lg-5 border-0">
                                    <div class="r_account_c_3_content">
                                        <h2>{{ $preferences->individual_heading_en }}</h2>
                                        <p>{{ $preferences->individual_description_en }}</p>
                                        {{-- <h4>$80/<span class="year">Yr</span></h4> --}}
                                        <div class="r_account_c_3_buttons">
                                            <span class="apply_now">
                                                <a href="{{ $preferences->individual_link }}"> Apply Now </a>
                                            </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@endsection