@php
    use App\Models\User\UserAuth;
    use Illuminate\Support\Str;
    use App\Libraries\General;
    use App\Models\Frontend\Transaction;
@endphp
@extends('frontLayout.frontlayout')
@section('content')

@if(isset($home->banner_image) && $home->banner_image && file_exists(public_path($home->banner_image)))
<section class="banner-wrap windowHeight" style="background-image: url(@include('frontend.partials.getFile', ['file' => $home->banner_image, 'size' => "large",'class' => 'contain_image']));">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="banner_area">
                    <div class="row">
                        <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                            <div class="left_area" style="float: unset;">
                                <div class="content wow fadeInRight text-center" data-wow-delay="0.1s" style="visibility: visible; -webkit-animation-delay: 0.1s; -moz-animation-delay: 0.1s; animation-delay: 0.1s;">
                                    <h3>{{isset($home->banner_title) && $home->banner_title ? $home->banner_title : ""}}</h3>
                                    <p>{{isset($home->banner_sub_title) && $home->banner_sub_title ? $home->banner_sub_title : ""}}</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endif

<section class="about-us-wrap meta_met">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="our-story-wrap text-center">
                    @if($home['about_image'])
                    <div class="group-img">
                        @include('frontend.partials.fileRender', ['file' => $home['about_image'], 'size' => "large",'class' => 'contain_image'])
                    </div>
                    @endif
                    <div class="content">
                        <h3>
                            {{$home['about_title']}}
                        </h3>
                        {!! $home['about_description'] !!}
                    </div>                   
                </div>
            </div>
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="our-mission-set">
                    <div class="row">
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                            <div class="our-mission-wrap">
                                @if($home['mission_image'])
                                <div class="our-mission-img">
                                    @include('frontend.partials.fileRender', ['file' => $home['mission_image'], 'size' => "large"])
                                </div>
                                @endif
                            </div>
                            <div class="content vision">
                                    <h3>
                                        {{$home['mission_title']}}
                                    </h3>
                                    <p>{!! nl2br($home['mission_description']) !!}</p>
                            </div>
                        </div>
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                            <div class="our-mission-wrap">
                                @if($home['vision_image'])
                                <div class="our-mission-img">
                                    @include('frontend.partials.fileRender', ['file' => $home['vision_image'], 'size' => "large"])
                                </div>
                                @endif
                            </div>
                            <div class="content vision-2">
                                <h3>
                                    {{$home['vision_title']}}
                                </h3>
                                <p>{!! nl2br($home['vision_description']) !!}</p>
                            </div>
                        </div>
                    </div>
                </div>
                
                




                <!-- <div class="our-mission-set">
                    <div class="row align-items-center">
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                            <div class="our-mission-wrap">
                                @if($home['mission_image'])
                                <div class="our-mission-img">
                                    @include('frontend.partials.fileRender', ['file' => $home['mission_image'], 'size' => "large"])
                                </div>
                                @endif
                            </div>
                        </div>
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                            <div class="content vision">
                                    <h3>
                                        {{$home['mission_title']}}
                                    </h3>
                                    <p>{!! nl2br($home['mission_description']) !!}</p>
                            </div>
                        </div>
                    </div>
                </div>  -->
            </div>
            <!-- <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12 ">
                <div class="our-mission-set">
                    <div class="row align-items-center">
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12 order-sm-0 order-2">
                            <div class="content vision-2">
                                <h3>
                                    {{$home['vision_title']}}
                                </h3>
                                <p>{!! nl2br($home['vision_description']) !!}</p>
                            </div>
                        </div>
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12"> 
                            <div class="our-mission-wrap">
                                @if($home['vision_image'])
                                <div class="our-mission-img">
                                    @include('frontend.partials.fileRender', ['file' => $home['vision_image'], 'size' => "large"])
                                </div>
                                @endif
                            </div>                           
                        </div> 
                    </div>
                </div>
            </div> -->
        </div>
    </div>
</section>
 
 @if(isset($categories) && $categories)
{{-- <section class="who_us wow fadeInLeft" data-wow-delay="0.1s" style="visibility: visible; -webkit-animation-delay: 0.1s; -moz-animation-delay: 0.1s; animation-delay: 0.1s;">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="heading-lines text-center">
                    <h2>
                    {{isset($home->category_title) && $home->category_title ? $home->category_title : ""}}
                    </h2>
                    <P>
                    {{isset($home->category_sub_title) && $home->category_sub_title ? $home->category_sub_title : ""}}
                    </P>
                </div>
                <div class="who_use_slide">
                    <div class="owl-carousel" id="who-us">
                        @foreach ($categories as $key => $c)
                        <div class="item">
                            <div class="varients_one-third ">
                                <div class="varrients  match_height_col">
                                    @if(isset($c['image']) && $c['image'] && file_exists(public_path($c['image'])) )
                                        @include('frontend.partials.fileRender', ['file' => $c['image'], 'size' => "medium"])
                                    @endif
                                    <div class="content">
                                        <div class="match_height_txt">
                                            <h4>
                                                {{$c['title']}}
                                            </h4>
                                        </div>
                                        <!-- <div class="match_height_col">
                                            <p>
                                                {{Str::limit($c['description'],100,'...')}}
                                            </p>
                                        </div> -->
                                        <a href="{{route('creators.index',['category[]' => $c['id']])}}" class="read-more">See more</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                </div>
            </div>
        </div>
    </div>
</section> --}}
@endif

