@extends('layouts.admin')
@section('title', $service->exists ? 'Modifier le service' : 'Nouveau service')
@section('page_title', $service->exists ? 'Modifier le service' : 'Nouveau service')

@section('content')

<form method="POST" action="{{ $service->exists ? route('admin.services.update', $service) : route('admin.services.store') }}"
      enctype="multipart/form-data" class="bg-white rounded-2xl border border-gray-100 p-6 sm:p-8 space-y-5 max-w-2xl">
    @csrf
    @if($service->exists) @method('PUT') @endif

    @if($errors->any())
        <div class="bg-rose-50 border border-rose-200 text-rose-700 text-sm font-semibold px-4 py-3 rounded-xl">
            <ul class="list-disc list-inside space-y-0.5">@foreach($errors->all() as $error)<li>{{ $error }}</li>@endforeach</ul>
        </div>
    @endif

    <div>
        <label class="block text-sm font-bold text-navy-dark mb-1.5">Titre *</label>
        <input type="text" name="title" required value="{{ old('title', $service->title) }}"
               class="w-full px-4 py-3 rounded-xl border border-gray-200 text-sm focus:outline-none focus:ring-2 focus:ring-gold">
    </div>

    <div class="grid sm:grid-cols-2 gap-5">
        <div>
            <label class="block text-sm font-bold text-navy-dark mb-1.5">Icône (nom, ex: target, phone, chart-bar)</label>
            <input type="text" name="icon" value="{{ old('icon', $service->icon) }}"
                   class="w-full px-4 py-3 rounded-xl border border-gray-200 text-sm focus:outline-none focus:ring-2 focus:ring-gold">
        </div>
        <div>
            <label class="block text-sm font-bold text-navy-dark mb-1.5">Position d'affichage</label>
            <input type="number" name="position" min="0" value="{{ old('position', $service->position) }}"
                   class="w-full px-4 py-3 rounded-xl border border-gray-200 text-sm focus:outline-none focus:ring-2 focus:ring-gold">
        </div>
    </div>

    <div>
        <label class="block text-sm font-bold text-navy-dark mb-1.5">Résumé court (liste des services)</label>
        <textarea name="excerpt" rows="2" maxlength="300"
                  class="w-full px-4 py-3 rounded-xl border border-gray-200 text-sm focus:outline-none focus:ring-2 focus:ring-gold">{{ old('excerpt', $service->excerpt) }}</textarea>
    </div>

    <div>
        <label class="block text-sm font-bold text-navy-dark mb-1.5">Description détaillée (page du service)</label>
        <textarea name="content" rows="6"
                  class="w-full px-4 py-3 rounded-xl border border-gray-200 text-sm focus:outline-none focus:ring-2 focus:ring-gold">{{ old('content', $service->content) }}</textarea>
    </div>

    <div>
        <label class="block text-sm font-bold text-navy-dark mb-1.5">Image de couverture</label>
        @if($service->cover_image)
            <img src="{{ Storage::url($service->cover_image) }}" class="w-32 h-20 object-cover rounded-lg mb-2">
        @endif
        <input type="file" name="cover_image" accept="image/*"
               class="w-full text-sm border border-gray-200 rounded-xl px-3 py-2.5 file:mr-3 file:py-1.5 file:px-3 file:rounded-lg file:border-0 file:bg-navy file:text-white file:text-xs file:font-bold">
    </div>

    <label class="flex items-center gap-2 text-sm font-bold text-navy-dark">
        <input type="checkbox" name="is_published" value="1" {{ old('is_published', $service->is_published) ? 'checked' : '' }}
               class="rounded border-gray-300 text-gold focus:ring-gold">
        Publié (visible sur le site)
    </label>

    <div class="flex items-center gap-3 pt-2">
        <button type="submit" class="btn-gold text-navy-dark font-display font-bold px-6 py-3 rounded-xl shadow-md hover:brightness-105 transition-all">
            {{ $service->exists ? 'Enregistrer' : 'Créer le service' }}
        </button>
        <a href="{{ route('admin.services.index') }}" class="text-sm font-bold text-gray-400 hover:text-navy-dark">Annuler</a>
    </div>
</form>

@endsection