@php
    $siteTitle = 'Portal';
    $descricao = '';
    try {
        $portalConfigs = app(\V2\Modules\Support\SupportConfigs\Services\PortalConfigsService::class)->getAll();
        $siteTitle = $portalConfigs['titulo_site'] ?? 'Portal';
        $descricao = $portalConfigs['descricao'] ?? '';
    } catch (\Exception $e) {}
@endphp
@extends('v2-portal::app-layout', [
    'pageTitle' => $siteTitle ? "$siteTitle — Página Inicial" : 'Página Inicial',
    'pageDescription' => $descricao ?? '',
    'coverImage' => null,
    'gtag' => ['page_context' => 'homepage'],
    'schemas' => [
        [
            '@context' => 'https://schema.org',
            '@type' => 'Organization',
            'name' => $siteTitle ?? 'Portal',
            'url' => url('/')
        ]
    ],
    'showAccessibilityBar' => false,
    'stickyAccessibilityBar' => false,
    'showHeader' => false,
    'showMainHeader' => false,
    'showMainFooter' => false,
    'showFooter' => false,
    'showMainLeftArea' => false,
    'showMainRightArea' => false,
    'fullWidthMain' => true
])

@section('main-section-area')
    @php
        $sections = [];
        if (!empty($layoutConfigs) && $layoutConfigs->has('landing_sections')) {
            $config = $layoutConfigs->get('landing_sections');
            $sections = is_object($config) && isset($config->payload) ? $config->payload : [];
        }
    @endphp

    @if(!empty($sections))

    {{-- ================================================================ --}}
    {{-- Hero Slider                                                      --}}
    {{-- ================================================================ --}}
    @if(!empty($sections['hero']))
    <section class="hero-section-1">
        <div class="dot-shape-1">
            <img src="{{ asset('assets/sucesu/img/hero/dot-shape-1.png') }}" alt="" loading="eager" decoding="async" aria-hidden="true" role="presentation">
        </div>
        <div class="dot-shape-2">
            <img src="{{ asset('assets/sucesu/img/hero/dot-shape-2.png') }}" alt="" loading="eager" decoding="async" aria-hidden="true" role="presentation">
        </div>
        <div class="swiper-dot">
            <div class="dot"></div>
        </div>
        <div class="swiper hero-slider">
            <div class="swiper-wrapper">
                @foreach($sections['hero'] as $slide)
                <div class="swiper-slide">
                    @php
                        $slideVariants = [];
                        if (!empty($slide['image'])) {
                            $media = \V2\Services\Gallery\Models\GalleryMedia::where('file_path', $slide['image'])->first();
                            if ($media && !empty($media->variants)) {
                                $slideVariants = json_decode($media->variants, true) ?: [];
                            }
                        }
                    @endphp
                    <div class="hero-1 bg-cover" style="background-image: {{ v2_bg_image_css($slide['image'] ?? '', $slideVariants) }};">
                        <div class="container">
                            <div class="row g-4 align-items-center justify-content-between">
                                <div class="col-xl-8">
                                    <div class="hero-content">
                                        @if($loop->first)
                                        <h1 data-animation="fadeInUp" data-delay="1.1s">{{ $slide['title'] }}</h1>
                                        @else
                                        <h2 data-animation="fadeInUp" data-delay="1.1s">{{ $slide['title'] }}</h2>
                                        @endif
                                        <p data-animation="wow fadeInUp" data-wow-delay="1.3s">{{ $slide['subtitle'] }}</p>
                                        @if(!empty($slide['cta_text']))
                                        <div class="hero-button wow fadeInUp" data-animation="wow fadeInUp" data-wow-delay="1.5s">
                                            <a href="{{ $slide['cta_url'] ?? '#' }}" class="theme-btn link-btn">
                                                <span>{{ $slide['cta_text'] }}</span> <i class="bi bi-arrow-right"></i>
                                            </a>
                                        </div>
                                        @endif
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </section>
    @endif

    {{-- ================================================================ --}}
    {{-- Service Cards (Networking, Conteúdo, Representatividade)         --}}
    {{-- ================================================================ --}}
    @if(!empty($sections['services']))
    <section class="service-section-1 section-padding pb-1 fix">
        <div class="container section-padding pt-0 border-bottom">
            <div class="row g-4">
                @foreach($sections['services'] as $service)
                <div class="col-xl-4 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".{{ ($loop->index + 1) * 2 }}s">
                    <div class="service-main-item">
                        <div class="service-card-item">
                            @if(!empty($service['icon']))
                            <div class="icon">
                                <img src="{{ v2_storage_url($service['icon']) }}" alt="{{ $service['title'] }}" loading="lazy" decoding="async">
                            </div>
                            @endif
                            <div class="content">
                                <h3>
                                    <a href="{{ $service['url'] ?? '#' }}">{{ $service['title'] }}</a>
                                </h3>
                                <p>{{ $service['description'] }}</p>
                            </div>
                        </div>
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </section>
    @endif

    {{-- ================================================================ --}}
    {{-- About + Counters                                                 --}}
    {{-- ================================================================ --}}
    @if(!empty($sections['about']))
    @php
        $about = $sections['about'];
        $aboutVariants = [];
        if (!empty($about['image'])) {
            $aboutMedia = \V2\Services\Gallery\Models\GalleryMedia::where('file_path', $about['image'])->first();
            if ($aboutMedia && !empty($aboutMedia->variants)) {
                $aboutVariants = json_decode($aboutMedia->variants, true) ?: [];
            }
        }
    @endphp
    <section class="about-section section-padding fix">
        <div class="container">
            <div class="section-title mb-4">
                <span class="sub-title d-inline-block wow fadeInUp">{{ $about['subtitle'] ?? '' }}</span>
                <h2 class="wow col-7 fadeInUp" data-wow-delay=".3s">{{ $about['title'] ?? '' }}</h2>
            </div>
            <div class="about-wrapper pt-2">
                <div class="row g-4">
                    <div class="col-xl-11">
                        <div class="about-image bg-cover" style="background-image: {{ v2_bg_image_css($about['image'] ?? '', $aboutVariants) }};">>
                            @if(!empty($about['counters']))
                            <div class="counter-wrapper">
                                @foreach($about['counters'] as $counter)
                                <div class="counter-item style-2 wow fadeInUp" data-wow-delay=".{{ ($loop->index + 1) * 2 }}s">
                                    @if(!empty($counter['icon']))
                                    <div class="icon pt-2 mt-1">
                                        <img src="{{ v2_storage_url($counter['icon']) }}" alt="{{ $counter['label'] }}" loading="lazy" decoding="async">
                                    </div>
                                    @endif
                                    <div class="content">
                                        <h2><span class="count">{{ $counter['value'] }}</span>{{ $counter['suffix'] ?? '' }}</h2>
                                        <p>{{ $counter['label'] }}</p>
                                    </div>
                                </div>
                                @endforeach
                            </div>
                            @endif
                        </div>
                    </div>
                    <div class="col-xl-2">
                        <div class="about-box">
                            <h4>{{ $about['description'] ?? '' }}</h4>
                            @if(!empty($about['cta_text']))
                            <div class="about-button mt-4">
                                <a href="{{ $about['cta_url'] ?? '#' }}" class="theme-btn">
                                    <span>{{ $about['cta_text'] }}</span> <i class="bi bi-arrow-right"></i>
                                </a>
                            </div>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    @endif

    {{-- ================================================================ --}}
    {{-- Brand Carousel                                                   --}}
    {{-- ================================================================ --}}
    @if(!empty($sections['brands']))
    <div class="brand-section section-padding fix pt-0">
        <div class="container">
            @if(!empty($sections['brands_title']))
            <div class="section-title row justify-content-center text-center">
                <div class="col-7">
                    <p class="mb-5">{{ $sections['brands_title'] }}</p>
                </div>
            </div>
            @endif
            <div class="swiper brand-slider">
                <div class="swiper-wrapper">
                    @foreach($sections['brands'] as $brand)
                    <div class="swiper-slide">
                        <div class="brand-img center">
                            <img src="{{ v2_storage_url($brand['image']) }}" alt="{{ $brand['name'] }}" loading="lazy" decoding="async">
                        </div>
                    </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    @endif

    {{-- ================================================================ --}}
    {{-- Agenda / Events                                                  --}}
    {{-- ================================================================ --}}
    @if(!empty($sections['events']))
    <section class="service-section section-padding fix section-bg">
        <div class="shape-image">
            <img src="{{ asset('assets/sucesu/img/service/service-shape.png') }}" alt="" loading="lazy" decoding="async" aria-hidden="true" role="presentation">
        </div>
        <div class="container custom-container">
            <div class="section-title text-center">
                <span class="style-2 sub-title wow fadeInUp">{{ $sections['events_subtitle'] ?? 'Agenda SUCESU' }}</span>
                <h2 class="wow fadeInUp" data-wow-delay=".3s">{!! $sections['events_title'] ?? 'Acompanhe os eventos' !!}</h2>
            </div>
            <div class="row">
                @foreach($sections['events'] as $event)
                <div class="col-xl-3 col-lg-6 col-md-6 wow fadeInUp" data-wow-delay=".{{ ($loop->index + 1) * 2 }}s">
                    <div class="service-box-item">
                        <div class="service-icon-item">
                            @if(!empty($event['image']))
                            <div class="service-image pb-4">
                                <img src="{{ v2_storage_url($event['image']) }}" alt="{{ $event['title'] }}" loading="lazy" decoding="async">
                            </div>
                            @endif
                            <div class="icon">
                                <i class="fa-regular fa-calendar fa-2x theme-color"></i>
                            </div>
                        </div>
                        <div class="content">
                            <h3>
                                <a href="{{ $event['url'] ?? '#' }}">{{ $event['title'] }}</a>
                            </h3>
                            <p>{!! $event['details'] ?? '' !!}</p>
                            <a href="{{ $event['url'] ?? '#' }}" class="link-btn mt-3 pt-1">Saiba mais <i class="fa-light fa-arrow-right-long"></i></a>
                        </div>
                    </div>
                </div>
                @endforeach
            </div>
        </div>
    </section>
    @endif

    {{-- ================================================================ --}}
    {{-- Regionais                                                        --}}
    {{-- ================================================================ --}}
    @if(!empty($sections['regionais']))
    @php $reg = $sections['regionais']; @endphp
    <section class="choose-us-section section-padding fix">
        <div class="container">
            <div class="choose-us-wrapper-2">
                <div class="row g-4 align-items-center">
                    <div class="col-lg-6">
                        <div class="choose-us-content">
                            <div class="section-title mb-0">
                                <span class="sub-title wow fadeInUp">{{ $reg['subtitle'] ?? '' }}</span>
                                <h2 class="wow fadeInUp" data-wow-delay=".3s">{{ $reg['title'] ?? '' }}</h2>
                            </div>
                            <p class="choose-us-text wow fadeInUp" data-wow-delay=".5s">{{ $reg['text1'] ?? '' }}</p>
                            @if(!empty($reg['states']))
                            <h4 class="wow fadeInUp" data-wow-delay=".7s">{{ $reg['states'] }}</h4>
                            @endif
                            <p class="choose-us-text-2 wow fadeInUp" data-wow-delay=".3s">{{ $reg['text2'] ?? '' }}</p>
                            @if(!empty($reg['cta_text']))
                            <div class="choose-us-button wow fadeInUp" data-wow-delay=".7s">
                                <a href="{{ $reg['cta_url'] ?? '#' }}" class="theme-btn">
                                    <span>{{ $reg['cta_text'] }}</span> <i class="bi bi-arrow-right"></i>
                                </a>
                            </div>
                            @endif
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="choose-us-img">
                            <img src="{{ v2_storage_url($reg['image']) }}" alt="{{ $reg['subtitle'] ?? '' }}" class="wow img-custom-anim-right" data-wow-duration="1.3s" data-wow-delay="0.3s" loading="lazy" decoding="async">
                            <div class="box-shape float-bob-y">
                                <img src="{{ asset('assets/sucesu/img/choose-us/box-shape.png') }}" alt="" loading="lazy" decoding="async" aria-hidden="true" role="presentation">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    @endif

    @else
    {{-- ================================================================ --}}
    {{-- Fallback: gov/default tenant sem landing_sections                --}}
    {{-- ================================================================ --}}
    <div class="jumbotron-home text-center py-5 px-3">
        <h1 class="display-5 fw-bolder mb-3 text-white">Bem-vindo ao Portal</h1>
        <p class="lead mb-4 text-white opacity-75">
            Portal oficial de serviços e informações.
        </p>
    </div>
    @endif
@endsection