@extends('layouts.website')

@if(!is_null($page_seo))
    @section('page_title', $page_seo->title)
    @section('metaDescription', $page_seo->description)
    @section('keywords', $page_seo->keywords)
@endif

@section('content')


@foreach($page_sections as $page_section)

        @if($page_section->content_type == "contact_form")
            {{-- dd('contact form type') --}}
            <section class="section-after-intro contact-form">
                <div class="container">
                    <div class="row justify-content-end">
                        <div class="col-lg-5">
                            
                            @if(session()->has('success'))
                                <script>

                                    window.scrollTo({
                                        top: 400,
                                        behavior: 'smooth'
                                    });

                                </script>
                                <div class="alert alert-warning col-md-9" role="alert">
                                    {{ session()->get('success') }}
                                </div>
                            @endif

                            <div class="inner-form">
                                <p>
                                    Contact Grindrod Ltd or any of its group companies by completing the form below. Select the company you would like to address your query to from the "To" dropdown box.
                                </p>
                                {{-- dd(url('contact-us')) --}}
                                <form action = "{{ url('contact-us') }}"  id = "contactForm" method = "post">
                                    @method('POST')
                                    @csrf
                                    <div class="form-group row align-items-center">
                                        <div class="col-sm-6">
                                            <h6>Send enquiry to</h6>
                                        </div>
                                        <div class="col-sm-6">
                                            <div class="custom-select-dropdown">
                                                <label for="service" class="sr-only">Send enquiry to sdfsdfds</label>
                                                <select class="form-control" id="enquiry" name="service">
                                                    <option value="grindrod@grindrod.com">Grindrod Limited</option>
                                                    <option value="commercial@grindrod.com">Customers and Tenders </option>
                                                    <option value="investorrelations@grindrod.com">Investor relations</option>
                                                    <option value="groupprocurement@grindrod.com">Procurement</option>
                                                    <option value="careers@grindrod.com">Careers</option>
                                                    <option value="GroupSecretarial@grindrod.com">Company secretary</option>
                                                    <option value="Alison.briggs@grindrod.com">Press office</option>
                                                </select>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="contact" class="sr-only">Contact</label>
                                        <input type="text" name="contact" class="form-control" id="contact" placeholder="Contact" />
                                    </div>
                                    <div class="form-group">
                                        <label for="company" class="sr-only">Company</label>
                                        <input name ="company" type="text" class="form-control" id="company" placeholder="Company" />
                                    </div>
                                    <div class="form-group">
                                        <label for="email" class="sr-only">Email address</label>
                                        <input name="email" type="email" class="form-control" id="email" placeholder="Email" />
                                    </div>
                                    <div class="form-group">
                                        <label for="contact_number" class="sr-only">Contact number</label>
                                        <input  name="contact_number" type="text" class="form-control" id="contact_number" placeholder="Contact number" />
                                    </div>
                                    <div class="form-group">
                                        <label for="contact_number">Your enquiry</label>
                                        <textarea name="message" class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
                                    </div>
                                    <!-- <div class="form-group form-check">
                                        <input type="checkbox" class="form-check-input" id="exampleCheck1" />
                                            <label class="form-check-label" for="exampleCheck1">I have read and understood the Grindrod <a href="#">privacy notice.</a></label>
                                        </label>
                                    </div> -->
                                    <div class="custom-checkbox">
                                        <label class="label_check_l " for="grindrodPrivacy">
                                            <input class="form-check-input" required type="checkbox" name="grindrodPrivacy" id="grindrodPrivacy">
                                            I have read and understood the Grindrod <a href="/privacy-notice">privacy notice.</a>
                                        </label>
                                    </div>
                                    <div class="row align-items-start">
                                        <!-- <div class="col-sm-6 col-md-7">
                                            <div class="g-recaptcha" id="feedback-recaptcha" data-sitekey="{{-- env('GOOGLE_RECAPTCHA_KEY')  --}}"></div>
                                        </div>
                                        <div class="col-sm-6 col-md-5 text-right">
                                            <button type="submit" data-sitekey="reCAPTCHA_site_key"
                                                    data-callback='onSubmit' class="btn btn-primary"
                                                    data-action='submit'
                                                    >Send</button>
                                        </div> -->

                                        <div class="col">
                                            <button type="submit" data-sitekey="6LcrSvwcAAAAADlqYqU-ls-sP-BitiwoC5oqXydb"
                                                    data-callback='onSubmit' class="btn btn-primary">Send</button>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </section>
            @else

                {!! $page_section->section_content !!}

            @endif
      

      @if($page_section->content_type == 'embeded video')
            <div class="embed-responsive embed-responsive-16by9" id="watch-video">
                <iframe class="embed-responsive-item" src="{{$page_section->embeded_video}}" allowfullscreen></iframe>
            </div>
        @endif

        @if($page_section->content_type == 'slider')
            <hero-banner-new sectionid="{{$page_section->id}}"></hero-banner-new>
        @endif
        
        @if($page_section->content_type == "csi_slider")
            <div id="csi-slider">
                <csi-slider  sectionid="{{$page_section->id}}"></csi-slider> 
            </div>
        @endif

       
        @if(count($page_section->tabs))