@extends('dashboard.index')
@section('title', 'Membres')
@section('title2', 'Modifier')

@section('content')
    <div class="container">
        <div class="mb-3 text-end">
            <a href="{{ route('membres.index') }}" class="btn btn-secondary">
                <i class="bi bi-arrow-left me-1"></i> Retour
            </a>
            <a href="{{ route('membres.show', $membre->id) }}" class="btn btn-info">
                <i class="bi bi-eye me-1"></i> Apercu
            </a>
        </div>
        <div class="card shadow-lg border-0 rounded-4">
            <div class="card-header bg-success text-white rounded-top-4">
                <h4 class="mb-0"><i class="bi bi-person-lines-fill me-2"></i> Modifier le membre</h4>
            </div>

            <div class="card-body p-4">
                <form action="{{ route('membres.update', $membre->id) }}" method="POST" enctype="multipart/form-data">
                    @csrf
                    @method('PUT')

                    <div class="row g-4">
                        {{-- Photo --}}
                        <div class="col-md-12">
                            <label for="image" class="form-label fw-semibold"><i class="bi bi-image me-2"></i>
                                Photo</label>
                            @if ($membre->image)
                                <div class="mb-3">
                                    <img src="{{ asset('assets/images/membres/' . $membre->image) }}" width="120"
                                        class="rounded shadow-sm border">
                                </div>
                            @endif
                            <input type="file" class="form-control" name="image" id="image">
                        </div>

                        {{-- Nom et Email --}}
                        <div class="col-md-6">
                            <label for="name" class="form-label fw-semibold">Nom *</label>
                            <input type="text" class="form-control" name="name"
                                value="{{ old('name', $membre->name) }}" required>
                        </div>

                        <div class="col-md-6">
                            <label for="email" class="form-label fw-semibold">Adresse Email</label>
                            <input type="email" class="form-control" name="email"
                                value="{{ old('email', $membre->email) }}">
                        </div>

                        {{-- Téléphone et Adresse --}}
                        <div class="col-md-6">
                            <label for="telephone" class="form-label fw-semibold">Téléphone</label>
                            <input type="text" class="form-control" name="telephone"
                                value="{{ old('telephone', $membre->telephone) }}">
                        </div>

                        <div class="col-md-6">
                            <label for="adresse" class="form-label fw-semibold">Adresse</label>
                            <input type="text" class="form-control" name="adresse"
                                value="{{ old('adresse', $membre->adresse) }}">
                        </div>

                        {{-- Organisation et Fonction --}}
                        <div class="col-md-6">
                            <label for="organisation" class="form-label fw-semibold">Organisation</label>
                            <input type="text" class="form-control" name="organisation"
                                value="{{ old('organisation', $membre->organisation) }}">
                        </div>

                        <div class="col-md-6">
                            <label for="fonction" class="form-label fw-semibold">Fonction</label>
                            <input type="text" class="form-control" name="fonction"
                                value="{{ old('fonction', $membre->fonction) }}">
                        </div>

                        <div class="col-md-12">
                            <div class="card border-0 shadow-sm rounded-4">
                                <div class="card-header bg-light fw-semibold">
                                    <i class="bi bi-globe me-2 text-success"></i> Réseaux sociaux
                                </div>
                                <div class="card-body row g-3">

                                    {{-- Site web --}}
                                    <div class="col-md-12">
                                        <label for="site" class="form-label fw-semibold"><i
                                                class="bi bi-link-45deg me-2"></i> Site web</label>
                                        <input type="url" class="form-control" name="site" id="site"
                                            placeholder="https://example.com" value="{{ old('site', $membre->site) }}">
                                    </div>

                                    {{-- Réseaux sociaux --}}

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i
                                                class="bi bi-facebook me-2 text-primary"></i> Facebook</label>
                                        <input type="url" class="form-control" name="reseaux[facebook]"
                                            placeholder="https://facebook.com/username"
                                            value="{{ old('reseaux.facebook', $membre->reseaux['facebook'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i class="bi bi-twitter-x me-2 text-info"></i>
                                            X (Twitter)</label>
                                        <input type="url" class="form-control" name="reseaux[twitter-x]"
                                            placeholder="https://x.com/username"
                                            value="{{ old('reseaux.twitter-x', $membre->reseaux['twitter-x'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i
                                                class="bi bi-linkedin me-2 text-primary"></i> LinkedIn</label>
                                        <input type="url" class="form-control" name="reseaux[linkedin]"
                                            placeholder="https://linkedin.com/in/username"
                                            value="{{ old('reseaux.linkedin', $membre->reseaux['linkedin'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i
                                                class="bi bi-instagram me-2 text-danger"></i> Instagram</label>
                                        <input type="url" class="form-control" name="reseaux[instagram]"
                                            placeholder="https://instagram.com/username"
                                            value="{{ old('reseaux.instagram', $membre->reseaux['instagram'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i
                                                class="bi bi-youtube me-2 text-danger"></i> YouTube</label>
                                        <input type="url" class="form-control" name="reseaux[youtube]"
                                            placeholder="https://youtube.com/channel/username"
                                            value="{{ old('reseaux.youtube', $membre->reseaux['youtube'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i class="bi bi-tiktok me-2 text-dark"></i>
                                            TikTok</label>
                                        <input type="url" class="form-control" name="reseaux[tiktok]"
                                            placeholder="https://tiktok.com/@username"
                                            value="{{ old('reseaux.tiktok', $membre->reseaux['tiktok'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i
                                                class="bi bi-pinterest me-2 text-danger"></i> Pinterest</label>
                                        <input type="url" class="form-control" name="reseaux[pinterest]"
                                            placeholder="https://pinterest.com/username"
                                            value="{{ old('reseaux.pinterest', $membre->reseaux['pinterest'] ?? '') }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label class="form-label fw-semibold"><i
                                                class="bi bi-telegram me-2 text-info"></i> Telegram</label>
                                        <input type="url" class="form-control" name="reseaux[telegram]"
                                            placeholder="https://t.me/username"
                                            value="{{ old('reseaux.telegram', $membre->reseaux['telegram'] ?? '') }}">
                                    </div>

                                </div>
                            </div>
                        </div>

                        @super
                            {{-- Statut --}}
                            <div class="col-md-6">
                                <label for="statut" class="form-label fw-semibold">Statut</label>
                                <select class="form-select" name="statut">
                                    <option value="">Choisir</option>
                                    <option value="actif" {{ old('statut', $membre->statut) == 'actif' ? 'selected' : '' }}>
                                        Activé
                                    </option>
                                    <option value="inactif"
                                        {{ old('statut', $membre->statut) == 'inactif' ? 'selected' : '' }}>
                                        Désactivé</option>
                                </select>
                            </div>
                        @endsuper

                        {{-- Description --}}
                        <div class="col-md-12">
                            <label for="description" class="form-label fw-semibold">Description</label>
                            <textarea class="form-control" rows="3" name="description">{{ old('description', $membre->description) }}</textarea>
                        </div>
                    </div>

                    <div class="text-end mt-4">
                        <a href="{{ route('membres.index') }}" class="btn btn-outline-secondary me-2">
                            <i class="bi bi-arrow-left"></i> Annuler
                        </a>
                        <button type="submit" class="btn btn-success px-4">
                            <i class="bi bi-save me-1"></i> Mettre à jour
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
@endsection