@props(['data' => null])

<section class="about-section py-5">
    <div class="auto-container">
        <div class="row clearfix">

            <!-- Content Column -->
            <div class="content-column col-lg-7 col-md-12 col-sm-12">
                <div class="inner-column">

                    {!! tiptap_converter()->asHTML(translate_data($data['main_content'])) !!}

                    {{--                    {{dd($data)}}--}}
                    <!-- Lower Box -->
                    <div class="lower-box clearfix">
                        <div class="button-box">

                            @if($data['button_wrapper'])
                                <x-redirect-link
                                    :item-data="$data['button_wrapper']['button'] ?? []"
                                    class="btn-style-one theme-btn bg-green3"
                                >
                                        <span class="txt">
                                            {{  translate_label( $data['button_wrapper']['button'], 'button_text') }}
                                            <i class="arrow fa fa-angle-right"></i>
                                        </span>
                                </x-redirect-link>
                            @endif


                        </div>
                        <div class="phone-box">
                        </div>
                    </div>
                </div>
            </div>

            <!-- Image Column -->
            <div class="image-column col-lg-5 col-md-12 col-sm-12">
                <div class="inner-column">
                    <!-- Counter Box -->
                    <div class="counter-box">
                        <div class="row clearfix">
                            <!-- Counter Column -->
                            @foreach($data["statistics"] as $stat)
                                <div class="counter-column col-lg-6 col-md-6 col-sm-12">
                                    <p class="upper-text color-green3 h5">
                                        {{  translate_label($stat, 'highlight')  }}
                                    </p>

                                    <div class="counter-text h6">
                                        {{  translate_label($stat, 'label') }}
                                    </div>
                                </div>
                            @endforeach
                            <!-- Counter Column -->

                        </div>
                    </div>
                    <div class="image">
                        <img src="{{  Storage::url($data['main_image']) }}" alt="Image about us"/>
                    </div>
                </div>
            </div>

        </div>
    </div>
</section>