@extends('layouts.app')

@php
    $seoTitle = trim((string) ($course['seo_title'] ?? ''));
    $seoDesc = trim((string) ($course['seo_description'] ?? ''));
    $seoKeywords = trim((string) ($course['seo_keywords'] ?? ''));
@endphp

@section('title', $seoTitle !== '' ? $seoTitle : ($course['title'] ?? 'কোর্স'))
@section('description', $seoDesc !== '' ? $seoDesc : ($course['description'] ?? ''))
@section('canonical', '/courses/'.$course['slug'])
@if($seoKeywords !== '')
    @section('keywords', $seoKeywords)
@endif
@if(! empty($course['seo_image']))
    @section('ogImage', $course['seo_image'])
@endif
@if(! empty($course['seo_noindex']))
    @section('robots', 'noindex, nofollow')
@endif

@section('content')
    @php
        $phoneRaw = $site['phoneRaw'] ?? preg_replace('/\D/', '', (string) ($site['phone'] ?? ''));
        $waLink = 'https://wa.me/'.$phoneRaw.'?text='.rawurlencode('Ami "'.($course['title'] ?? '').'" course details jante chai');
        $modules = $course['modules'] ?? [];
        $related = collect($courses)
            ->filter(fn ($c) => ($c['slug'] ?? '') !== ($course['slug'] ?? '') && ($c['category'] ?? '') === ($course['category'] ?? ''))
            ->take(3)
            ->values();
    @endphp

    <section class="course-detail-hero"
             style="background: {{ $course['color'] ?? 'linear-gradient(135deg,#2563eb,#7c3aed)' }}, linear-gradient(140deg,#0b1226,#16265a); background-blend-mode: multiply">
        <div class="container">
            <div class="crumbs">
                <a href="/">হোম</a> / <a href="/courses">কোর্স</a> / {{ $course['title'] ?? '' }}
            </div>
            <h1>{{ $course['emoji'] ?? '' }} {{ $course['title'] ?? '' }}</h1>
            <p class="desc">{{ $course['description'] ?? '' }}</p>
            <div class="meta-row">
                <span class="meta-pill">⏱ সময়কাল: {{ $course['duration'] ?? '' }}</span>
                <span class="meta-pill">📘 {{ $course['lessons'] ?? '' }}</span>
                <span class="meta-pill">🧩 {{ count($modules) }}টি মডিউল</span>
                @if(! empty($course['level']))
                    <span class="meta-pill">📊 {{ $course['level'] }}</span>
                @endif
                <span class="meta-pill">🎓 সার্টিফিকেট সহ</span>
            </div>
        </div>
    </section>

    <div class="container">
        <div class="course-layout">
            <div>
                @if(! empty($course['learn']))
                    <div class="content-card">
                        <h2>✅ কোর্সে যা যা শিখবেন</h2>
                        <ul class="learn-list">
                            @foreach($course['learn'] as $item)
                                <li>{{ $item }}</li>
                            @endforeach
                        </ul>
                    </div>
                @endif

                @if($modules)
                    <div class="content-card">
                        <h2>🧩 কোর্স মডিউল ({{ count($modules) }})</h2>
                        @foreach($modules as $i => $m)
                            <details class="module" {{ $i === 0 ? 'open' : '' }}>
                                <summary>
                                    <span>{{ $m['title'] ?? '' }}</span>
                                    <span class="module-meta">
                                        <span>⏱ {{ $m['duration'] ?? '' }}</span>
                                        <span>📘 {{ $m['lessons'] ?? '' }}</span>
                                    </span>
                                </summary>
                                @if(! empty($m['topics']))
                                    <ul class="module-topics">
                                        @foreach($m['topics'] as $t)
                                            <li>{{ $t }}</li>
                                        @endforeach
                                    </ul>
                                @endif
                            </details>
                        @endforeach
                    </div>
                @endif

                <div class="content-card">
                    <h2>📜 সার্টিফিকেট</h2>
                    <ul class="learn-list">
                        <li>কোর্স সম্পন্ন করলে ইন্ডাস্ট্রি-স্বীকৃত সার্টিফিকেট</li>
                        <li>ইউনিক ভেরিফিকেশন আইডি — যেকোনো কাজে যাচাই করা যায়</li>
                        <li>বাস্তব প্রজেক্ট ও পোর্টফোলিও সহ প্রমাণপত্র</li>
                        <li>লাইফটাইম মেন্টর সাপোর্ট ও রেকর্ডেড ক্লাস অ্যাক্সেস</li>
                    </ul>
                    <div class="cert-cta">
                        <a class="btn btn-outline" href="/verify">🔎 সার্টিফিকেট যাচাই করুন</a>
                    </div>
                </div>
            </div>

            <aside class="sidebar">
                <div class="side-card">
                    <div>
                        <span class="big-price">{{ $course['price'] ?? '' }}</span>
                        @if(! empty($course['badge']))
                            <span class="old-price">{{ $course['badge'] }}</span>
                        @endif
                    </div>
                    <ul class="side-list">
                        <li><span>⏱ সময়কাল</span><span>{{ $course['duration'] ?? '' }}</span></li>
                        <li><span>📘 লেসন</span><span>{{ $course['lessons'] ?? '' }}</span></li>
                        <li><span>🧩 মডিউল</span><span>{{ count($modules) }}টি</span></li>
                        <li><span>📊 লেভেল</span><span>{{ $course['level'] ?? '' }}</span></li>
                        <li><span>🎓 সার্টিফিকেট</span><span>সহ</span></li>
                    </ul>
                    <div style="margin-top:18px">
                        <a class="btn btn-primary btn-block" href="{{ $site['admission'] ?? '#' }}" target="_blank" rel="noopener noreferrer">
                            এডমিশন নিন →
                        </a>
                        <a class="btn btn-whatsapp btn-block" href="{{ $waLink }}" target="_blank" rel="noopener noreferrer">
                            WhatsApp-এ জিজ্ঞাসা 💬
                        </a>
                    </div>
                </div>

                @if(! empty($course['instructor']))
                    <div class="side-card">
                        <div class="instructor-row">
                            <img src="https://picsum.photos/seed/itcs-{{ $course['slug'] }}/120/120" alt="{{ $course['instructor'] }}" loading="lazy">
                            <div>
                                <span>ইন্সট্রাক্টর</span>
                                <b>{{ $course['instructor'] }}</b>
                                <span>⭐ ৪.৯ • ইন্ডাস্ট্রি এক্সপার্ট</span>
                            </div>
                        </div>
                    </div>
                @endif

                <div class="side-card">
                    <b>💳 পেমেন্ট মাধ্যম</b>
                    <p style="color:var(--muted);font-size:.92rem;margin-top:8px">
                        bKash • Nagad • Rocket • ব্যাংক ট্রান্সফার
                    </p>
                    <p style="color:var(--muted);font-size:.92rem;margin-top:6px">
                        📆 কিস্তিতে পেমেন্টের সুবিধা — এককালীন পেমেন্টে ৫% ছাড়।
                    </p>
                </div>
            </aside>
        </div>
    </div>

    @if($related->count())
        <section class="section alt">
            <div class="container">
                <div class="section-head">
                    <span class="eyebrow">আরও দেখুন</span>
                    <h2>এই ক্যাটাগরির আরও কোর্স</h2>
                </div>
                <div class="grid-3">
                    @foreach($related as $c)
                        @include('partials.course-card', ['course' => $c])
                    @endforeach
                </div>
            </div>
        </section>
    @endif

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