@extends('layouts.base')

@section('content')
    @section('breadcrumb')
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-0">
                <li class="breadcrumb-item"><a href="{{ route('front.index') }}">Tableau de bord</a></li>
                <li class="breadcrumb-item"><a href="{{ route('partner.applications') }}">Applications</a></li>
                <li class="breadcrumb-item"><a href="{{ route('partner.programs', $application) }}">Programmes</a></li>
                <li class="breadcrumb-item active" aria-current="page">{{ $program->name }}</li>
            </ol>
        </nav>
    @endsection

    <div class="container-fluid py-4">
        <!-- Messages de validation -->
        @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <h5 class="alert-heading"><i class="fas fa-check-circle me-2"></i>Succès</h5>
            <p class="mb-0">{{ session('success') }}</p>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        @endif

        @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <h5 class="alert-heading"><i class="fas fa-exclamation-triangle me-2"></i>Erreur</h5>
            <p class="mb-0">{{ session('error') }}</p>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        @endif

        @if ($errors->any())
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <h5 class="alert-heading"><i class="fas fa-exclamation-triangle me-2"></i>Erreurs</h5>
            <ul class="mb-0">
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        @endif

        <!-- Header avec info programme -->
        <div class="row mb-4">
            <div class="col-12">
                <div class="card shadow-sm border-0">
                    <div class="card-body py-3">
                        <div class="row align-items-center">
                            <div class="col-md-8">
                                <div class="d-flex align-items-center gap-3">
                                    @if($program->getMedia('images')->count() > 0)
                                        <div class="rounded-circle overflow-hidden" style="width: 70px; height: 70px;">
                                            <img src="{{ $program->getFirstMediaUrl('images', 'thumb') }}" alt="{{ $program->name }}" class="img-fluid w-100 h-100 object-fit-cover">
                                        </div>
                                    @else
                                        <div class="avatar-lg bg-primary text-white rounded-circle d-flex align-items-center justify-content-center" style="width: 70px; height: 70px;">
                                            <i class="fas fa-building"></i>
                                        </div>
                                    @endif
                                    <div>
                                        <h3 class="mb-1">{{ $program->name }}</h3>
                                        <p class="text-muted mb-2">{{ $program->slug }}</p>
                                        <div class="d-flex gap-2 flex-wrap">
                                            @if($program->is_active)
                                                <span class="badge bg-success">
                                                    <i class="fas fa-check me-1"></i>Actif
                                                </span>
                                            @else
                                                <span class="badge bg-secondary">
                                                    <i class="fas fa-pause me-1"></i>Inactif
                                                </span>
                                            @endif
                                            @if($program->creatorApplication()?->id !== $application->id)
                                                <span class="badge bg-info">
                                                    <i class="fas fa-share-alt me-1"></i>Partagé
                                                </span>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-4 text-md-end mt-3 mt-md-0">
                                <div class="d-flex flex-column flex-md-row gap-2 justify-content-md-end">
                                    <a href="{{ route('partner.lots', ['application' => $application, 'program' => $program]) }}" class="btn btn-success text-white">
                                        <i class="fas fa-home me-2"></i>Gérer les lots
                                    </a>
                                    @if($program->creatorApplication()?->id === $application->id)
                                        <a href="{{ route('partner.program.edit', ['application' => $application, 'program' => $program]) }}" class="btn btn-primary">
                                            <i class="fas fa-edit me-2"></i>Modifier
                                        </a>
                                    @endif
                                    <a href="{{ route('partner.programs', $application) }}" class="btn btn-outline-secondary">
                                        <i class="fas fa-arrow-left me-2"></i>Retour
                                    </a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="row">
            <!-- Details Card with Tabs -->
            <div class="col-12">
                <div class="card shadow-sm h-100">
                    <div class="card-header">
                        <ul class="nav nav-tabs card-header-tabs" id="programTabs" role="tablist">
                            <li class="nav-item" role="presentation">
                                <button class="nav-link active" id="informations-tab" data-bs-toggle="tab" data-bs-target="#informations" type="button" role="tab" aria-controls="informations" aria-selected="true">
                                    <i class="fas fa-info-circle me-2"></i>Informations
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="argumentaires-tab" data-bs-toggle="tab" data-bs-target="#argumentaires" type="button" role="tab" aria-controls="argumentaires" aria-selected="false">
                                    <i class="fas fa-comment-dots me-2"></i>Argumentaires
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="operations-commerciales-tab" data-bs-toggle="tab" data-bs-target="#operations-commerciales" type="button" role="tab" aria-controls="operations-commerciales" aria-selected="false">
                                    <i class="fas fa-tags me-2"></i>Opérations Commerciales
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="sync-lots-tab" data-bs-toggle="tab" data-bs-target="#sync-lots" type="button" role="tab" aria-controls="sync-lots" aria-selected="false">
                                    <i class="fas fa-sync-alt me-2"></i>Synchronisation des lots
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="annexes-tab" data-bs-toggle="tab" data-bs-target="#annexes" type="button" role="tab" aria-controls="annexes" aria-selected="false">
                                    <i class="fas fa-warehouse me-2"></i>Gestion des annexes
                                </button>
                            </li>
                            <li class="nav-item" role="presentation">
                                <button class="nav-link" id="parameters-tab" data-bs-toggle="tab" data-bs-target="#parameters" type="button" role="tab" aria-controls="parameters" aria-selected="false">
                                    <i class="fas fa-cog me-2"></i>Paramètres des ventes
                                </button>
                            </li>
                        </ul>
                    </div>
                    <div class="card-body">
                        <div class="tab-content" id="programTabsContent">
                            <!-- Onglet Informations -->
                            <div class="tab-pane fade show active" id="informations" role="tabpanel" aria-labelledby="informations-tab">
                        <div class="row g-4">
                            <!-- Program Info -->
                            <div class="col-md-6">
                                <h6 class="text-primary mb-3">
                                    <i class="fas fa-building me-2"></i>Informations du programme
                                </h6>
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">Nom</label>
                                    <p class="mb-0">{{ $program->name }}</p>
                                </div>

                                @php
                                    $address = $program->addresses->first();
                                @endphp

                                @if($address)
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">
                                        <i class="fas fa-map-marker-alt me-1"></i>{{ $address->type }}
                                    </label>
                                    <p class="mb-0">
                                        @if($address->line_1)
                                            {{ $address->line_1 }}<br>
                                        @endif
                                        @if($address->line_2)
                                            {{ $address->line_2 }}<br>
                                        @endif
                                        @if($address->zip_code || $address->city)
                                            {{ $address->zip_code }} {{ $address->city }}<br>
                                        @endif
                                        @if($address->country)
                                            {{ $address->country }}
                                        @endif
                                    </p>
                                    @if($address->latitude && $address->longitude)
                                    <p class="mb-0 mt-2 text-muted small">
                                        <i class="fas fa-globe me-1"></i>
                                        Coordonnées : {{ $address->latitude }}, {{ $address->longitude }}
                                    </p>
                                    @endif
                                </div>
                                @endif

                                <!-- Type de Contrat -->
                                @if($program->contrat_type && $program->contrat_type !== \App\Enums\ContratTypeProgram::NON_DEFINI)
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">
                                        <i class="fas fa-file-signature me-1"></i>Type de contrat
                                    </label>
                                    <p class="mb-0">
                                        <span class="badge {{ $program->contrat_type->bgColor() }} fs-6">
                                            <i class="fas {{ $program->contrat_type->icon() }} me-1"></i>{{ $program->contrat_type->label() }}
                                        </span>
                                    </p>
                                    <small class="text-muted d-block mt-1">{{ $program->contrat_type->description() }}</small>
                                </div>
                                @endif

                                <!-- Dates Clés -->
                                @if($program->dates->count() > 0)
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">
                                        <i class="fas fa-calendar-alt me-1"></i>Dates clés
                                    </label>
                                    @php
                                        $programDates = $program->dates->keyBy('type');
                                    @endphp
                                    @foreach(\App\Enums\DateTypeProgram::cases() as $dateType)
                                        @php
                                            $date = $programDates->get($dateType->value);
                                        @endphp
                                        @if($date && $date->value)
                                        <div class="mb-2">
                                            <div class="d-flex align-items-center">
                                                <div class="flex-shrink-0 me-2">
                                                    <span class="badge {{ $dateType->bgColor() }}">
                                                        <i class="fas {{ $dateType->icon() }} me-1"></i>
                                                    </span>
                                                </div>
                                                <div class="flex-grow-1">
                                                    <small class="text-muted d-block">{{ $dateType->label() }}</small>
                                                    <strong>{{ $date->value->format('d/m/Y') }}</strong>
                                                </div>
                                            </div>
                                        </div>
                                        @endif
                                    @endforeach
                                </div>
                                @endif
                            </div>

                            <!-- Technical Info -->
                            <div class="col-md-6">
                                <h6 class="text-primary mb-3">
                                    <i class="fas fa-cogs me-2"></i>Informations techniques
                                </h6>
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">ID Programme</label>
                                    <p class="mb-0"><code>{{ $program->id }}</code></p>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">Statut</label>
                                    <div>
                                        @if($program->is_active)
                                            <span class="badge bg-success">Actif</span>
                                        @else
                                            <span class="badge bg-secondary">Inactif</span>
                                        @endif
                                    </div>
                                </div>
                                <div class="mb-3">
                                    <label class="form-label fw-bold text-muted">Nombre de lots</label>
                                    <p class="mb-0">
                                        <i class="fas fa-home me-2 text-muted"></i>
                                        {{ $program->lots?->count() ?? 0 }} lot(s)
                                    </p>
                                </div>
                            </div>
                        </div>

                        <!-- Champs personnalisés Section -->
                        @if(isset($formEditor) && $formEditor && $formEditor->fields->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <div class="card border-primary shadow-sm">
                                <div class="card-header bg-primary">
                                    <h6 class="mb-0 text-primary">
                                        <i class="fas fa-star me-2"></i>Champs personnalisés
                                    </h6>
                                    <small class="text-muted">Données spécifiques à cette application</small>
                                    <div class="alert alert-info mt-2 mb-0 py-2">
                                        <i class="fas fa-info-circle me-2"></i>
                                        <small><strong>Note :</strong> Ces champs ne concernent pas l'affichage sur le site de diffusion. Ils sont uniquement utilisés pour la gestion interne.</small>
                                    </div>
                                </div>
                                <div class="card-body">
                                    <div class="row g-3">
                                        @foreach($formEditor->fields as $field)
                                            @php
                                                $fieldValue = $field->data && isset($field->data->json['value']) ? $field->data->json['value'] : null;
                                            @endphp
                                            @if($fieldValue !== null && $fieldValue !== '')
                                                <div class="col-md-6">
                                                    <label class="form-label fw-bold text-muted">
                                                        <i class="fas {{ $field->type->icon() }} me-1 {{ $field->type->textColor() }}"></i>
                                                        {{ $field->label ?? $field->type->label() }}
                                                    </label>
                                                    @if($field->type === \App\Enums\FieldType::TEXT || $field->type === \App\Enums\FieldType::NUMBER)
                                                        <p class="mb-0">{{ $fieldValue }}</p>
                                                    @elseif($field->type === \App\Enums\FieldType::CHECKBOX)
                                                        <p class="mb-0">
                                                            @if($fieldValue == '1')
                                                                <span class="badge bg-success">
                                                                    <i class="fas fa-check me-1"></i>Activé
                                                                </span>
                                                            @else
                                                                <span class="badge bg-secondary">
                                                                    <i class="fas fa-times me-1"></i>Désactivé
                                                                </span>
                                                            @endif
                                                        </p>
                                                    @elseif($field->type === \App\Enums\FieldType::DATE)
                                                        <p class="mb-0">{{ \Carbon\Carbon::parse($fieldValue)->format('d/m/Y') }}</p>
                                                    @else
                                                        <p class="mb-0">{{ $fieldValue }}</p>
                                                    @endif
                                                    @if($field->description)
                                                        <small class="text-muted d-block mt-1">{{ $field->description }}</small>
                                                    @endif
                                                </div>
                                            @endif
                                        @endforeach
                                    </div>
                                    @if($formEditor->fields->filter(fn($f) => $f->data && isset($f->data->json['value']) && $f->data->json['value'] !== '')->count() === 0)
                                        <div class="text-center py-3 text-muted">
                                            <i class="fas fa-info-circle me-2"></i>Aucune donnée personnalisée renseignée
                                        </div>
                                    @endif
                                </div>
                            </div>
                        </div>
                        @endif

                        <!-- Fiscalités Section -->
                        @if($program->fiscalites->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <h6 class="text-primary mb-3">
                                <i class="fas fa-coins me-2"></i>Fiscalités applicables
                            </h6>
                            <div class="row g-3">
                                @foreach($program->fiscalites as $fiscalite)
                                <div class="col-md-6 col-lg-4">
                                    <div class="fiscalite-display-card">
                                        <div class="d-flex align-items-center">
                                            <div class="fiscalite-display-icon {{ $fiscalite->type->bgColor() }} text-white me-3">
                                                <i class="fas {{ $fiscalite->type->icon() }}"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <div class="fw-bold">{{ $fiscalite->type->label() }}</div>
                                                {{-- <small class="text-muted">Dispositif fiscal</small> --}}
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                @endforeach
                            </div>
                        </div>
                        @endif

                        <!-- Normes Écologiques Section -->
                        @if($program->normeEcos->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <h6 class="text-primary mb-3">
                                <i class="fas fa-leaf me-2"></i>Normes écologiques
                            </h6>
                            <div class="row g-3">
                                @foreach($program->normeEcos as $normeEco)
                                <div class="col-md-6 col-lg-4">
                                    <div class="fiscalite-display-card">
                                        <div class="d-flex align-items-center">
                                            <div class="fiscalite-display-icon {{ $normeEco->type->bgColor() }} text-white me-3">
                                                <i class="fas {{ $normeEco->type->icon() }}"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <div class="fw-bold">{{ $normeEco->type->label() }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                @endforeach
                            </div>
                        </div>
                        @endif

                        <!-- Garanties Section -->
                        @if($program->garanties->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <h6 class="text-primary mb-3">
                                <i class="fas fa-shield-alt me-2"></i>Garanties du programme
                            </h6>
                            <div class="row g-3">
                                @foreach($program->garanties as $garantie)
                                @if($garantie->type)
                                <div class="col-md-6 col-lg-4">
                                    <div class="fiscalite-display-card">
                                        <div class="d-flex align-items-center">
                                            <div class="fiscalite-display-icon {{ $garantie->type->bgColor() }} text-white me-3">
                                                <i class="fas {{ $garantie->type->icon() }}"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <div class="fw-bold">{{ $garantie->type->label() }}</div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                @endif
                                @endforeach
                            </div>
                        </div>
                        @endif

                        <!-- Prestations Section -->
                        @if($program->prestations->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <h6 class="text-primary mb-3">
                                <i class="fas fa-concierge-bell me-2"></i>Prestations du programme
                            </h6>
                            <div class="d-flex flex-wrap gap-2">
                                @foreach($program->prestations as $prestation)
                                <span class="badge bg-{{ $prestation->type->color() }} fs-6 py-2 px-3">
                                    <i class="{{ $prestation->type->icon() }} me-1"></i>{{ $prestation->type->label() }}
                                </span>
                                @endforeach
                            </div>
                        </div>
                        @endif

                        <!-- Marketing Tags Section -->
                        @if($program->marketingTags->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <h6 class="text-primary mb-3">
                                <i class="fas fa-tags me-2"></i>Mise en avant marketing
                            </h6>
                            <div class="d-flex flex-wrap gap-2">
                                @foreach($program->marketingTags as $tag)
                                @if($tag->type)
                                <span class="badge {{ $tag->type->bgColor() }} fs-6 py-2 px-3" title="{{ $tag->type->description() }}">
                                    <i class="fas {{ $tag->type->icon() }} me-1"></i>{{ $tag->type->label() }}
                                </span>
                                @endif
                                @endforeach
                            </div>
                            <small class="text-muted d-block mt-2">
                                <i class="fas fa-info-circle me-1"></i>Ces tags permettent de mettre en avant certaines caractéristiques du programme
                            </small>
                        </div>
                        @endif

                        <!-- Applications partagées Section -->
                        @php
                            $sharedApps = $program->applications->where('id', '!=', $application->id);
                        @endphp
                        @if($sharedApps->count() > 0)
                        <hr class="my-4">
                        <div class="mb-4">
                            <h6 class="text-primary mb-3">
                                <i class="fas fa-share-nodes me-2"></i>Programme partagé avec
                            </h6>
                            <div class="row g-3">
                                @foreach($sharedApps as $app)
                                    <div class="col-md-6 col-lg-4">
                                        <div class="fiscalite-display-card">
                                            <div class="d-flex align-items-center">
                                                <div class="fiscalite-display-icon bg-{{ $app->is_active ? 'success' : 'secondary' }} text-white me-3">
                                                    {{ Str::of($app->name)->substr(0,1) }}
                                                </div>
                                                <div class="flex-grow-1">
                                                    <div class="fw-bold">{{ $app->name }}</div>
                                                    <small class="text-muted">{{ $app->slug }}</small>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                            <small class="text-muted d-block mt-2">
                                <i class="fas fa-info-circle me-1"></i>Ce programme est partagé avec {{ $sharedApps->count() }} autre(s) application(s)
                            </small>
                        </div>
                        @endif

                        <hr class="my-4">

                        <!-- Timestamps -->
                        <div class="row g-4">
                            <div class="col-md-12">
                                <h6 class="text-primary mb-3">
                                    <i class="fas fa-calendar me-2"></i>Dates importantes
                                </h6>
                                <div class="row g-4 mb-3">
                                    <div class="col-md-6">
                                        <label class="form-label fw-bold text-muted">Créé le</label>
                                        <p class="mb-0">
                                            <i class="fas fa-calendar-plus me-2 text-muted"></i>
                                            {{ $program->created_at->format('d/m/Y à H:i') }}
                                        </p>
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label fw-bold text-muted">Dernière modification</label>
                                        <p class="mb-0">
                                            <i class="fas fa-calendar-edit me-2 text-muted"></i>
                                            {{ $program->updated_at->format('d/m/Y à H:i') }}
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                            </div>
                            <!-- Fin Onglet Informations -->

                            <!-- Onglet Argumentaires -->
                            <div class="tab-pane fade" id="argumentaires" role="tabpanel" aria-labelledby="argumentaires-tab">

                                @if($program->creatorApplication()?->id === $application->id)
                                <!-- Formulaire d'ajout d'argumentaire -->
                                <div class="card mb-4">
                                    <div class="card-header bg-primary text-black">
                                        <h6 class="mb-0">
                                            <i class="fas fa-plus-circle me-2"></i>Ajouter un argumentaire
                                        </h6>
                                    </div>
                                    <div class="card-body">
                                        <form method="POST" action="{{ route('partner.program.argumentaires.store', ['application' => $application, 'program' => $program]) }}">
                                            @csrf
                                            <div class="mb-3">
                                                <label class="form-label fw-bold">Type d'argumentaire</label>
                                                <select name="type" class="form-select" required>
                                                    <option value="">— Sélectionner un type —</option>
                                                    @foreach(\App\Enums\ArgumentaireType::selectableCases() as $type)
                                                    <option value="{{ $type->value }}">
                                                        {{ $type->label() }} - {{ $type->description() }}
                                                    </option>
                                                    @endforeach
                                                </select>
                                            </div>
                                            <div class="mb-3">
                                                <label class="form-label fw-bold">Contenu</label>
                                                <div id="argumentaire-editor-container" style="height: 200px; background: white;"></div>
                                                <input type="hidden" id="argumentaire-text-hidden" name="text" required>
                                                <small class="text-muted">Utilisez l'éditeur pour mettre en forme votre texte (gras, puces, liens, etc.)</small>
                                            </div>
                                            <div class="d-flex justify-content-end">
                                                <button type="submit" class="btn btn-primary">
                                                    <i class="fas fa-plus me-2"></i>Ajouter l'argumentaire
                                                </button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                                @else
                                <div class="alert alert-warning mb-4">
                                    <i class="fas fa-lock me-2"></i>
                                    <strong>Programme partagé</strong> - Seule l'application créatrice (<strong>{{ $program->creatorApplication()?->name }}</strong>) peut ajouter des argumentaires.
                                </div>
                                @endif

                                <!-- Liste des argumentaires -->
                                @if($program->argumentaires->count() > 0)
                                <div class="card">
                                    <div class="card-header d-flex justify-content-between align-items-center">
                                        <h6 class="mb-0">
                                            <i class="fas fa-list me-2"></i>Argumentaires du programme
                                        </h6>
                                        <small class="text-muted">Glissez-déposez pour réorganiser</small>
                                    </div>
                                    <div class="card-body">
                                        <div id="sortable-argumentaires" class="list-group">
                                            @foreach($program->argumentaires->sortBy('order') as $argumentaire)
                                            <div class="list-group-item sortable-argumentaire-item" data-id="{{ $argumentaire->id }}">
                                                <div class="d-flex align-items-start">
                                                    <div class="flex-shrink-0 me-3">
                                                        <div class="argumentaire-icon {{ $argumentaire->type->bgColor() }} text-white">
                                                            <i class="fas {{ $argumentaire->type->icon() }}"></i>
                                                        </div>
                                                    </div>
                                                    <div class="flex-grow-1">
                                                        <div class="d-flex justify-content-between align-items-start mb-3">
                                                            <div>
                                                                <span class="badge {{ $argumentaire->type->bgColor() }} me-2">
                                                                    {{ $argumentaire->type->label() }}
                                                                </span>
                                                                <span class="badge bg-secondary">
                                                                    <i class="fas fa-sort me-1"></i>Ordre: {{ $argumentaire->order }}
                                                                </span>
                                                            </div>
                                                            @if($program->creatorApplication()?->id === $application->id)
                                                            <form method="POST" action="{{ route('partner.program.argumentaires.destroy', ['application' => $application, 'program' => $program, 'argumentaire' => $argumentaire]) }}" onsubmit="return confirm('Êtes-vous sûr de vouloir supprimer cet argumentaire ?');">
                                                                @csrf
                                                                @method('DELETE')
                                                                <button type="submit" class="btn btn-sm btn-outline-danger">
                                                                    <i class="fas fa-trash"></i>
                                                                </button>
                                                            </form>
                                                            @endif
                                                        </div>
                                                        <div class="argumentaire-content">
                                                            {!! $argumentaire->text !!}
                                                        </div>
                                                    </div>
                                                    <div class="flex-shrink-0 ms-3 argumentaire-drag-handle" title="Glissez pour réorganiser" data-bs-toggle="tooltip">
                                                        <i class="fas fa-grip-vertical text-muted"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            @endforeach
                                        </div>
                                    </div>
                                </div>
                                @else
                                <div class="alert alert-info">
                                    <i class="fas fa-info-circle me-2"></i>
                                    Aucun argumentaire pour le moment. Utilisez le formulaire ci-dessus pour en ajouter un.
                                </div>
                                @endif
                            </div>
                            <!-- Fin Onglet Argumentaires -->

                            <!-- Onglet Opérations Commerciales -->
                            <div class="tab-pane fade" id="operations-commerciales" role="tabpanel" aria-labelledby="operations-commerciales-tab">

                                @if($program->creatorApplication()?->id === $application->id)
                                <!-- Formulaire d'ajout d'opération commerciale -->
                                <div class="card mb-4">
                                    <div class="card-header bg-success text-black">
                                        <h6 class="mb-0">
                                            <i class="fas fa-plus-circle me-2"></i>Ajouter une opération commerciale
                                        </h6>
                                    </div>
                                    <div class="card-body">
                                        <form method="POST" action="{{ route('partner.program.ope-coms.store', ['application' => $application, 'program' => $program]) }}">
                                            @csrf
                                            <div class="mb-3">
                                                <label class="form-label fw-bold">Type d'opération</label>
                                                <select name="type" class="form-select" required>
                                                    <option value="">— Sélectionner un type —</option>
                                                    @foreach(\App\Enums\OpeCom::selectableCases() as $type)
                                                    <option value="{{ $type->value }}">
                                                        {{ $type->label() }} - {{ $type->description() }}
                                                    </option>
                                                    @endforeach
                                                </select>
                                            </div>
                                            <div class="mb-3">
                                                <label class="form-label fw-bold">Contenu</label>
                                                <div id="opecom-editor-container" style="height: 200px; background: white;"></div>
                                                <input type="hidden" id="opecom-text-hidden" name="text" required>
                                                <small class="text-muted">Utilisez l'éditeur pour mettre en forme votre texte (gras, puces, liens, etc.)</small>
                                            </div>

                                            <div class="row g-3 mb-3">
                                                <div class="col-md-6">
                                                    <label class="form-label fw-bold">Ratio (%)</label>
                                                    <input type="number" step="0.01" min="0" max="100" name="ratio" class="form-control" id="opecom-ratio" placeholder="Ex: 5.50">
                                                    <small class="text-muted">Pourcentage de réduction</small>
                                                </div>
                                                <div class="col-md-6">
                                                    <label class="form-label fw-bold">Prix limite (€)</label>
                                                    <input type="number" step="0.01" min="0" name="price" class="form-control" id="opecom-price" placeholder="Ex: 5000.00">
                                                    <small class="text-muted">Prix maximum de l'avantage</small>
                                                </div>
                                            </div>

                                            <div class="row g-3 mb-3">
                                                <div class="col-md-6">
                                                    <label class="form-label fw-bold">Date de début</label>
                                                    <input type="datetime-local" name="date_start" class="form-control">
                                                    <small class="text-muted">Date de début de l'opération</small>
                                                </div>
                                                <div class="col-md-6">
                                                    <label class="form-label fw-bold">Date de fin</label>
                                                    <input type="datetime-local" name="date_end" class="form-control">
                                                    <small class="text-muted">Date de fin de l'opération</small>
                                                </div>
                                            </div>

                                            <div id="opecom-info-message" class="alert alert-info d-none" role="alert">
                                                <i class="fas fa-info-circle me-2"></i>
                                                <strong>Info :</strong> Le ratio sera appliqué avec une limite de prix. Le montant de l'avantage ne dépassera pas le prix limite défini.
                                            </div>

                                            <div class="d-flex justify-content-end">
                                                <button type="submit" class="btn btn-success">
                                                    <i class="fas fa-plus me-2"></i>Ajouter l'opération
                                                </button>
                                            </div>
                                        </form>
                                    </div>
                                </div>
                                @else
                                <div class="alert alert-warning mb-4">
                                    <i class="fas fa-lock me-2"></i>
                                    <strong>Programme partagé</strong> - Seule l'application créatrice (<strong>{{ $program->creatorApplication()?->name }}</strong>) peut ajouter des opérations commerciales.
                                </div>
                                @endif

                                <!-- Liste des opérations commerciales -->
                                @if($program->opeComs->count() > 0)
                                <div class="card">
                                    <div class="card-header d-flex justify-content-between align-items-center">
                                        <h6 class="mb-0">
                                            <i class="fas fa-list me-2"></i>Opérations commerciales du programme
                                        </h6>
                                        <small class="text-muted">Glissez-déposez pour réorganiser</small>
                                    </div>
                                    <div class="card-body">
                                        <div id="sortable-ope-coms" class="list-group">
                                            @foreach($program->opeComs->sortBy('order') as $opeCom)
                                            @php
                                                $dateStartBadge = $opeCom->dates->firstWhere('type', 'date_start');
                                                $dateEndBadge = $opeCom->dates->firstWhere('type', 'date_end');
                                            @endphp
                                            <div class="list-group-item sortable-opecom-item" data-id="{{ $opeCom->id }}">
                                                <div class="d-flex align-items-start">
                                                    <div class="flex-shrink-0 me-3">
                                                        <div class="argumentaire-icon {{ $opeCom->type->bgColor() }} text-white">
                                                            <i class="fas {{ $opeCom->type->icon() }}"></i>
                                                        </div>
                                                    </div>
                                                    <div class="flex-grow-1">
                                                        <div class="mb-3">
                                                            <div class="d-flex flex-wrap gap-2 align-items-center mb-2">
                                                                <span class="badge {{ $opeCom->type->bgColor() }}">
                                                                    {{ $opeCom->type->label() }}
                                                                </span>
                                                                <span class="badge bg-secondary">
                                                                    <i class="fas fa-sort me-1"></i>Ordre: {{ $opeCom->order }}
                                                                </span>
                                                                @if($opeCom->ratio)
                                                                <span class="badge bg-warning text-dark">
                                                                    <i class="fas fa-percentage me-1"></i>{{ number_format($opeCom->ratio, 2, ',', ' ') }}%
                                                                </span>
                                                                @endif
                                                                @if($opeCom->prices && $opeCom->prices->first())
                                                                <span class="badge bg-info">
                                                                    <i class="fas fa-euro-sign me-1"></i>Max: {{ number_format($opeCom->prices->first()->value, 2, ',', ' ') }} €
                                                                </span>
                                                                @endif
                                                            </div>
                                                            @if($program->creatorApplication()?->id === $application->id)
                                                            <div class="d-flex gap-2" onclick="event.stopPropagation()">
                                                                <button type="button" class="btn btn-sm btn-outline-primary" data-bs-toggle="modal" data-bs-target="#updateOpeComModal-{{ $opeCom->id }}" onclick="event.stopPropagation()" style="width: 38px; height: 38px;">
                                                                    <i class="fas fa-edit"></i>
                                                                </button>
                                                                <form method="POST" action="{{ route('partner.program.ope-coms.destroy', ['application' => $application, 'program' => $program, 'opeCom' => $opeCom]) }}" onsubmit="return confirm('Êtes-vous sûr de vouloir supprimer cette opération commerciale ?');" onclick="event.stopPropagation()">
                                                                    @csrf
                                                                    @method('DELETE')
                                                                    <button type="submit" class="btn btn-sm btn-outline-danger" style="width: 38px; height: 38px;">
                                                                        <i class="fas fa-trash"></i>
                                                                    </button>
                                                                </form>
                                                            </div>
                                                            @endif
                                                        </div>
                                                        <div class="argumentaire-content">
                                                            {!! $opeCom->text !!}
                                                        </div>

                                                        @if($opeCom->ratio && $opeCom->prices && $opeCom->prices->first())
                                                        <div class="mt-2">
                                                            <small class="text-muted">
                                                                <i class="fas fa-info-circle me-1"></i>
                                                                Réduction de <strong>{{ number_format($opeCom->ratio, 2, ',', ' ') }}%</strong> limitée à <strong>{{ number_format($opeCom->prices->first()->value, 2, ',', ' ') }} €</strong>
                                                            </small>
                                                        </div>
                                                        @endif

                                                        @php
                                                            $dateStart = $opeCom->dates->firstWhere('type', 'date_start');
                                                            $dateEnd = $opeCom->dates->firstWhere('type', 'date_end');
                                                        @endphp

                                                        <div class="mt-2 d-flex align-items-center gap-2">
                                                            <small class="text-muted">
                                                                <i class="fas fa-calendar-alt me-1"></i>
                                                                @if($dateStart && $dateEnd)
                                                                    Du <strong>{{ $dateStart->value->format('d/m/Y') }}</strong> au <strong>{{ $dateEnd->value->format('d/m/Y') }}</strong>
                                                                @elseif($dateStart)
                                                                    À partir du <strong>{{ $dateStart->value->format('d/m/Y') }}</strong>
                                                                @elseif($dateEnd)
                                                                    Jusqu'au <strong>{{ $dateEnd->value->format('d/m/Y') }}</strong>
                                                                @else
                                                                    <em>Pas de dates définies</em>
                                                                @endif
                                                            </small>
                                                        </div>
                                                    </div>
                                                    <div class="flex-shrink-0 ms-3 argumentaire-drag-handle" title="Glissez pour réorganiser" data-bs-toggle="tooltip">
                                                        <i class="fas fa-grip-vertical text-muted"></i>
                                                    </div>
                                                </div>
                                            </div>
                                            @endforeach
                                        </div>
                                    </div>
                                </div>
                                @else
                                <div class="alert alert-info">
                                    <i class="fas fa-info-circle me-2"></i>
                                    Aucune opération commerciale pour le moment. Utilisez le formulaire ci-dessus pour en ajouter une.
                                </div>
                                @endif
                            </div>
                            <!-- Fin Onglet Opérations Commerciales -->

                            <!-- Onglet Synchronisation des lots -->
                            <div class="tab-pane fade" id="sync-lots" role="tabpanel" aria-labelledby="sync-lots-tab">
                                @if($program->creatorApplication()?->id !== $application->id)
                                <div class="alert alert-warning">
                                    <i class="fas fa-lock me-2"></i>
                                    <strong>Programme partagé</strong> - Seule l'application créatrice (<strong>{{ $program->creatorApplication()?->name }}</strong>) peut synchroniser les lots.
                                </div>
                                @else
                                <div class="alert alert-info">
                                    <i class="fas fa-info-circle me-2"></i>
                                    <strong>Synchronisation des lots</strong> - Associez des fiscalités et opérations commerciales aux lots individuellement
                                </div>

                                @if($program->lots->count() > 0)
                                <div class="d-flex gap-2 mb-4">
                                    <button type="button" class="btn btn-warning" data-bs-toggle="modal" data-bs-target="#syncAllFiscalitesModal">
                                        <i class="fas fa-coins me-2"></i>Synchroniser toutes les fiscalités
                                    </button>
                                    <button type="button" class="btn btn-success" data-bs-toggle="modal" data-bs-target="#syncAllOpeComsModal">
                                        <i class="fas fa-tags me-2"></i>Synchroniser toutes les opérations commerciales
                                    </button>
                                </div>
                                <div class="accordion" id="accordionLots">
                                    @foreach($program->lots as $index => $lot)
                                    <div class="accordion-item">
                                        <h2 class="accordion-header" id="heading-lot-{{ $lot->id }}">
                                            <button class="accordion-button {{ $index === 0 ? '' : 'collapsed' }}" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-lot-{{ $lot->id }}" aria-expanded="{{ $index === 0 ? 'true' : 'false' }}" aria-controls="collapse-lot-{{ $lot->id }}">
                                                <div class="d-flex align-items-center gap-3 w-100">
                                                    <span class="badge bg-secondary">{{ $lot->number }}</span>
                                                    <span class="badge {{ $lot->current_state->bgColor() }}">
                                                        {{ $lot->current_state->label() }}
                                                    </span>
                                                    <span class="sync-fiscalite-icon-{{ $lot->id }} d-none" title="Fiscalités synchronisées" data-bs-toggle="tooltip">
                                                        <i class="fas fa-coins text-primary"></i>
                                                    </span>
                                                    <span class="sync-opecom-icon-{{ $lot->id }} d-none" title="Opérations commerciales synchronisées" data-bs-toggle="tooltip">
                                                        <i class="fas fa-tags text-success"></i>
                                                    </span>
                                                </div>
                                            </button>
                                        </h2>
                                        <div id="collapse-lot-{{ $lot->id }}" class="accordion-collapse collapse {{ $index === 0 ? 'show' : '' }}" aria-labelledby="heading-lot-{{ $lot->id }}" data-bs-parent="#accordionLots">
                                            <div class="accordion-body">
                                                <!-- Fiscalités -->
                                                <div class="mb-4">
                                                    <h6 class="text-primary mb-3">
                                                        <i class="fas fa-coins me-2"></i>Fiscalités applicables
                                                    </h6>
                                                    @if($program->fiscalites->count() > 0)
                                                    <div class="row g-2">
                                                        @php
                                                            $lotFiscalites = $lot->fiscalites->pluck('type')->map(fn($t) => $t->value)->toArray();
                                                        @endphp
                                                        @foreach($program->fiscalites as $fiscalite)
                                                            <div class="col-md-6">
                                                                <div class="form-check">
                                                                    <input class="form-check-input fiscalite-sync-checkbox"
                                                                           type="checkbox"
                                                                           value="{{ $fiscalite->type->value }}"
                                                                           id="lot_{{ $lot->id }}_fiscalite_{{ $fiscalite->type->value }}"
                                                                           data-lot-id="{{ $lot->id }}"
                                                                           data-fiscalite="{{ $fiscalite->type->value }}"
                                                                           {{ in_array($fiscalite->type->value, $lotFiscalites) ? 'checked' : '' }}>
                                                                    <label class="form-check-label" for="lot_{{ $lot->id }}_fiscalite_{{ $fiscalite->type->value }}">
                                                                        <span class="badge {{ $fiscalite->type->bgColor() }} me-1">
                                                                            <i class="fas {{ $fiscalite->type->icon() }}"></i>
                                                                        </span>
                                                                        {{ $fiscalite->type->label() }}
                                                                    </label>
                                                                </div>
                                                            </div>
                                                        @endforeach
                                                    </div>
                                                    @else
                                                    <div class="alert alert-info mb-0">
                                                        <i class="fas fa-info-circle me-2"></i>
                                                        Aucune fiscalité définie pour ce programme.
                                                    </div>
                                                    @endif
                                                </div>

                                                <!-- Opérations Commerciales -->
                                                <div>
                                                    <h6 class="text-success mb-3">
                                                        <i class="fas fa-tags me-2"></i>Opérations commerciales applicables
                                                    </h6>
                                                    <div class="row g-2">
                                                        @php
                                                            $lotOpeComTypes = $lot->opeComs->pluck('type')->map(fn($t) => $t->value)->toArray();
                                                        @endphp
                                                        @foreach($program->opeComs as $opeCom)
                                                        <div class="col-md-6">
                                                            <div class="form-check">
                                                                <input class="form-check-input opecom-sync-checkbox"
                                                                       type="checkbox"
                                                                       value="{{ $opeCom->id }}"
                                                                       id="lot_{{ $lot->id }}_opecom_{{ $opeCom->id }}"
                                                                       data-lot-id="{{ $lot->id }}"
                                                                       data-opecom-id="{{ $opeCom->id }}"
                                                                       {{ in_array($opeCom->type->value, $lotOpeComTypes) ? 'checked' : '' }}>
                                                                <label class="form-check-label" for="lot_{{ $lot->id }}_opecom_{{ $opeCom->id }}">
                                                                    <span class="badge {{ $opeCom->type->bgColor() }} me-1">
                                                                        <i class="fas {{ $opeCom->type->icon() }}"></i>
                                                                    </span>
                                                                    {{ $opeCom->type->label() }}
                                                                </label>
                                                            </div>
                                                        </div>
                                                        @endforeach
                                                        @if($program->opeComs->count() === 0)
                                                        <div class="col-12">
                                                            <div class="alert alert-info mb-0">
                                                                <i class="fas fa-info-circle me-2"></i>
                                                                Aucune opération commerciale disponible. Créez-en dans l'onglet "Opérations Commerciales".
                                                            </div>
                                                        </div>
                                                        @endif
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    @endforeach
                                </div>
                                @else
                                <div class="alert alert-warning">
                                    <i class="fas fa-exclamation-triangle me-2"></i>
                                    Aucun lot disponible pour ce programme.
                                    <a href="{{ route('partner.lots', ['application' => $application, 'program' => $program]) }}" class="alert-link">Créer un lot</a>
                                </div>
                                @endif
                                @endif
                            </div>
                            <!-- Fin Onglet Synchronisation des lots -->

                            <!-- Onglet Gestion des annexes -->
                            <div class="tab-pane fade" id="annexes" role="tabpanel" aria-labelledby="annexes-tab">
                                @include('partner.annexes.list', ['program' => $program, 'application' => $application])
                            </div>
                            <!-- Fin Onglet Gestion des annexes -->

                            <!-- Onglet Paramètres -->
                            <div class="tab-pane fade" id="parameters" role="tabpanel" aria-labelledby="parameters-tab">
                                @if($program->creatorApplication()?->id !== $application->id)
                                <div class="alert alert-warning">
                                    <i class="fas fa-lock me-2"></i>
                                    <strong>Programme partagé</strong> - Seule l'application créatrice (<strong>{{ $program->creatorApplication()?->name }}</strong>) peut gérer les paramètres.
                                </div>
                                @else
                                @if(!$program->saleParameter)
                                <!-- Pas de paramètres spécifiques au programme -->
                                <div class="alert alert-info">
                                    <div class="d-flex align-items-center">
                                        <i class="fas fa-info-circle fa-2x me-3"></i>
                                        <div class="flex-grow-1">
                                            <h5 class="alert-heading mb-2">Paramètres par défaut de l'application</h5>
                                            <p class="mb-2">Ce programme utilise actuellement les paramètres de vente par défaut de l'application <strong>{{ $application->name }}</strong>.</p>
                                            <p class="mb-0">
                                                <a href="{{ route('partner.application.sale-parameters.show', $application) }}" class="btn btn-sm btn-outline-primary">
                                                    <i class="fas fa-eye me-1"></i>Voir les paramètres de l'application
                                                </a>
                                            </p>
                                        </div>
                                    </div>
                                </div>

                                <div class="card border-primary">
                                    <div class="card-body text-center py-4">
                                        <i class="fas fa-cog fa-3x text-primary mb-3"></i>
                                        <h5 class="mb-2">Créer des paramètres spécifiques</h5>
                                        <p class="text-muted mb-3">Vous pouvez créer des paramètres de vente personnalisés pour ce programme qui remplaceront les paramètres par défaut de l'application.</p>
                                        <form method="POST" action="{{ route('partner.program.create-parameter', ['application' => $application, 'program' => $program]) }}">
                                            @csrf
                                            <button type="submit" class="btn btn-primary btn-lg">
                                                <i class="fas fa-plus me-2"></i>Créer les paramètres du programme
                                            </button>
                                        </form>
                                    </div>
                                </div>
                                @else
                                <!-- Formulaire de mise à jour -->
                                <div class="alert alert-info">
                                    <i class="fas fa-cog me-2"></i>
                                    <strong>Paramètres du programme</strong> - Configurez les options et paramètres spécifiques à ce programme
                                </div>

                                <form method="POST" action="{{ route('partner.program.update-parameter', ['application' => $application, 'program' => $program]) }}">
                                    @csrf
                                    @method('PUT')
                                    <div class="card">
                                        <div class="card-header bg-light">
                                            <h6 class="mb-0">
                                                <i class="fas fa-sliders-h me-2"></i>Configuration des options
                                            </h6>
                                        </div>
                                        <div class="card-body">
                                            <div class="row g-3">
                                                <!-- Durée de l'option -->
                                                <div class="col-md-4">
                                                    <label class="form-label fw-bold">
                                                        <i class="fas fa-calendar-day me-1 text-primary"></i>
                                                        Durée de l'option
                                                        <i class="fas fa-info-circle ms-1 text-muted"
                                                           data-bs-toggle="tooltip"
                                                           data-bs-placement="top"
                                                           title="Durée pendant laquelle une option peut être posée"></i>
                                                    </label>
                                                    <select name="option_duration_day" class="form-select" required>
                                                        @foreach(\App\Enums\OptionDuration::cases() as $duration)
                                                            <option value="{{ $duration->value }}" {{ $program->saleParameter->option_duration_day == $duration->value ? 'selected' : '' }}>
                                                                {{ $duration->label() }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>

                                                <!-- Rang de l'option -->
                                                <div class="col-md-4">
                                                    <label class="form-label fw-bold">
                                                        <i class="fas fa-sort-numeric-up me-1 text-info"></i>
                                                        Rang de l'option
                                                        <i class="fas fa-info-circle ms-1 text-muted"
                                                           data-bs-toggle="tooltip"
                                                           data-bs-placement="top"
                                                           title="Si rang 2 activé : permet de poser une seconde option qui s'activera automatiquement en cas de désistement de la première option"></i>
                                                    </label>
                                                    <select name="option_rang" class="form-select" required>
                                                        <option value="1" {{ $program->saleParameter->option_rang == 1 ? 'selected' : '' }}>Rang 1 uniquement</option>
                                                        <option value="2" {{ $program->saleParameter->option_rang == 2 ? 'selected' : '' }}>Rang 1 et 2</option>
                                                    </select>
                                                </div>

                                                <!-- Option renouvelable -->
                                                <div class="col-md-4">
                                                    <label class="form-label fw-bold">
                                                        <i class="fas fa-sync-alt me-1 text-success"></i>
                                                        Option renouvelable
                                                        <i class="fas fa-info-circle ms-1 text-muted"
                                                           data-bs-toggle="tooltip"
                                                           data-bs-placement="top"
                                                           title="Nombre de fois que l'option peut être renouvelée"></i>
                                                    </label>
                                                    <select name="option_renouvellable" class="form-select" required>
                                                        @foreach(\App\Enums\OptionRenouvellable::cases() as $option)
                                                            <option value="{{ $option->value }}" {{ $program->saleParameter->option_renouvellable == $option->value ? 'selected' : '' }}>
                                                                {{ $option->label() }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>

                                                <!-- Jours ouvrables uniquement -->
                                                <div class="col-12">
                                                    <div class="card bg-light border-0 mt-2">
                                                        <div class="card-body py-3">
                                                            <div class="form-check form-switch">
                                                                <input type="hidden" name="option_jour_ouvrable" value="0">
                                                                <input class="form-check-input" type="checkbox" role="switch" id="option_jour_ouvrable" name="option_jour_ouvrable" value="1" {{ $program->saleParameter->option_jour_ouvrable ? 'checked' : '' }}>
                                                                <label class="form-check-label fw-bold" for="option_jour_ouvrable">
                                                                    <i class="fas fa-business-time me-1 text-warning"></i>
                                                                    Jours ouvrables uniquement
                                                                    <i class="fas fa-info-circle ms-2 text-muted"
                                                                       data-bs-toggle="tooltip"
                                                                       data-bs-placement="top"
                                                                       title="Calculer la durée de l'option sur les jours ouvrables seulement (exclut samedis, dimanches et jours fériés)"></i>
                                                                </label>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- Acceptation automatique des options -->
                                                <div class="col-12">
                                                    <div class="card bg-light border-0 mt-2">
                                                        <div class="card-body py-3">
                                                            <div class="form-check form-switch">
                                                                <input type="hidden" name="auto_accept_option" value="0">
                                                                <input class="form-check-input" type="checkbox" role="switch" id="auto_accept_option" name="auto_accept_option" value="1" {{ $program->saleParameter->auto_accept_option ?? false ? 'checked' : '' }}>
                                                                <label class="form-check-label fw-bold" for="auto_accept_option">
                                                                    <i class="fas fa-check-circle me-1 text-success"></i>
                                                                    Acceptation automatique des poses d'option
                                                                    <i class="fas fa-info-circle ms-2 text-muted"
                                                                       data-bs-toggle="tooltip"
                                                                       data-bs-placement="top"
                                                                       title="Si activé, les options posées seront automatiquement acceptées sans validation manuelle. Ce paramètre surcharge celui de l'application."></i>
                                                                </label>
                                                                <div class="form-text mt-1">
                                                                    <small>Si activé, les options posées par les clients seront automatiquement acceptées. Sinon, elles nécessiteront une validation manuelle. Ce paramètre surcharge celui de l'application.</small>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="d-flex justify-content-between align-items-center mt-4">
                                                <button type="button" class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#deleteSaleParameterModal">
                                                    <i class="fas fa-trash me-2"></i>Supprimer les paramètres
                                                </button>
                                                <button type="submit" class="btn btn-primary">
                                                    <i class="fas fa-save me-2"></i>Enregistrer les modifications
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </form>
                                @endif
                                @endif
                            </div>
                            <!-- Fin Onglet Paramètres -->
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Images Section -->
        @if($program->getMedia('images')->count() > 0)
        <div class="row mt-4">
            <div class="col-12">
                <div class="card shadow-sm">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-images me-2"></i>Images du programme
                        </h5>
                        <small class="text-muted">Glissez-déposez pour réorganiser</small>
                    </div>
                    <div class="card-body">
                        <x-sortable-images
                            :images="$program->getMedia('images')"
                            containerId="sortable-images"
                            :canDelete="false"
                        />
                    </div>
                </div>
            </div>
        </div>
        @endif

        <!-- Documents Section -->
        @if($program->documents->count() > 0)
        <div class="row mt-4">
            <div class="col-12">
                <div class="card shadow-sm">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">
                            <i class="fas fa-file-pdf me-2"></i>Documents PDF
                        </h5>
                        <small class="text-muted">Glissez-déposez pour réorganiser</small>
                    </div>
                    <div class="card-body">
                        <x-sortable-documents
                            :documents="$program->documents"
                            containerId="sortable-documents"
                            :showDownload="true"
                            :canDelete="false"
                        />
                    </div>
                </div>
            </div>
        </div>
        @endif
    </div>

    <!-- Modals de modification des opérations commerciales - en dehors de tout conteneur -->
    @foreach($program->opeComs->sortBy('order') as $opeCom)
    @include('modals.update-ope-com', ['opeCom' => $opeCom, 'application' => $application, 'program' => $program])
    @endforeach

    <!-- Modals de synchronisation globale -->
    @include('modals.sync-all-fiscalites', ['application' => $application, 'program' => $program])
    @include('modals.sync-all-opecoms', ['application' => $application, 'program' => $program])

    <!-- Modals de gestion des annexes -->
    @include('modals.detach-annexe', ['application' => $application, 'program' => $program])
    @include('modals.attach-annexe', ['application' => $application, 'program' => $program])
    @include('modals.cannot-detach-annexe')

    <!-- Modal de suppression des paramètres de vente -->
    @include('modals.delete-sale-parameter', ['application' => $application, 'program' => $program])

    <script>
        // Fonction pour activer un onglet
        function activateTab(tabName) {
            const tab = document.querySelector('#' + tabName + '-tab');
            const pane = document.querySelector('#' + tabName);

            if (tab && pane) {
                // Désactiver tous les onglets
                document.querySelectorAll('.nav-link').forEach(t => {
                    t.classList.remove('active');
                });
                document.querySelectorAll('.tab-pane').forEach(p => {
                    p.classList.remove('show', 'active');
                });

                // Activer l'onglet demandé
                tab.classList.add('active');
                pane.classList.add('show', 'active');
            }
        }

        document.addEventListener('DOMContentLoaded', function() {
            // Initialiser tous les tooltips Bootstrap
            const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
            const tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
                return new bootstrap.Tooltip(tooltipTriggerEl);
            });

            // Activer l'onglet spécifié dans la session
            @if(session('activeTab'))
            activateTab('{{ session('activeTab') }}');
            @endif

            // Initialiser Quill pour l'éditeur d'argumentaires
            initQuillEditor('#argumentaire-editor-container', 'argumentaire-text-hidden', {
                placeholder: 'Saisissez le contenu de l\'argumentaire...'
            });

            // Initialiser Quill pour l'éditeur d'opérations commerciales
            initQuillEditor('#opecom-editor-container', 'opecom-text-hidden', {
                placeholder: 'Saisissez le contenu de l\'opération commerciale...'
            });

            // Initialiser Quill pour chaque modal lors de son ouverture
            @foreach($program->opeComs as $opeCom)
            const modal{{ $opeCom->id }} = document.getElementById('updateOpeComModal-{{ $opeCom->id }}');
            if (modal{{ $opeCom->id }}) {
                let quillInstance{{ $opeCom->id }} = null;

                modal{{ $opeCom->id }}.addEventListener('shown.bs.modal', function () {
                    // Initialiser Quill seulement si pas déjà initialisé
                    if (!quillInstance{{ $opeCom->id }}) {
                        const container{{ $opeCom->id }} = document.querySelector('#opecom-editor-update-{{ $opeCom->id }}');
                        const hiddenInput{{ $opeCom->id }} = document.getElementById('opecom-text-hidden-update-{{ $opeCom->id }}');

                        // Créer une instance Quill
                        quillInstance{{ $opeCom->id }} = new Quill('#opecom-editor-update-{{ $opeCom->id }}', {
                            theme: 'snow',
                            placeholder: 'Saisissez le contenu de l\'opération commerciale...',
                            modules: {
                                toolbar: [
                                    ['bold', 'italic', 'underline'],
                                    [{ 'list': 'ordered'}, { 'list': 'bullet' }],
                                    ['link'],
                                    ['clean']
                                ]
                            }
                        });

                        // Charger le contenu existant
                        if (hiddenInput{{ $opeCom->id }}.value) {
                            quillInstance{{ $opeCom->id }}.root.innerHTML = hiddenInput{{ $opeCom->id }}.value;
                        }

                        // Synchroniser avec l'input caché lors de la soumission
                        const form{{ $opeCom->id }} = container{{ $opeCom->id }}.closest('form');
                        if (form{{ $opeCom->id }}) {
                            form{{ $opeCom->id }}.addEventListener('submit', function(e) {
                                const content = quillInstance{{ $opeCom->id }}.root.innerHTML;
                                const textContent = quillInstance{{ $opeCom->id }}.getText().trim();

                                if (textContent.length === 0) {
                                    e.preventDefault();
                                    alert('Veuillez saisir un contenu');
                                    return false;
                                }

                                hiddenInput{{ $opeCom->id }}.value = content;
                            });
                        }
                    }
                });

                // Gérer le message d'info pour cette modal
                const ratioInputUpdate{{ $opeCom->id }} = document.querySelector('[data-modal-id="{{ $opeCom->id }}"].opecom-ratio-update');
                const priceInputUpdate{{ $opeCom->id }} = document.querySelector('[data-modal-id="{{ $opeCom->id }}"].opecom-price-update');
                const infoMessageUpdate{{ $opeCom->id }} = document.getElementById('opecom-info-message-update-{{ $opeCom->id }}');

                function checkOpeComFieldsUpdate{{ $opeCom->id }}() {
                    if (ratioInputUpdate{{ $opeCom->id }} && priceInputUpdate{{ $opeCom->id }} && infoMessageUpdate{{ $opeCom->id }}) {
                        const hasRatio = ratioInputUpdate{{ $opeCom->id }}.value && parseFloat(ratioInputUpdate{{ $opeCom->id }}.value) > 0;
                        const hasPrice = priceInputUpdate{{ $opeCom->id }}.value && parseFloat(priceInputUpdate{{ $opeCom->id }}.value) > 0;

                        if (hasRatio && hasPrice) {
                            infoMessageUpdate{{ $opeCom->id }}.classList.remove('d-none');
                        } else {
                            infoMessageUpdate{{ $opeCom->id }}.classList.add('d-none');
                        }
                    }
                }

                if (ratioInputUpdate{{ $opeCom->id }}) ratioInputUpdate{{ $opeCom->id }}.addEventListener('input', checkOpeComFieldsUpdate{{ $opeCom->id }});
                if (priceInputUpdate{{ $opeCom->id }}) priceInputUpdate{{ $opeCom->id }}.addEventListener('input', checkOpeComFieldsUpdate{{ $opeCom->id }});
            }
            @endforeach

            // Gérer l'affichage du message d'info pour ratio + prix limite (formulaire de création)
            const ratioInput = document.getElementById('opecom-ratio');
            const priceInput = document.getElementById('opecom-price');
            const infoMessage = document.getElementById('opecom-info-message');

            function checkOpeComFields() {
                if (ratioInput && priceInput && infoMessage) {
                    const hasRatio = ratioInput.value && parseFloat(ratioInput.value) > 0;
                    const hasPrice = priceInput.value && parseFloat(priceInput.value) > 0;

                    if (hasRatio && hasPrice) {
                        infoMessage.classList.remove('d-none');
                    } else {
                        infoMessage.classList.add('d-none');
                    }
                }
            }

            if (ratioInput) ratioInput.addEventListener('input', checkOpeComFields);
            if (priceInput) priceInput.addEventListener('input', checkOpeComFields);

            // Initialiser Sortable pour les images
            initSortable('#sortable-images', {
                itemSelector: '.sortable-item',
                orderBadgeSelector: '.image-order-badge .badge',
                url: '{{ route('partner.program.reorder-images', ['application' => $application, 'program' => $program]) }}',
                csrfToken: '{{ csrf_token() }}',
                errorMessage: 'Erreur lors de la mise à jour de l\'ordre des images'
            });

            // Initialiser Sortable pour les documents
            initSortable('#sortable-documents', {
                itemSelector: '.sortable-document-item',
                orderBadgeSelector: '.document-order-badge .badge',
                url: '{{ route('partner.program.reorder-documents', ['application' => $application, 'program' => $program]) }}',
                csrfToken: '{{ csrf_token() }}',
                errorMessage: 'Erreur lors de la mise à jour de l\'ordre des documents'
            });

            // Initialiser Sortable pour les argumentaires
            initSortable('#sortable-argumentaires', {
                itemSelector: '.sortable-argumentaire-item',
                orderBadgeSelector: '.badge.bg-secondary',
                orderBadgeTemplate: (order) => `<i class="fas fa-sort me-1"></i>Ordre: ${order}`,
                url: '{{ route('partner.program.reorder-argumentaires', ['application' => $application, 'program' => $program]) }}',
                csrfToken: '{{ csrf_token() }}',
                errorMessage: 'Erreur lors de la mise à jour de l\'ordre des argumentaires'
            });

            // Initialiser Sortable pour les opérations commerciales
            initSortable('#sortable-ope-coms', {
                itemSelector: '.sortable-opecom-item',
                orderBadgeSelector: '.badge.bg-secondary',
                orderBadgeTemplate: (order) => `<i class="fas fa-sort me-1"></i>Ordre: ${order}`,
                handle: '.argumentaire-drag-handle',
                url: '{{ route('partner.program.reorder-ope-coms', ['application' => $application, 'program' => $program]) }}',
                csrfToken: '{{ csrf_token() }}',
                errorMessage: 'Erreur lors de la mise à jour de l\'ordre des opérations commerciales'
            });

            // Fonction pour vérifier le statut de synchronisation des fiscalités d'un lot
            function checkLotFiscalitesSyncStatus(lotId) {
                // Sélectionner toutes les checkboxes de fiscalités du lot
                const fiscaliteCheckboxes = document.querySelectorAll('.fiscalite-sync-checkbox[data-lot-id="' + lotId + '"]');
                const syncIcon = document.querySelector('.sync-fiscalite-icon-' + lotId);

                if (!syncIcon) return;

                // Si aucune checkbox, masquer l'icône
                if (fiscaliteCheckboxes.length === 0) {
                    syncIcon.classList.add('d-none');
                    return;
                }

                // Vérifier si toutes les checkboxes de fiscalités sont cochées
                let allChecked = true;
                fiscaliteCheckboxes.forEach(checkbox => {
                    if (!checkbox.checked) {
                        allChecked = false;
                    }
                });

                // Afficher ou masquer l'icône selon le résultat
                if (allChecked) {
                    syncIcon.classList.remove('d-none');
                } else {
                    syncIcon.classList.add('d-none');
                }
            }

            // Fonction pour vérifier le statut de synchronisation des opérations commerciales d'un lot
            function checkLotOpeComsSyncStatus(lotId) {
                // Sélectionner toutes les checkboxes d'opérations commerciales du lot
                const opecomCheckboxes = document.querySelectorAll('.opecom-sync-checkbox[data-lot-id="' + lotId + '"]');
                const syncIcon = document.querySelector('.sync-opecom-icon-' + lotId);

                if (!syncIcon) return;

                // Si aucune checkbox, masquer l'icône
                if (opecomCheckboxes.length === 0) {
                    syncIcon.classList.add('d-none');
                    return;
                }

                // Vérifier si toutes les checkboxes d'opérations commerciales sont cochées
                let allChecked = true;
                opecomCheckboxes.forEach(checkbox => {
                    if (!checkbox.checked) {
                        allChecked = false;
                    }
                });

                // Afficher ou masquer l'icône selon le résultat
                if (allChecked) {
                    syncIcon.classList.remove('d-none');
                } else {
                    syncIcon.classList.add('d-none');
                }
            }

            // Vérifier le statut de tous les lots au chargement de la page
            @foreach($program->lots as $lot)
            checkLotFiscalitesSyncStatus({{ $lot->id }});
            checkLotOpeComsSyncStatus({{ $lot->id }});
            @endforeach

            // Gérer la synchronisation des fiscalités aux lots
            document.querySelectorAll('.fiscalite-sync-checkbox').forEach(checkbox => {
                checkbox.addEventListener('change', function() {
                    const lotId = this.dataset.lotId;
                    const fiscalite = this.dataset.fiscalite;
                    const checked = this.checked;

                    fetch('{{ url('/') }}/partner/{{ $application->id }}/programs/{{ $program->id }}/lots/' + lotId + '/sync-fiscalite', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        body: JSON.stringify({
                            fiscalite: fiscalite,
                            checked: checked
                        })
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success) {
                            console.log('Fiscalité synchronisée');
                            checkLotFiscalitesSyncStatus(lotId);
                        }
                    })
                    .catch(error => {
                        console.error('Erreur:', error);
                        // Annuler le changement en cas d'erreur
                        this.checked = !checked;
                        alert('Erreur lors de la synchronisation de la fiscalité');
                    });
                });
            });

            // Gérer la synchronisation des opérations commerciales aux lots
            document.querySelectorAll('.opecom-sync-checkbox').forEach(checkbox => {
                checkbox.addEventListener('change', function() {
                    const lotId = this.dataset.lotId;
                    const opecomId = this.dataset.opecomId;
                    const checked = this.checked;

                    fetch('{{ url('/') }}/partner/{{ $application->id }}/programs/{{ $program->id }}/lots/' + lotId + '/sync-opecom', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/json',
                            'X-CSRF-TOKEN': '{{ csrf_token() }}'
                        },
                        body: JSON.stringify({
                            opecom_id: opecomId,
                            checked: checked
                        })
                    })
                    .then(response => response.json())
                    .then(data => {
                        if (data.success) {
                            console.log('Opération commerciale synchronisée');
                            checkLotOpeComsSyncStatus(lotId);
                        }
                    })
                    .catch(error => {
                        console.error('Erreur:', error);
                        // Annuler le changement en cas d'erreur
                        this.checked = !checked;
                        alert('Erreur lors de la synchronisation de l\'opération commerciale');
                    });
                });
            });
        });

    </script>
@endsection