@extends('layouts.public')
@section('title', 'Noticias')

@section('content')
@include('partials.page-header', ['title' => $settings?->news_title ?: 'Noticias'])

<section class="section">
    <div class="container">
        <div class="row g-4">
            @forelse($news as $item)
                <div class="col-md-4">
                    <div class="card card-hover h-100 shadow-sm">
                        @if($item->image)
                            <img src="{{ image_url($item->image) }}" class="card-img-cover" alt="{{ $item->title }}">
                        @endif
                        <div class="card-body p-4 d-flex flex-column">
                            <div class="text-muted small mb-2"><i class="bi bi-calendar3 me-1"></i>{{ $item->published_at?->format('d/m/Y') }}</div>
                            <h6 class="fw-bold"><a href="{{ route('news.show', $item->slug) }}" class="text-decoration-none text-dark">{{ $item->title }}</a></h6>
                            <p class="text-muted small mb-3">{{ Str::limit($item->excerpt ?? strip_tags($item->content ?? ''), 100) }}</p>
                            <a href="{{ route('news.show', $item->slug) }}" class="fw-bold text-decoration-none mt-auto" style="color:var(--primary);">Leer mas</a>
                        </div>
                    </div>
                </div>
            @empty
                <div class="col-12 text-center text-muted py-5">No hay noticias publicadas.</div>
            @endforelse
        </div>
        @if($news->hasPages())
            <div class="d-flex justify-content-center mt-5">{{ $news->links() }}</div>
        @endif
    </div>
</section>
@endsection