@extends('layouts.admin')

@section('page-title', 'SEO Settings')

@section('content')

    <div class="admin-card" style="margin-bottom:20px;">
        <div class="flex-between">
            <div>
                <strong>Editing SEO for:</strong>
                {{ match($pageType) {
                    'home' => 'Homepage',
                    'cases_index' => 'Cases Listing Page (/cases)',
                    'case' => 'Case: ' . ($relatedCase->title ?? ''),
                    default => $pageType,
                } }}
            </div>
            <div style="display:flex;gap:15px;">
                <a href="{{ route('admin.seo.edit', ['pageType' => 'home']) }}" class="{{ $pageType === 'home' ? 'btn' : 'btn btn-secondary' }}" style="padding:6px 14px;font-size:0.8rem;">Homepage</a>
                <a href="{{ route('admin.seo.edit', ['pageType' => 'cases_index']) }}" class="{{ $pageType === 'cases_index' ? 'btn' : 'btn btn-secondary' }}" style="padding:6px 14px;font-size:0.8rem;">Cases Listing</a>
            </div>
        </div>
    </div>

    <form method="POST" action="{{ route('admin.seo.update', ['pageType' => $pageType, 'pageId' => $pageId]) }}" enctype="multipart/form-data">
        @csrf

        <div class="admin-card">
            <div class="form-group">
                <label>Meta Title</label>
                <input type="text" name="meta_title" value="{{ old('meta_title', $seo->meta_title ?? '') }}" maxlength="255">
                <small>Shown in browser tab and search results. Ideal length: 50–60 characters.</small>
            </div>

            <div class="form-group">
                <label>Meta Description</label>
                <textarea name="meta_description" rows="3" maxlength="500">{{ old('meta_description', $seo->meta_description ?? '') }}</textarea>
                <small>Shown under the title in search results. Ideal length: 140–160 characters.</small>
            </div>

            <div class="form-group">
                <label>Social Share Image (og:image)</label>
                @if(!empty($seo?->og_image))
                    <div style="margin-bottom:10px;"><img src="{{ media_url($seo->og_image) }}" style="width:200px;border-radius:4px;"></div>
                @endif
                <input type="file" name="og_image" accept="image/*">
                <small>Shown when this page is shared on social media. Recommended: 1200x630px.</small>
            </div>
        </div>

        <button type="submit" class="btn">Save SEO Settings</button>
    </form>

@endsection