@extends('layouts.admin')

@section('title', 'Mission SEO')

@section('content_header')
<h1>Mission SEO Settings</h1>
@stop

@section('content')
<div class="card card-primary">
    <div class="card-header">
        <h3 class="card-title">Edit Mission SEO Content</h3>
    </div>
    
    <form action="{{ route('admin.mission-seo.update') }}" method="POST">
        @csrf
        @method('PUT')
        
        <div class="card-body">
            <!-- Basic SEO Fields -->
            <div class="row">
                <div class="col-12">
                    <h5 class="text-primary mb-3">Basic SEO Information</h5>
                </div>
            </div>
            
            <div class="form-group">
                <label for="meta_title">Meta Title</label>
                <input type="text" 
                       name="meta_title" 
                       class="form-control @error('meta_title') is-invalid @enderror" 
                       id="meta_title" 
                       placeholder="Enter meta title"
                       value="{{ old('meta_title', $mission->meta_title) }}">
                @error('meta_title')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
            </div>
            
            <div class="form-group">
                <label for="meta_description">Meta Description</label>
                <textarea name="meta_description" 
                          class="form-control @error('meta_description') is-invalid @enderror" 
                          id="meta_description" 
                          rows="3"
                          placeholder="Enter meta description">{{ old('meta_description', $mission->meta_description) }}</textarea>
                @error('meta_description')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
            </div>

            <div class="form-group">
                <label for="robots_content">Robots Content</label>
                <input type="text" name="robots_content" class="form-control @error('robots_content') is-invalid @enderror" id="robots_content" 
                    placeholder="index, follow" value="{{ old('robots_content', $mission->robots_content) }}">
                <small class="form-text text-muted">Default: index, follow</small>
                @error('robots_content')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>

            <div class="form-group">
                <label for="canonical_url">Canonical URL</label>
                <input type="url" name="canonical_url" class="form-control @error('canonical_url') is-invalid @enderror" id="canonical_url" 
                    placeholder="https://example.com" value="{{ old('canonical_url', $mission->canonical_url) }}">
                <small class="form-text text-muted">Leave empty to use current page URL</small>
                @error('canonical_url')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>

            <!-- Open Graph Tags -->
            <hr>
            <div class="row">
                <div class="col-12">
                    <h5 class="text-primary mb-3">Open Graph Tags</h5>
                </div>
            </div>
            
            <div class="form-group">
                <label for="og_title">OG Title</label>
                <input type="text" name="og_title" class="form-control @error('og_title') is-invalid @enderror" id="og_title" 
                    placeholder="Leave empty to use Meta Title" value="{{ old('og_title', $mission->og_title) }}">
                @error('og_title')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>
            
            <div class="form-group">
                <label for="og_description">OG Description</label>
                <textarea name="og_description" class="form-control @error('og_description') is-invalid @enderror" id="og_description" rows="2"
                    placeholder="Leave empty to use Meta Description">{{ old('og_description', $mission->og_description) }}</textarea>
                @error('og_description')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>
            
            <div class="form-group">
                <label for="og_image">OG Image</label>
                <input type="url" name="og_image" class="form-control @error('og_image') is-invalid @enderror" id="og_image" 
                    placeholder="https://example.com/image.jpg" value="{{ old('og_image', $mission->og_image) }}">
                @error('og_image')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>

            <!-- Twitter Card Tags -->
            <hr>
            <div class="row">
                <div class="col-12">
                    <h5 class="text-primary mb-3">Twitter Card Tags</h5>
                </div>
            </div>
            
            <div class="form-group">
                <label for="twitter_title">Twitter Title</label>
                <input type="text" name="twitter_title" class="form-control @error('twitter_title') is-invalid @enderror" id="twitter_title" 
                    placeholder="Leave empty to use Meta Title" value="{{ old('twitter_title', $mission->twitter_title) }}">
                @error('twitter_title')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>
            
            <div class="form-group">
                <label for="twitter_description">Twitter Description</label>
                <textarea name="twitter_description" class="form-control @error('twitter_description') is-invalid @enderror" id="twitter_description" rows="2"
                    placeholder="Leave empty to use Meta Description">{{ old('twitter_description', $mission->twitter_description) }}</textarea>
                @error('twitter_description')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>
            
            <div class="form-group">
                <label for="twitter_image">Twitter Image</label>
                <input type="url" name="twitter_image" class="form-control @error('twitter_image') is-invalid @enderror" id="twitter_image" 
                    placeholder="https://example.com/image.jpg" value="{{ old('twitter_image', $mission->twitter_image) }}">
                @error('twitter_image')
                    <span class="invalid-feedback" role="alert"><strong>{{ $message }}</strong></span>
                @enderror
            </div>

            <!-- Custom Scripts Section -->
            <hr>
            <div class="row">
                <div class="col-12">
                    <h5 class="text-primary mb-3">Custom Scripts</h5>
                </div>
            </div>
            
            <div class="form-group">
                <label for="header_scripts">Header Scripts</label>
                <textarea name="header_scripts" 
                          class="form-control @error('header_scripts') is-invalid @enderror" 
                          id="header_scripts" 
                          rows="4"
                          placeholder="<script>...</script> or <meta name=... > or other HTML tags ONLY">{{ old('header_scripts', $mission->header_scripts) }}</textarea>
                <small class="form-text text-muted">
                    <strong class="text-danger">⚠️ IMPORTANT:</strong> Only HTML tags (scripts, meta tags, etc.). <strong>DO NOT</strong> add plain text or descriptions here - they will appear as visible text on the website!<br>
                    <strong>Examples:</strong> <code>&lt;script&gt;...&lt;/script&gt;</code>, <code>&lt;meta name="..."&gt;</code>, <code>&lt;!-- comments --&gt;</code>
                </small>
                @error('header_scripts')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
            </div>
            
            <div class="form-group">
                <label for="body_scripts">Body Scripts (JSON-LD Schema)</label>
                <textarea name="body_scripts" 
                          class="form-control @error('body_scripts') is-invalid @enderror" 
                          id="body_scripts" 
                          rows="6"
                          placeholder="<script type='application/ld+json'>...</script> or other scripts ONLY">{{ old('body_scripts', $mission->body_scripts) }}</textarea>
                <small class="form-text text-muted">
                    <strong class="text-danger">⚠️ IMPORTANT:</strong> Only HTML/JavaScript code. <strong>DO NOT</strong> add plain text - it will display on the website!<br>
                    <strong>Examples:</strong> JSON-LD schema, Google Analytics code, tracking pixels
                </small>
                @error('body_scripts')
                    <span class="invalid-feedback" role="alert">
                        <strong>{{ $message }}</strong>
                    </span>
                @enderror
            </div>
        </div>
        
        <div class="card-footer">
            <button type="submit" class="btn btn-primary">
                Update SEO Content
            </button>
            <a href="{{ route('admin.mission-seo.show') }}" class="btn btn-default float-right">
                Cancel
            </a>
        </div>
    </form>
</div>
@stop