@props([
    'post' => null,
    'categories',
    'allTags' => null,
    // Passed in by the controller rather than read from a view composer:
    // SiteComposer only binds to frontend views, so admin templates have no
    // $generalSettings of their own.
    'defaultAuthor' => null,
])

@php
    $tagValue = old('tags', $post?->tags->pluck('name')->implode(', ') ?? '');
    $publishedAtValue = old('published_at', $post?->published_at?->format('Y-m-d\TH:i') ?? '');
@endphp

<div class="row g-4">
    {{-- --- Main column: the article itself ---------------------------- --}}
    <div class="col-lg-8">
        <div class="admin-card p-4 mb-4">
            <h2 class="h6 mb-3" style="color: var(--color-heading);">Article</h2>

            <div class="mb-3">
                <label for="title" class="form-label">Title</label>
                <input type="text" name="title" id="title" class="form-control @error('title') is-invalid @enderror" value="{{ old('title', $post->title ?? '') }}" maxlength="255" required>
                @error('title')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="mb-3">
                <label for="slug" class="form-label">
                    URL slug
                    <span class="text-muted">({{ $post ? 'changing this changes the live URL' : 'leave empty to generate from the title' }})</span>
                </label>
                <div class="input-group">
                    <span class="input-group-text" style="font-size: .8125rem;">{{ rtrim(config('app.url'), '/') }}/blog/</span>
                    <input type="text" name="slug" id="slug" class="form-control @error('slug') is-invalid @enderror" value="{{ old('slug', $post->slug ?? '') }}" maxlength="255">
                    @error('slug')<div class="invalid-feedback">{{ $message }}</div>@enderror
                </div>
            </div>

            <div class="mb-3">
                <label for="short_description" class="form-label">Short description</label>
                <textarea name="short_description" id="short_description" rows="3" maxlength="320" class="form-control @error('short_description') is-invalid @enderror" required>{{ old('short_description', $post->short_description ?? '') }}</textarea>
                <div class="form-text">Shown on the article card and used as the fallback meta description. Aim for 140–200 characters.</div>
                @error('short_description')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="rich-text-field">
                <label for="content" class="form-label">Article content</label>
                <textarea
                    name="content"
                    id="content"
                    class="form-control @error('content') is-invalid @enderror"
                    data-rich-text-editor
                >{{ old('content', $post->content ?? '') }}</textarea>
                <div class="form-text">
                    Use Heading&nbsp;2 and Heading&nbsp;3 for sections — the table of contents on the
                    published article is built from them automatically, along with the reading time.
                </div>
                @error('content')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
            </div>
        </div>

        <div class="admin-card p-4">
            <h2 class="h6 mb-3" style="color: var(--color-heading);">SEO</h2>

            <div class="mb-3">
                <label for="seo_title" class="form-label">SEO title <span class="text-muted">(optional)</span></label>
                <input type="text" name="seo_title" id="seo_title" class="form-control @error('seo_title') is-invalid @enderror" value="{{ old('seo_title', $post->seo_title ?? '') }}" maxlength="255" placeholder="Defaults to the article title">
                @error('seo_title')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="mb-3">
                <label for="seo_meta_description" class="form-label">Meta description <span class="text-muted">(optional)</span></label>
                <textarea name="seo_meta_description" id="seo_meta_description" rows="2" maxlength="320" class="form-control @error('seo_meta_description') is-invalid @enderror" placeholder="Defaults to the short description">{{ old('seo_meta_description', $post->seo_meta_description ?? '') }}</textarea>
                @error('seo_meta_description')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="row">
                <div class="col-md-6 mb-3">
                    <label for="seo_keywords" class="form-label">Keywords <span class="text-muted">(optional)</span></label>
                    <input type="text" name="seo_keywords" id="seo_keywords" class="form-control" value="{{ old('seo_keywords', $post->seo_keywords ?? '') }}" maxlength="255">
                </div>
                <div class="col-md-6 mb-3">
                    <label for="seo_robots" class="form-label">Robots <span class="text-muted">(optional)</span></label>
                    <input type="text" name="seo_robots" id="seo_robots" class="form-control" value="{{ old('seo_robots', $post->seo_robots ?? '') }}" maxlength="60" placeholder="index, follow">
                </div>
            </div>

            <div class="mb-3">
                <label for="seo_canonical_url" class="form-label">Canonical URL <span class="text-muted">(optional)</span></label>
                <input type="url" name="seo_canonical_url" id="seo_canonical_url" class="form-control @error('seo_canonical_url') is-invalid @enderror" value="{{ old('seo_canonical_url', $post->seo_canonical_url ?? '') }}" maxlength="255" placeholder="Only if this article was first published elsewhere">
                @error('seo_canonical_url')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="mb-0">
                <label for="seo_og_image" class="form-label">Social share image <span class="text-muted">(optional — defaults to the featured image)</span></label>
                @if($post?->seo_og_image_path)
                    <div class="mb-2">
                        <img src="{{ Storage::disk('public')->url($post->seo_og_image_path) }}" alt="" style="max-width: 220px; border-radius: 12px;">
                    </div>
                @endif
                <input type="file" name="seo_og_image" id="seo_og_image" class="form-control @error('seo_og_image') is-invalid @enderror" accept="image/jpeg,image/png,image/webp">
                @error('seo_og_image')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>
        </div>
    </div>

    {{-- --- Sidebar: publishing + taxonomy + image ---------------------- --}}
    <div class="col-lg-4">
        <div class="admin-card p-4 mb-4">
            <h2 class="h6 mb-3" style="color: var(--color-heading);">Publishing</h2>

            <div class="mb-3">
                <label for="status" class="form-label">Status</label>
                <select name="status" id="status" class="form-select @error('status') is-invalid @enderror" required>
                    @foreach(['draft' => 'Draft', 'scheduled' => 'Scheduled', 'published' => 'Published'] as $value => $label)
                        <option value="{{ $value }}" @selected(old('status', $post->status ?? 'draft') === $value)>{{ $label }}</option>
                    @endforeach
                </select>
                @error('status')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="mb-3">
                <label for="published_at" class="form-label">Publish date &amp; time</label>
                <input type="datetime-local" name="published_at" id="published_at" class="form-control @error('published_at') is-invalid @enderror" value="{{ $publishedAtValue }}">
                <div class="form-text">Leave empty when publishing to use the current time. Required for a scheduled article.</div>
                @error('published_at')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="mb-3">
                <label for="author_name" class="form-label">Author</label>
                <input type="text" name="author_name" id="author_name" class="form-control @error('author_name') is-invalid @enderror" value="{{ old('author_name', $post->author_name ?? $defaultAuthor ?? config('app.name')) }}" maxlength="120" required>
                @error('author_name')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>

            <div class="form-check mb-0">
                <input type="checkbox" name="is_featured" id="is_featured" class="form-check-input" value="1" @checked(old('is_featured', $post->is_featured ?? false))>
                <label for="is_featured" class="form-check-label">Feature this article</label>
            </div>
        </div>

        <div class="admin-card p-4 mb-4">
            <h2 class="h6 mb-3" style="color: var(--color-heading);">Organisation</h2>

            <div class="mb-3">
                <label for="blog_category_id" class="form-label">Category</label>
                <select name="blog_category_id" id="blog_category_id" class="form-select @error('blog_category_id') is-invalid @enderror" required>
                    <option value="">Choose a category…</option>
                    @foreach($categories as $category)
                        <option value="{{ $category->id }}" @selected(old('blog_category_id', $post->blog_category_id ?? null) == $category->id)>{{ $category->name }}</option>
                    @endforeach
                </select>
                @error('blog_category_id')<div class="invalid-feedback">{{ $message }}</div>@enderror
                @if($categories->isEmpty())
                    <div class="form-text text-danger">
                        No categories exist yet — <a href="{{ route('admin.blog-categories.create') }}">create one first</a>.
                    </div>
                @endif
            </div>

            <div class="mb-0">
                <label for="tags" class="form-label">Tags <span class="text-muted">(optional)</span></label>
                <input type="text" name="tags" id="tags" class="form-control @error('tags') is-invalid @enderror" value="{{ $tagValue }}" list="known-tags" placeholder="laravel, performance, seo">
                @if($allTags?->isNotEmpty())
                    <datalist id="known-tags">
                        @foreach($allTags as $tagName)
                            <option value="{{ $tagName }}"></option>
                        @endforeach
                    </datalist>
                @endif
                <div class="form-text">Comma separated. New tags are created automatically.</div>
                @error('tags')<div class="invalid-feedback">{{ $message }}</div>@enderror
            </div>
        </div>

        <div class="admin-card p-4">
            <h2 class="h6 mb-3" style="color: var(--color-heading);">Featured image</h2>

            @if($post?->featured_image_path)
                <img src="{{ $post->thumbnailUrl() }}" alt="" class="w-100 mb-3" style="border-radius: 12px; aspect-ratio: 16/9; object-fit: cover;">
            @endif

            <input type="file" name="featured_image" id="featured_image" class="form-control @error('featured_image') is-invalid @enderror" accept="image/jpeg,image/png,image/webp" @unless($post) required @endunless>
            <div class="form-text">Recommended 1600&nbsp;&times;&nbsp;900. Converted to WebP and thumbnailed automatically.</div>
            @error('featured_image')<div class="invalid-feedback d-block">{{ $message }}</div>@enderror
        </div>
    </div>
</div>