@inject('SectionService', 'App\Services\SectionService')
@php
$param = 'services';
$data = $SectionService->get($param);
@endphp
<!-- Services Section -->
<section class="container" id="services">
    <div class="row">
        <!-- First Column -->
        <div class="col-12 col-md-6 mb-4">
            <h2>{{ $data['heading'] ?? 'Default Heading' }}</h2>
            <h4>{{ $data['subheading'] ?? 'Default Subheading' }}</h4>
            <a class="btn btn-primary" href="{{ $data['primaryButtonLink'] ?? '#' }}" role="button">{{ $data['primaryButtonText'] ?? 'Default Button Text' }}</a>
            <a class="btn btn-secondary" href="{{ $data['secondaryButtonLink'] ?? '#' }}" role="button">{{ $data['secondaryButtonText'] ?? 'Default Button Text' }}</a>
        </div>
<!-- Second Column - Accordion for Polisplexity Capabilities and Services -->
<div class="col-12 col-md-6 mb-4">
    <div class="accordion accordion-flush" id="accordionFlushServices">
        @foreach ($data['serviceClasses'] ?? [] as $item)
            <div class="accordion-item">
                <h2 class="accordion-header">
                    <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#{{ $item['id'] }}" aria-expanded="false" aria-controls="{{ $item['id'] }}">
                        {{ $item['name'] }}
                    </button>
                </h2>
                <div id="{{ $item['id'] }}" class="accordion-collapse collapse" data-bs-parent="#accordionFlushServices">
                    <div class="accordion-body">
                        <ul>
                            @foreach ($item['contents'] as $content)
                                <li><p>{{ $content }}</p></li>
                            @endforeach
                        </ul>
                    </div>
                </div>
            </div>
        @endforeach
    </div>
</div>


    </div>
</section>