@extends('layouts.app')

@section('content')
    @php
        $items = collect($branchesContent['items'] ?? [])
            ->filter(fn ($b) => is_array($b) && ! empty($b['slug']))
            ->values();
    @endphp

    <section class="page-hero">
        <div class="container">
            <h1>{{ $branchesContent['title'] ?? 'আমাদের শাখা' }}</h1>
            <p>{{ $branchesContent['text'] ?? '' }}</p>
        </div>
    </section>

    <section class="section">
        <div class="container">
            <div class="branch-grid">
                @foreach($items as $b)
                    <a class="card branch-card" href="/branches/{{ $b['slug'] }}">
                        @if(! empty($b['image']))
                            <div class="branch-thumb">
                                <img src="{{ $b['image'] }}" alt="{{ $b['name'] ?? '' }}" loading="lazy">
                                <span class="branch-thumb-badge">🔥 নতুন ব্যাচ চলছে</span>
                                <span class="branch-thumb-tag">{{ $b['short'] ?? ($b['name'] ?? '') }}</span>
                            </div>
                        @endif
                        <div class="branch-emoji">{{ $b['emoji'] ?? '🏫' }}</div>
                        <h3>{{ $b['name'] ?? '' }}</h3>
                        @if(! empty($b['tagline']))
                            <span class="branch-tag">{{ $b['tagline'] }}</span>
                        @endif
                        <p class="branch-addr">📍 {{ $b['address'] ?? '' }}</p>
                        <div class="branch-meta">
                            <span>📞 {{ $b['phone'] ?? '' }}</span>
                            <span>🕘 {{ $b['hours'] ?? '' }}</span>
                        </div>
                        <div class="branch-batches">
                            <span>🗓️ {{ $b['batch1'] ?? '' }}</span>
                            <span>🗓️ {{ $b['batch2'] ?? '' }}</span>
                        </div>
                        <div class="course-foot">
                            <span class="link-arrow">বিস্তারিত দেখুন</span>
                            <span class="arrow-btn" aria-hidden="true">→</span>
                        </div>
                    </a>
                @endforeach
            </div>
        </div>
    </section>

    @include('partials.sections.cta', ['content' => $content, 'site' => $site])
@endsection