@extends('frontend::layouts.master')

@section('content')
    @if (!empty($header))
        <x-frontend::page-cover title="{{ $header['name'] ?? '' }}" subtitle="{{ $header['desc'] ?? '' }}" />
    @endif

    <div class="container mx-auto px-4">
        <article class="bg-med-white rounded-lg shadow-sm p-6 md:p-8">
            <div class="mb-6">
                <h1 class="text-2xl md:text-3xl lg:text-4xl font-bold text-med-primary mb-4 leading-tight">
                    {{ $blog['name'] ?? '' }}
                </h1>
                <div class="flex items-center gap-3 mb-4">
                    <span class="text-gray-500 text-sm">
                        <i class="fa-regular fa-calendar mr-1"></i>
                        {{ str_date($blog['publish_at'], 'd m Y') }}
                    </span>
                </div>
            </div>
            <div class="mb-8 rounded-lg overflow-hidden">
                <img class="w-full h-full object-cover" src="{{ $blog['image'] ?? '' }}" alt="{{ $blog['name'] ?? '' }}">
            </div>
            {!! $blog['detail'] ?? '' !!}
        </article>
    </div>
@endsection