@extends('layouts.app')

@section('title', $branch['short'] ?? ($branch['name'] ?? 'শাখা'))
@section('description', trim(($branch['name'] ?? '').' — '.($branch['address'] ?? '').'। ব্যাচ, ঠিকানা ও যোগাযোগের তথ্য। সব শাখায় একই কোর্স ও একই সার্টিফিকেট।'))
@section('canonical', '/branches/'.$branch['slug'])

@section('content')
    @php
        $phoneDigits = preg_replace('/\D/', '', (string) ($branch['phone'] ?? ''));
        $info = [
            ['icon' => '📍', 'label' => 'ঠিকানা', 'value' => $branch['address'] ?? '', 'href' => $branch['mapUrl'] ?? '', 'btn' => 'মানচিত্রে দেখুন'],
            ['icon' => '📞', 'label' => 'ফোন', 'value' => $branch['phone'] ?? '', 'href' => 'tel:'.$phoneDigits, 'btn' => ''],
            ['icon' => '✉️', 'label' => 'ইমেইল', 'value' => $branch['email'] ?? '', 'href' => 'mailto:'.($branch['email'] ?? ''), 'btn' => ''],
            ['icon' => '🕘', 'label' => 'খোলার সময়', 'value' => $branch['hours'] ?? '', 'href' => '', 'btn' => ''],
        ];
    @endphp

    <section class="page-hero branch-hero">
        <div class="container">
            <div class="crumbs">
                <a href="/">হোম</a> <span>›</span> <a href="/branches">শাখা</a> <span>›</span>
                {{ $branch['short'] ?? ($branch['name'] ?? '') }}
            </div>
            <div class="branch-hero-emoji">{{ $branch['emoji'] ?? '🏫' }}</div>
            <h1>{{ $branch['name'] ?? '' }}</h1>
            @if(! empty($branch['tagline']))
                <p class="desc">{{ $branch['tagline'] }}</p>
            @endif
        </div>
    </section>

    <section class="branch-layout">
        <div class="container branch-layout-inner">
            <div class="branch-detail-main">
                @if(! empty($branch['image']))
                    <img class="branch-photo" src="{{ $branch['image'] }}" alt="{{ $branch['name'] ?? '' }}">
                @endif

                <div class="content-card">
                    <h2>🏢 শাখার তথ্য</h2>
                    @if(! empty($branch['description']))
                        <p style="color:var(--muted);line-height:1.7;margin-bottom:22px">{{ $branch['description'] }}</p>
                    @endif

                    <div class="info-list">
                        @foreach($info as $row)
                            @if(! empty($row['value']))
                                <div class="info-row">
                                    <span class="info-ico">{{ $row['icon'] }}</span>
                                    <div>
                                        <b>{{ $row['label'] }}</b>
                                        <span>{{ $row['value'] }}</span>
                                        @if(! empty($row['href']))
                                            <a class="info-action" href="{{ $row['href'] }}"
                                               @if($row['btn']) target="_blank" rel="noopener noreferrer" @endif>
                                                {{ $row['btn'] ? $row['btn'].' →' : 'যোগাযোগ করুন →' }}
                                            </a>
                                        @endif
                                    </div>
                                </div>
                            @endif
                        @endforeach
                    </div>
                </div>

                <div class="content-card">
                    <h2>🕐 ব্যাচসমূহ</h2>
                    <div class="branch-batch-cards">
                        <div class="batch-card">
                            <span class="batch-day">⌚ {{ $branch['batch1'] ?? '' }}</span>
                            <p>সকালের ব্যাচ — চাকরিজীবী ও শিক্ষার্থীদের জন্য উপযুক্ত সময়।</p>
                        </div>
                        <div class="batch-card">
                            <span class="batch-day">⌚ {{ $branch['batch2'] ?? '' }}</span>
                            <p>বিকালের ব্যাচ — কাজের পর ক্লাস করার সুবিধা, সিট সীমিত!</p>
                        </div>
                    </div>
                </div>
            </div>

            <aside class="branch-side">
                <div class="content-card branch-side-card">
                    <h2>🎯 এ শাখায় ভর্তি</h2>
                    <p style="color:var(--muted);font-size:.95rem;line-height:1.7">
                        সব শাখায় একই কোর্স, একই কারিকুলাম ও একই সার্টিফিকেট। সরাসরি কল করে বা WhatsApp-এ
                        মেসেজ করে সিট নিশ্চিত করুন।
                    </p>
                    @if(! empty($phoneDigits))
                        <a class="btn btn-primary btn-block" href="tel:{{ $phoneDigits }}">📞 কল করুন</a>
                        <a class="btn btn-whatsapp btn-block" href="https://wa.me/{{ $phoneDigits }}"
                           target="_blank" rel="noopener noreferrer">💬 WhatsApp</a>
                    @endif
                    @if(! empty($branch['mapUrl']))
                        <a class="btn btn-outline btn-block" href="{{ $branch['mapUrl'] }}"
                           target="_blank" rel="noopener noreferrer">📍 মানচিত্রে দেখুন</a>
                    @endif
                </div>
            </aside>
        </div>
    </section>

    <section class="section alt">
        <div class="container">
            <div class="section-head left">
                <span class="eyebrow">একই কোর্স, সব শাখায়</span>
                <h2>এই শাখার কোর্সসমূহ</h2>
                <p>নিচের যেকোনো কোর্সে এই শাখায় ভর্তি হতে পারবেন — সব শাখায় একই মডিউল ও সার্টিফিকেট।</p>
            </div>
            <div class="grid-3">
                @foreach($courses as $course)
                    @include('partials.course-card', ['course' => $course])
                @endforeach
            </div>
        </div>
    </section>

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