@php $s = $service ?? null; @endphp

<div style="display:grid;grid-template-columns:80px 80px 1fr 120px 80px;gap:1rem;margin-bottom:1rem;">
    <div class="form-group" style="margin-bottom:0;">
        <label class="form-label">N°</label>
        <input type="text" name="numero" class="form-control"
               value="{{ old('numero', $s?->numero ?? '01') }}"
               placeholder="01" style="font-family:'Cormorant Garamond',serif;font-size:1.2rem;text-align:center;">
    </div>
    <div class="form-group" style="margin-bottom:0;">
        <label class="form-label">Emoji</label>
        <input type="text" name="emoji" class="form-control"
               value="{{ old('emoji', $s?->emoji ?? '🔧') }}"
               style="font-size:1.5rem;text-align:center;padding:.4rem .5rem;">
    </div>
    <div class="form-group" style="margin-bottom:0;">
        <label class="form-label">Titre *</label>
        <input type="text" name="titre" class="form-control"
               value="{{ old('titre', $s?->titre) }}" required placeholder="Ex : Immobilier">
    </div>
    <div class="form-group" style="margin-bottom:0;">
        <label class="form-label">Couleur icône</label>
        <select name="couleur" class="form-control">
            @foreach(['navy'=>'🔵 Navy','gold'=>'🟡 Doré','green'=>'🟢 Vert','purple'=>'🟣 Violet','red'=>'🔴 Rouge','blue'=>'🔷 Bleu'] as $val=>$label)
                <option value="{{ $val }}" {{ old('couleur', $s?->couleur) === $val ? 'selected' : '' }}>{{ $label }}</option>
            @endforeach
        </select>
    </div>
    <div class="form-group" style="margin-bottom:0;">
        <label class="form-label">Ordre</label>
        <input type="number" name="ordre" class="form-control" min="0"
               value="{{ old('ordre', $s?->ordre ?? 0) }}">
    </div>
</div>

<div class="form-group">
    <label class="form-label">Description courte * <span style="color:var(--text-muted);font-weight:400;">(affichée sur la carte et en intro de la page)</span></label>
    <textarea name="description" class="form-control" rows="3" required
              placeholder="Résumé du service en 1-2 phrases...">{{ old('description', $s?->description) }}</textarea>
</div>

<div class="form-group">
    <label class="form-label">Tarif <span style="color:var(--text-muted);font-weight:400;">(ex : À partir de 350 000 GNF/mois)</span></label>
    <input type="text" name="prix" class="form-control"
           value="{{ old('prix', $s?->prix) }}" placeholder="Honoraires selon prestation — Contactez-nous">
</div>

<div class="form-group">
    <label class="form-label">Slug <span style="color:var(--text-muted);font-weight:400;">(URL, laissez vide pour auto-génération)</span></label>
    <div style="display:flex;align-items:center;gap:.5rem;">
        <span style="color:var(--text-muted);font-size:.88rem;white-space:nowrap;">/services/</span>
        <input type="text" name="slug" class="form-control"
               value="{{ old('slug', $s?->slug) }}" placeholder="immobilier">
    </div>
</div>

<div class="admin-form-section-title" style="margin-top:1rem;">Contenu détaillé <span style="font-weight:400;font-size:.8rem;color:var(--text-muted);">(HTML accepté — affiché sur la page de détail)</span></div>
<div class="form-group">
    <textarea name="contenu" class="form-control" rows="20"
              placeholder="<h2>Titre de section</h2>&#10;<p>Description...</p>&#10;<ul>&#10;<li>Point 1</li>&#10;</ul>">{{ old('contenu', $s?->contenu) }}</textarea>
</div>

<div class="form-group">
    <label class="admin-checkbox-label">
        <input type="checkbox" name="actif" value="1" class="admin-checkbox"
               {{ old('actif', $s?->actif ?? true) ? 'checked' : '' }}>
        <div>
            <div style="font-weight:500;"><i class="fa-solid fa-circle-check"></i> Actif</div>
            <div style="font-size:.78rem;color:var(--text-muted);">Visible sur le site public.</div>
        </div>
    </label>
</div>