@extends('layouts.portal')

@section('page-title', __('CMS Pages'))

@section('sidebar')
    @include('admin.partials.sidebar')
@endsection

@section('content')
<div class="space-y-6">
    @foreach($pages as $page)
        <div class="card" x-data="{ open: false }">
            <button type="button" @click="open = !open" class="flex w-full items-center justify-between text-left">
                <div>
                    <h2 class="font-semibold">{{ $page->title }}</h2>
                    <p class="text-sm text-gray-500">/page/{{ $page->slug }}</p>
                </div>
                <span class="badge {{ $page->is_published ? 'bg-green-100 text-green-700' : 'bg-gray-100' }}">
                    {{ $page->is_published ? __('Published') : __('Draft') }}
                </span>
            </button>
            <form method="POST" action="{{ route('admin.cms.update', $page) }}" class="mt-4 space-y-4" x-show="open" x-cloak>
                @csrf @method('PUT')
                <div>
                    <label class="label">{{ __('Title') }}</label>
                    <input type="text" name="title" value="{{ $page->title }}" required class="input-field">
                </div>
                <div>
                    <label class="label">{{ __('Content') }}</label>
                    <textarea name="content" rows="8" class="input-field font-mono text-sm">{{ $page->content }}</textarea>
                </div>
                <div class="grid gap-4 sm:grid-cols-2">
                    <div>
                        <label class="label">{{ __('Meta Title') }}</label>
                        <input type="text" name="meta_title" value="{{ $page->meta_title }}" class="input-field">
                    </div>
                    <div>
                        <label class="label">{{ __('Meta Description') }}</label>
                        <input type="text" name="meta_description" value="{{ $page->meta_description }}" class="input-field">
                    </div>
                </div>
                <label class="flex items-center gap-2 text-sm">
                    <input type="hidden" name="is_published" value="0">
                    <input type="checkbox" name="is_published" value="1" @checked($page->is_published)> {{ __('Published') }}
                </label>
                <button type="submit" class="btn-primary !py-2 !px-4 text-sm">{{ __('Update Page') }}</button>
            </form>
        </div>
    @endforeach
</div>
@endsection