@extends('news.layouts.app')

@section('title', $article['title'])

@section('content')
<div class="row">
    <div class="col-md-8">

        <h2>{{ $article['title'] }}</h2>

        <div class="mb-3 text-muted">
            <img src="{{ $article['source_logo_url'] }}" width="20">
            {{ $article['source_name'] }} |
            {{ \Carbon\Carbon::parse($article['published_datetime_utc'])->format('d M Y, h:i A') }}
        </div>

        <img src="{{ $article['photo_url'] }}" class="img-fluid rounded mb-4" alt="news image">

        @if(!empty($article['authors']))
            <p><strong>Author:</strong> {{ implode(', ', $article['authors']) }}</p>
        @endif

        <p>
            {{ $article['snippet'] ?? 'Full article content will be available on source website.' }}
        </p>

        <a href="{{ $article['link'] }}" target="_blank" class="btn btn-outline-primary">
            Read Full Article
        </a>

        <!-- Related / Sub Articles -->
        @if(!empty($article['sub_articles']))
            <hr>
            <h5>Related News</h5>

            <ul class="list-group">
                @foreach($article['sub_articles'] as $sub)
                    <li class="list-group-item">
                        <a href="{{ $sub['link'] }}" target="_blank">
                            {{ $sub['title'] }}
                        </a>
                        <br>
                        <small class="text-muted">
                            {{ $sub['source_name'] }}
                        </small>
                    </li>
                @endforeach
            </ul>
        @endif

    </div>
</div>
@endsection