<!-- Feature section start -->
<section class="feature_section">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="content_area">
                    <div class="title">
                        <h2>Features</h2>
                        {{-- <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae.</p> --}}
                    </div>
                    <div class="row justify-content-center">
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                            <div class="content_box match">
                                <div class="heading">
                                    <p>For Faculties</p>
                                </div>
                                <div class="inner_box match_height_col">
                                    <ul>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Post pre-recorded courses on chapter wise basis.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Set up video meetings with your members.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Give your members the option to give test series.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Encryption of recorded videos can also be done from our side.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Publish Schedules and announcement in advance.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Post revisionary clips in audio format as well.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Seamless file transfer between faculties and members.</p>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                    <!-- <div class="image_1">
                                        <img src="{{ url('assets/frontend/images/feature_img.png') }}" alt="">
                                    </div> -->
                                    <div class="image_2">
                                        <img src="{{ url('assets/frontend/images/background_img.png') }}" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12">
                            <div class="content_box">
                                <div class="heading">
                                    <p>For Members</p>
                                </div>
                                <div class="inner_box match_height_col">
                                    <ul>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>You can customize your plan according to the number of days and total hours of classes to be purchased.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>You can purchase classes for a specific chapter of a subject.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Get access to study materials on soft copy basis.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Give reviews to your faculty which will be displayed.</p>
                                                </div>
                                            </div>
                                        </li>
                                        <li>
                                            <div class="icon">
                                                <div class="left">
                                                    <i class="fal fa-check"></i>
                                                </div>
                                                <div class="right">
                                                    <p>Ask questions to your faculty through our system.</p>
                                                </div>
                                            </div>
                                        </li>
                                    </ul>
                                    <!-- <div class="image_1">
                                        <img src="{{ url('assets/frontend/images/feature_img.png') }}" alt="">
                                    </div> -->
                                    <div class="image_2">
                                        <img src="{{ url('assets/frontend/images/background_img.png') }}" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- Feature section end -->

<!-- Getstarted section start -->
<section class="feature_section getstarted_section">
    <div class="container">
        <div class="row">
            <div class="col-xxl-12 col-xl-12 col-lg-12 col-md-12 col-sm-12 col-12">
                <div class="content_area">
                    <div class="title">
                        <h2>Lets Get Started</h2>
                        {{-- <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae.</p> --}}
                    </div>
                    <div class="row">
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12">
                            <div class="content_box">
                                <div class="heading">
                                    <p>As a faculty</p>
                                </div>
                                <div class="box_area">
                                    {{-- <div class="flip-box">
                                        <div class="flip-box-inner">
                                            <div class="flip-box-front">
                                                <div class="image">
                                                    <img src="{{ url('assets/frontend/images/add_friend.png') }}" alt="">
                                                </div>
                                                <p>
                                                    Sign Up First
                                                </p>
                                            </div>
                                            <div class="flip-box-back">
                                                <!-- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                                                    labore et dolore magna aliqua.
                                                </p> -->
                                                <div class="button">
                                                    <a href="{{route('register.index')}}" class="btn btn-primary w-100">Sign Up First</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div> --}}
                                    <div class="flip-box">
                                        <div class="flip-box-inner">
                                            <div class="flip-box-front">
                                                <div class="image">
                                                    <img src="{{ url('assets/frontend/images/teamwork_2.png') }}" alt="">
                                                </div>
                                                <p>
                                                    Contact Our Team
                                                </p>
                                            </div>
                                            <div class="flip-box-back">
                                                <p>Fill up this form and our team will reach out to you within 24 hours.
                                                </p>
                                                <div class="button team_btn">
                                                    <a href=" https://docs.google.com/forms/d/e/1FAIpQLSf5AgxlJF3DDDzn24YODxUOByjG8bwnwFxUbgu4_E7Ry93irQ/viewform" target="_blank" class="btn btn-primary w-100">Form</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xxl-6 col-xl-6 col-lg-6 col-md-6 col-sm-12 col-12">
                            <div class="content_box">
                                <div class="heading">
                                    <p>As a member</p>
                                </div>
                                <div class="box_area">
                                    <div class="flip-box">
                                        <div class="flip-box-inner">
                                            <div class="flip-box-front">
                                                <div class="image">
                                                    <img src="{{ url('assets/frontend/images/add_friend.png') }}" alt="">
                                                </div>
                                                <p>
                                                    Sign Up First
                                                </p>
                                            </div>
                                            <div class="flip-box-back">
                                                <!-- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                                                    labore et dolore magna aliqua.
                                                </p> -->
                                                <div class="button">
                                                    <a href="{{route('register.index')}}" class="btn btn-primary w-100">Sign Up First</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="flip-box">
                                        <div class="flip-box-inner">
                                            <div class="flip-box-front">
                                                <div class="image">
                                                    <img src="{{ url('assets/frontend/images/teamwork_2.png') }}" alt="">
                                                </div>
                                                <p>
                                                    Find your faculty
                                                </p>
                                            </div>
                                            <div class="flip-box-back">
                                                <!-- <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut 
                                                    labore et dolore magna aliqua.
                                                </p> -->
                                                <div class="button">
                                                    <a href="{{route('creators.index')}}" class="btn btn-primary w-100">Faculties</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<!-- Getstarted section end -->

@endsection