@props([
    'prefix' => 'seo',
    'metaTitle' => null,
    'metaDescription' => null,
    'ogImage' => null,
    'indexable' => true,
])

<div class="flex flex-col gap-4">
    <x-admin.field
        type="text"
        :name="$prefix . '[meta_title]'"
        label="Titre SEO (meta title)"
        :value="$metaTitle"
        help="Affiché dans les résultats de recherche et l'onglet du navigateur. 50-60 caractères recommandés."
    />

    <x-admin.field
        type="textarea"
        :name="$prefix . '[meta_description]'"
        label="Description SEO (meta description)"
        :value="$metaDescription"
        :rows="3"
        help="150-160 caractères recommandés."
    />

    <x-admin.media-picker
        :name="$prefix . '[og_image]'"
        label="Image Open Graph"
        :value="$ogImage"
        help="Image affichée lors du partage sur les réseaux sociaux. Par défaut : logo officiel."
    />

    <x-admin.field
        type="switch"
        :name="$prefix . '[indexable]'"
        label="Indexation par les moteurs de recherche"
        :checked="$indexable"
        help="Désactiver uniquement pour une page temporairement non destinée à apparaître dans les résultats de recherche."
    />
</div>
