@extends('dashboard.Boutique.Boutique_template.layouts.grocery.app')
@section("css")
    @include("dashboard.Boutique.Boutique_template.layouts.grocery.css_other_page")
    @include("dashboard.Boutique.Boutique_template.styles.modern_info_pages_styles")
@endsection

@section('content')
    @include("dashboard.Boutique.Boutique_template.layouts.grocery.banner",["page_title"=> "À propos"])

    <div id="contact-us-page" class="page-content page-content--centered container">
        <div class="col-12">
            <div class="row">
                <!-- Feature Cards -->
                <div class="col-12 col-md-6">
                    <div class="feature-card">
                        <img src="{{asset("grocery/images/number_one.png")}}" alt="Satisfaction">
                        <div class="feature-card-content">
                            <i class="fa fa-check-circle" style="color: var(--primary-color); margin-right: 5px;"></i>
                            @if($metas->satisfied_or_refunded)
                                <strong>Satisfait ou remboursé</strong>
                            @else
                                Pas de remboursement
                            @endif
                        </div>
                    </div>
                </div>

                <div class="col-12 col-md-6">
                    <div class="feature-card">
                        <img src="{{asset("grocery/images/number_two.png")}}" alt="Échange">
                        <div class="feature-card-content">
                            <i class="fa fa-exchange-alt" style="color: var(--primary-color); margin-right: 5px;"></i>
                            @if($metas->exchange_after_ship)
                                Les produits peuvent être changés jusqu'à <strong>{{$metas->day_exchange_after_ship}} jours</strong> après la livraison
                            @else
                                Les produits vendus ne sont plus échangés
                            @endif
                        </div>
                    </div>
                </div>

                <div class="col-12 col-md-6">
                    <div class="feature-card">
                        <img src="{{asset("grocery/images/number_three.png")}}" alt="Retour">
                        <div class="feature-card-content">
                            <i class="fa fa-truck" style="color: var(--primary-color); margin-right: 5px;"></i>
                            @if($metas->offer_return_delivery_to_customer)
                                <strong>Retour après livraison gratuite</strong>
                            @else
                                Retour après livraison payante
                            @endif
                        </div>
                    </div>
                </div>

                <div class="col-12 col-md-6">
                    <div class="feature-card">
                        <img src="{{asset("grocery/images/number_four.png")}}" alt="Adresse">
                        <div class="feature-card-content">
                            <i class="fa fa-map-marker-alt" style="color: var(--primary-color); margin-right: 5px;"></i>
                            <strong>Adresse retour :</strong>
                            @if($metas->address!=null) {{$metas->address}} @else {{$metas->adresse_boutique}} @endif
                        </div>
                    </div>
                </div>

                <!-- Section Header -->
                <div class="col-12">
                    <div class="section-header">
                        <img src="{{asset("grocery/images/plus.png")}}" alt="plus">
                        <h2>En Savoir Plus</h2>
                    </div>
                </div>

                <!-- Description -->
                <div class="col-12">
                    <div class="description-box">
                        <p>{{$description}}</p>
                    </div>
                </div>

                <!-- Manager Info -->
                @php
                    $meta_model=new \App\Users_meta();
                    $picture=$meta_model->get_user_field($boutique->user->id,'profil_picture');
                @endphp
                <div class="col-12">
                    <div class="manager-info">
                        @if($picture)
                            <img src="{{asset('Profil_picture/'.$picture)}}" alt="Manager">
                        @else
                            <div style="width: 80px; height: 80px; border-radius: 50%; background: white; display: flex; align-items: center; justify-content: center; font-size: 32px; color: var(--primary-color); border: 4px solid white; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);">
                                <i class="fa fa-user"></i>
                            </div>
                        @endif
                        <div>
                            <h4><i class="fa fa-user-tie"></i> Gestionnaire</h4>
                            <span>{{$boutique->user->last_name.' '.$boutique->user->first_name}}</span>
                        </div>
                    </div>
                </div>

                <!-- General Conditions -->
                @if($metas->general_condition!==null)
                    <div class="col-12">
                        <div class="general-conditions">
                            <h2><i class="fa fa-file-contract"></i> Conditions Générales d'Achat</h2>
                            <div>
                                {!! $metas->general_condition !!}
                            </div>
                        </div>
                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection

@section('script')
    <script src="{{asset('js/contact_custom.js')}}"></script>
@endsection