@extends('layouts.admin')
@section('title', $article->exists ? 'Edit Artikel' : 'Artikel Baru')
@section('page-title', $article->exists ? 'Edit Artikel' : 'Tulis Artikel')

@section('content')
<div class="mx-auto max-w-3xl">
<form method="POST" enctype="multipart/form-data" action="{{ $article->exists ? route('admin.articles.update', $article) : route('admin.articles.store') }}" class="space-y-5">
    @csrf @if($article->exists) @method('PUT') @endif

    <div class="card space-y-4 p-6">
        <div><label class="label">Judul</label><input name="title" value="{{ old('title', $article->title) }}" required class="field text-lg"></div>
        <div class="grid grid-cols-2 gap-3">
            <div><label class="label">Kategori</label><input name="category" value="{{ old('category', $article->category) }}" class="field" placeholder="Tafsir / Fiqih / Inspirasi"></div>
            <div><label class="label">Status</label>
                <select name="status" class="field">
                    <option value="published" @selected(old('status',$article->status)==='published')>Published</option>
                    <option value="draft" @selected(old('status',$article->status)==='draft')>Draft</option>
                </select>
            </div>
        </div>
        <x-admin.media-field name="cover" label="Cover (opsional)" :current="$article->cover" :preview="$article->cover ? $article->coverUrl() : null" />
        <div><label class="label">Ringkasan (excerpt)</label><textarea name="excerpt" rows="2" class="field">{{ old('excerpt', $article->excerpt) }}</textarea></div>
        <div><label class="label">Isi Artikel</label><textarea name="body" rows="14" required class="field font-mono text-sm">{{ old('body', $article->body) }}</textarea>
            <p class="mt-1 text-xs text-muted">Pisahkan paragraf dengan baris kosong.</p></div>
    </div>

    <div class="card space-y-4 p-6">
        <h3 class="text-h4 flex items-center gap-2"><x-icon name="search" class="w-5 h-5 text-primary"/> SEO Artikel</h3>
        <div><label class="label">Meta Title (opsional)</label><input name="meta_title" value="{{ old('meta_title', $article->meta_title) }}" class="field" maxlength="255"></div>
        <div><label class="label">Meta Description (opsional)</label><textarea name="meta_description" rows="2" maxlength="320" class="field">{{ old('meta_description', $article->meta_description) }}</textarea></div>
    </div>

    <div class="flex gap-2"><button class="btn-filled flex-1">Simpan</button><a href="{{ route('admin.articles.index') }}" class="btn-outline">Batal</a></div>
</form>
</div>
@endsection