{{-- resources/views/admin/blogs/_form.blade.php --}}
{{-- Used by both create.blade.php and edit.blade.php --}}
{{-- $post = BlogPost|null, $authors = Collection<TeamMember> --}}

<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">

    {{-- Main column --}}
    <div class="lg:col-span-2 space-y-5">

        <div class="admin-card space-y-5">
            <h2 style="font-family:'Fraunces',serif; font-size:0.95rem; font-weight:700; padding-bottom:0.75rem; border-bottom:1px solid #f3f4f6;">Post Content</h2>

            <div>
                <label class="form-label">Title <span style="color:#dc2626;">*</span></label>
                <input type="text" name="title" value="{{ old('title', $post?->title) }}"
                       placeholder="e.g. Building Secure Fintech APIs with Laravel"
                       class="form-field" required>
            </div>

            <div>
                <label class="form-label">Excerpt <span style="color:#9ca3af; font-weight:400;">(shown on listings)</span></label>
                <textarea name="excerpt" rows="3" class="form-field"
                          placeholder="A short summary of this post — max 500 characters…">{{ old('excerpt', $post?->excerpt) }}</textarea>
            </div>

            <div>
                <label class="form-label">Body <span style="color:#dc2626;">*</span></label>
                <p class="form-hint mb-1">HTML is supported. Use &lt;h2&gt;, &lt;p&gt;, &lt;ul&gt;, &lt;code&gt;, &lt;blockquote&gt; etc.</p>
                <textarea name="body" rows="18" class="form-field" required
                          placeholder="Write the full blog post content here. HTML is supported.">{{ old('body', $post?->body) }}</textarea>
            </div>
        </div>

    </div>

    {{-- Sidebar column --}}
    <div class="space-y-5">

        {{-- Publish settings --}}
        <div class="admin-card space-y-4">
            <h2 style="font-family:'Fraunces',serif; font-size:0.95rem; font-weight:700; padding-bottom:0.75rem; border-bottom:1px solid #f3f4f6;">Publish Settings</h2>

            <div>
                <label class="form-label">Status <span style="color:#dc2626;">*</span></label>
                <select name="status" class="form-field" required>
                    <option value="draft"     {{ old('status', $post?->status ?? 'draft') === 'draft'     ? 'selected' : '' }}>Draft</option>
                    <option value="published" {{ old('status', $post?->status) === 'published' ? 'selected' : '' }}>Published</option>
                </select>
            </div>

            <div>
                <label class="form-label">Publish Date</label>
                <input type="datetime-local" name="published_at"
                       value="{{ old('published_at', $post?->published_at?->format('Y-m-d\TH:i')) }}"
                       class="form-field">
                <p class="form-hint">Leave blank to auto-set when published.</p>
            </div>

            <div>
                <label class="form-label">Author</label>
                <select name="author_id" class="form-field">
                    <option value="">— No author —</option>
                    @foreach($authors as $author)
                    <option value="{{ $author->id }}"
                        {{ old('author_id', $post?->author_id) == $author->id ? 'selected' : '' }}>
                        {{ $author->name }} · {{ $author->role }}
                    </option>
                    @endforeach
                </select>
            </div>

            <div class="flex gap-3 pt-1">
                <button type="submit" class="btn btn-primary" style="flex:1; justify-content:center;">
                    {{ $post ? 'Update Post' : 'Create Post' }}
                </button>
                <a href="{{ route('admin.blogs.index') }}" class="btn btn-outline">Cancel</a>
            </div>
        </div>

        {{-- Meta --}}
        <div class="admin-card space-y-4">
            <h2 style="font-family:'Fraunces',serif; font-size:0.95rem; font-weight:700; padding-bottom:0.75rem; border-bottom:1px solid #f3f4f6;">Meta & Taxonomy</h2>

            <div>
                <label class="form-label">Category</label>
                <input type="text" name="category"
                       value="{{ old('category', $post?->category) }}"
                       placeholder="e.g. Laravel, Fintech, Security"
                       class="form-field">
            </div>

            <div>
                <label class="form-label">Tags</label>
                <input type="text" name="tags"
                       value="{{ old('tags', is_array($post?->tags) ? implode(', ', $post->tags) : $post?->tags) }}"
                       placeholder="tag1, tag2, tag3"
                       class="form-field">
                <p class="form-hint">Comma-separated list of tags.</p>
            </div>

            <div>
                <label class="form-label">Read Time (minutes)</label>
                <input type="number" name="read_time" min="1"
                       value="{{ old('read_time', $post?->read_time ?? 3) }}"
                       class="form-field">
            </div>

            <div>
                <label class="form-label">Cover Image URL</label>
                <input type="text" name="cover_image"
                       value="{{ old('cover_image', $post?->cover_image) }}"
                       placeholder="https://…"
                       class="form-field">
                @if($post?->cover_image)
                <img src="{{ $post->cover_image }}" alt="Cover preview"
                     style="margin-top:0.75rem; width:100%; border-radius:8px; aspect-ratio:16/9; object-fit:cover; border:1px solid #e5e7eb;">
                @endif
            </div>
        </div>

    </div>
</div>