@extends('layouts.master')

@section('title')
    Consolidation budgetaire - {{ $besoinbudgetaire->code_budget }}
@endsection

@section('content')
<style>
    table input{
    min-width:150px;
    }

    table select{
    min-width:300px;
    }

    table th,
    table td{
        text-align: center;
        vertical-align: middle;
        white-space: nowrap;
    }
        
    .input-nature {
        min-width: 300px;
    }

    .input-natureresource {
        min-width: 300px;
    }

    .input-small {
        min-width: 90px;
    }
</style>

<style>
    .table-budget th,
    .table-budget td{
        padding:8px;
        text-align:center;
    }

    .table-budget input{
        min-width:130px;
    }

    .col-montant{
        min-width:190px;
    }

    .col-mois{
        min-width:100px;
    }
</style>

<style>
    .bg-light {
        background-color: #f1f3f6 !important;
        cursor: not-allowed;
    }
</style>

<style>
    .form-wizard {
        min-height: 650px;
        position: relative;
    }

    /* BASE */
    .step {
        display: none;
        opacity: 0;
        transform: translateX(50px);
        transition: all 0.4s ease;
    }

    /* ACTIVE */
    .step.active {
        display: block;
        opacity: 1;
        transform: translateX(0);
    }

    /* SORTIE GAUCHE */
    .step.exit-left {
        opacity: 0;
        transform: translateX(-50px);
    }

    /* SORTIE DROITE */
    .step.exit-right {
        opacity: 0;
        transform: translateX(50px);
    }

    /* Boutons bien visibles */
    .step .btn {
        margin-top: 15px;
    }
</style>

<div class="container-fluid">

    <div class="card shadow-sm mb-4 border-0">
        <div class="card-body d-flex justify-content-between align-items-center flex-wrap">
     
            <!-- Espace gauche (vide pour équilibrer) -->
            <div></div>

            <!-- Titre centré -->
            <div class="text-center flex-grow-1">
                <h4 class="fw-bold text-uppercase mb-1" style="letter-spacing:1px;">
                    CONSOLIDATION BUDGETAIRE
                </h4>
            </div>

            <!-- Bouton à droite -->
            <div>
                <a href="{{ route('user.besoinbudgetaires.indexbesoins') }}" class="btn btn-secondary btn-sm">
                    <i class="fas fa-arrow-left"></i> Retour
                </a>
            </div>
        

        </div>
    </div>


     <!-- ===================== FORMULAIRE CREATE ===================== -->
    <div class="collapse show" id="collapseBesoin">
        <div class="card shadow mb-4">
            <div class="card-body">

               <form method="POST" action="{{ route('user.besoinbudgetaires.updateFromBesoin', $besoinbudgetaire->id) }}">
                    @csrf
                    @method('PUT')

                      @php
                    $anneeEnCours = $besoinbudgetaire->exercice;
                    @endphp


                       <div class="form-wizard">
                        <!-- ETAPE 1 -->
                            <div class="step active" id="step1">
                                <div class="step-content">

                                <!-- ================= EXERCICE ================= -->
                                <div class="text-center mb-3">

                                    <label class="text-muted small mb-1 d-block">
                                        Exercice
                                    </label>

                                    <div class="bg-primary text-white rounded-pill px-5 py-3 d-inline-flex align-items-center shadow-sm"
                                        style="font-size: 1.1rem; min-width: 180px; justify-content: center;">

                                        <i class="fas fa-edit mr-2"></i>
                                        <strong>{{ $anneeEnCours }}</strong>
                                    </div>

                                    <input type="hidden" name="exercice" value="{{ $anneeEnCours }}">
                                </div>

                                <!-- ================= TITRE ================= -->
                                <h5 class="text-warning mb-3 text-center">
                                    Informations budgétaires
                                </h5>

                                <!-- Direction / Centre / Entité -->
                                <div class="row mt-3">

                                    <div class="col-md-4">
                                        <label>Direction</label>
                                        <input type="text" class="form-control bg-light mb-1"
                                            value="{{ $besoinbudgetaire->direction->code ?? '' }} - {{ $besoinbudgetaire->direction->libelle ?? '' }}"
                                            readonly>

                                        <input type="hidden" name="direction_id"
                                            value="{{ $besoinbudgetaire->direction_id }}">
                                    </div>

                                    <div class="col-md-4">
                                        <label>Centre de responsabilité</label>
                                        <input type="text" class="form-control bg-light mb-1"
                                            value="{{ $besoinbudgetaire->centrerespo->code ?? '' }} - {{ $besoinbudgetaire->centrerespo->libelle_long ?? '' }}"
                                            readonly>

                                        <input type="hidden" name="centrerespo_id"
                                            value="{{ $besoinbudgetaire->centrerespo_id }}">
                                    </div>

                                    <div class="col-md-4">
                                        <label>Entité</label>
                                        <input type="text" class="form-control bg-light"
                                            value="{{ $besoinbudgetaire->entite->libelle ?? '' }}"
                                            readonly>

                                        <input type="hidden" name="entite_id"
                                            value="{{ $besoinbudgetaire->entite_id }}">
                                    </div>

                                </div>

                                <!-- Type contrat -->
<div class="row mt-3">

    <!-- TOUJOURS VISIBLE -->
    <div class="col-md-3">
        <label>Type de contrat</label>
        <select id="typeContrat" name="type_contrat" class="form-control bg-light" disabled>
            <option value="permanent" {{ $besoinbudgetaire->type_contrat == 'permanent' ? 'selected' : '' }}>Permanent</option>
            <option value="accessoire" {{ $besoinbudgetaire->type_contrat == 'accessoire' ? 'selected' : '' }}>Accessoire</option>
            <option value="signe" {{ $besoinbudgetaire->type_contrat == 'signe' ? 'selected' : '' }}>Signé</option>
        </select>

        <input type="hidden" name="type_contrat" value="{{ $besoinbudgetaire->type_contrat }}">
    </div>

    <!-- A CONTROLER PAR JS -->
    <div class="col-md-3" id="blocContratSelect">
        <label>Contrat</label>
        <select id="contratSelect" class="form-control bg-light" disabled>
            @foreach($contrats as $contrat)
                <option {{ $besoinbudgetaire->contrat_id == $contrat->id ? 'selected' : '' }}>
                    {{ $contrat->code }} - {{ $contrat->libelle }}
                </option>
            @endforeach
        </select>

        <input type="hidden" name="contrat_id" value="{{ $besoinbudgetaire->contrat_id }}">
    </div>

    <!-- ACCESSOIRE / SIGNÉ -->
    <div class="col-md-3 d-none" id="blocNomContrat">
        <label>Nom contrat (saisie/modification)</label>
        <input type="text"
            id="inputNomContrat"
            name="nom_budget"
            class="form-control"
            value="{{ $besoinbudgetaire->nom_budget }}">
    </div>

    <!-- SIGNÉ UNIQUEMENT -->
    <div class="col-md-3 d-none" id="blocImmatriculation">
        <label>Immatriculation</label>

        <input type="text"
            id="immatriculationVisible"
            class="form-control bg-light"
            value="{{ $besoinbudgetaire->immatriculation }}"
            readonly>

        <input type="hidden" name="immatriculation" value="{{ $besoinbudgetaire->immatriculation }}">

        <small class="text-muted d-block mt-1">
            • CN/001/2026/DG (Contrat National)
        </small>
    </div>

</div>

                                <!-- CODE BUDGET -->
                                <div class="row mt-3">

                                    <div class="col-md-6">
                                        <label>Code budget</label>
                                        <input type="text" id="codeBudget"
                                            class="form-control bg-light"
                                            value="{{ $besoinbudgetaire->code_budget }}" readonly>

                                        <input type="hidden" name="code_budget"
                                            id="codeBudgetHidden"
                                            value="{{ $besoinbudgetaire->code_budget }}">
                                    </div>

                                    <div class="col-md-6">
                                        <label>Nom budget</label>
                                        <input type="text" id="nomBudget"
                                            class="form-control bg-light"
                                            value="{{ $besoinbudgetaire->nom_budget }}" readonly>

                                        <input type="hidden" name="nom_budget"
                                            id="nomBudgetHidden"
                                            value="{{ $besoinbudgetaire->nom_budget }}">
                                    </div>

                                </div>

                                <!-- ================= RESPONSABLE ================= -->
    <div class="row mt-3">
        
        <div class="col-md-12">
            <label for="responsable" class="form-label fw-semibold">
                Responsable
            </label>

            <input type="text"
                id="responsable"
                class="form-control bg-light"
                value="{{ $besoinbudgetaire->responsable }}"
                readonly>

            <input type="hidden"
                name="responsable"
                value="{{ $besoinbudgetaire->responsable }}">
        </div>

    </div>

                                <!-- Objet -->
                                <div class="row mt-3">
                                    <div class="col-md-12">
                                        <label>Objet du contrat</label>
                                        <textarea class="form-control bg-light" rows="3" readonly>{{ trim($besoinbudgetaire->objet) }}</textarea>
                                        <input type="hidden" name="objet" value="{{ $besoinbudgetaire->objet }}">
                                    </div>
                                </div>

                            </div>

                            <div class="step-footer text-end">
                                <button type="button" class="btn btn-primary next">Suivant</button>
                            </div>
                        </div>

                        <!-- ================== STEP 2 : Budget Ressources ================== -->
                        <div class="step" id="step2">
                            <h5 class="text-success mb-3">Budget Ressources</h5>

                        <div id="budgetContainer">
                                @foreach($besoinbudgetaire->budgetressources as $i => $r)
                                <div class="budget-line border p-2 mb-3">
                                    <div class="row mb-2">
                                        <div class="col-md-4">
                                            <label>Poste de gestion</label>
                                            <select name="ressources[{{ $i }}][postegestion_id]" 
                                                    class="form-control input-natureresource">
                                                <option value="">--Sélectionner--</option>
                                                @foreach($postegestions as $poste)
                                                    @if((int)$poste->code >= 11 && (int)$poste->code <= 16) 
                                                        <option value="{{ $poste->id }}"
                                                            {{ (int)$r->postegestion_id === (int)$poste->id ? 'selected' : '' }}>
                                                            {{ $poste->code }} - {{ $poste->libelle }}
                                                        </option>
                                                    @endif
                                                @endforeach
                                            </select>
                                        </div>
                                        <div class="col-md-4">
                                            <label>Compte Syscohada</label>
                                            <select name="ressources[{{ $i }}][comptesyscohada_id]" 
                                                    class="form-control input-natureresource">
                                                <option value="">--Sélectionner--</option>
                                                @foreach($comptesyscohadas as $compte)
                                                    @if((int)$compte->code >= 706100 && (int)$compte->code <= 799000)
                                                       <option value="{{ $compte->id }}"
                                                            {{ (int)$r->comptesyscohada_id === (int)$compte->id ? 'selected' : '' }}>
                                                            {{ $compte->code }} - {{ $compte->libelle }}
                                                        </option>
                                                    @endif
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>
                                    <div class="row mb-2">
                                        <div class="col-md-4">
                                            <label>Libellé</label>
                                            <input type="text" name="ressources[{{ $i }}][libelle]" class="form-control input-nature" value="{{ $r->libelle }}">
                                        </div>
                                        <div class="col-md-4">
                                            <label>Montant Total</label>
                                            <input type="number" name="ressources[{{ $i }}][montant_total]" class="form-control" value="{{ $r->montant_total }}">
                                        </div>
                                        <div class="col-md-4">
                                            <label>Montant Inscrit</label>
                                            <input type="number" name="ressources[{{ $i }}][montant_inscrit]" class="form-control" value="{{ $r->montant_inscrit }}">
                                        </div>
                                    </div>

                                    @php 
                                    $mois1 = ['janvier','fevrier','mars','avril','mai','juin'];
                                    $mois2 = ['juillet','aout','septembre','octobre','novembre','decembre'];
                                    @endphp

                                    <!-- JANVIER → JUIN -->
                                    <div class="row mb-2">
                                        @foreach($mois1 as $m)
                                        <div class="col">
                                            <label>{{ ucfirst($m) }}</label>
                                            <input type="number" name="ressources[{{ $i }}][{{ $m }}]" class="form-control" value="{{ $r->$m ?? 0 }}">
                                        </div>
                                        @endforeach
                                    </div>

                                    <!-- JUILLET → DECEMBRE -->
                                    <div class="row mb-2">
                                        @foreach($mois2 as $m)
                                        <div class="col">
                                            <label>{{ ucfirst($m) }}</label>
                                            <input type="number" name="ressources[{{ $i }}][{{ $m }}]" class="form-control" value="{{ $r->$m ?? 0 }}">
                                        </div>
                                        @endforeach
                                    </div>

                                   
                                </div>
                                @endforeach
                            </div>

                          

                            <div class="step-footer d-flex justify-content-between">
                                <button type="button" class="btn btn-secondary prev">Précédent</button>
                                <button type="button" class="btn btn-primary next">Suivant</button>
                            </div>
                        </div>

                        <!-- ================== STEP 3 : Budget Emplois ================== -->
                        <div class="step" id="step3">
                            <h5 class="text-warning mb-3">Budget Emplois</h5>

                            <div id="blocBudgetEmplois">
                                @foreach($besoinbudgetaire->budgetdepenses->groupBy('activite') as $blocIndex => $depenses)
                                @php
                                    $firstDepense = $depenses->first();
                                @endphp
                            <div class="card mb-4 p-3 bloc-emploi" data-index="{{ $blocIndex }}">
                                    <!-- En-tête bloc -->
                                    <div class="d-flex justify-content-between mb-2">
                                        <h6 class="text-danger">Bloc Budget Emplois</h6>
                                       
                                    </div>

                                    <div class="row">
                                        <div class="col-md-6">
                                            <label>Direction d'exécution</label>

                                            <!-- ✅ Affichage -->
                                            <input type="text" class="form-control bg-light mb-1"
                                                value="{{ $firstDepense->direction->code ?? '' }} - {{ $firstDepense->direction->libelle ?? '' }}"
                                                readonly>

                                            <!-- ✅ Valeur envoyée -->
                                            <input type="hidden"
                                                name="emplois[{{ $blocIndex }}][direction_id]"
                                                value="{{ $firstDepense->direction_id }}">
                                        </div>
                                        <div class="col-md-6">
                                            <label>Centre de responsabilité d'exécution</label>
                                            <select name="emplois[{{ $blocIndex }}][centrerespo_id]" class="form-control bg-light" disabled>
                                                <option value="">-- Sélectionner --</option>
                                                @foreach($centrerespos as $centrerespo)
                                                    <option value="{{ $centrerespo->id }}" @if($firstDepense->centrerespo_id == $centrerespo->id) selected @endif>
                                                        {{ $centrerespo->code }} - {{ $centrerespo->libelle_long }}
                                                    </option>
                                                @endforeach
                                            </select>
                                             <input type="hidden" name="emplois[{{ $blocIndex }}][centrerespo_id]" value="{{ $firstDepense->centrerespo_id }}">
                                        </div>
                                    </div>

                                    <div class="row mt-3">
                                        <div class="col-md-12">
                                            <label>Activité</label>
                                            <input type="text" name="emplois[{{ $blocIndex }}][activite]" class="form-control bg-light" readonly value="{{ $firstDepense->activite }}">
                                        </div>

                                        <div class="col-md-12">
                                            <label>Domaine activité</label>
                                            <select name="emplois[{{ $blocIndex }}][domaineact_id]" class="form-control bg-light" disabled>
                                                <option value="">-- Sélectionner --</option>
                                                @foreach($domaineacts as $domaineact)
                                                    <option value="{{ $domaineact->id }}" @if($firstDepense->domaineact_id == $domaineact->id) selected @endif>
                                                        {{ $domaineact->code }} - {{ $domaineact->libelle }}
                                                    </option>
                                                @endforeach
                                            </select>
                                            <input type="hidden" name="emplois[{{ $blocIndex }}][domaineact_id]" value="{{ $firstDepense->domaineact_id }}">
                                        </div>
                                         <div class="col-md-12">
                                        <label>Rubrique 5</label>
                                            <select n ame="emplois[{{ $blocIndex }}][rubrique5_id]" class="form-control">
                                                <option value="">--Sélectionner--</option>
                                                @foreach($rubrique5s as $rubrique5)
                                                    <option value="{{ $rubrique5->id }}"
                                                        {{ (int)$rubrique5->id === (int)$firstDepense->rubrique5_id ? 'selected' : '' }}>
                                                        {{ $rubrique5->libelle }}
                                                    </option>
                                                @endforeach
                                            </select>
                                    </div>
                                    </div>

                                    <div class="row mt-3">
                                        <div class="col-md-12">
                                            <label>Axe PSD</label>
                                            <select name="emplois[{{ $blocIndex }}][axe_id]" class="form-control bg-light" disabled>
                                                <option value="">-- Sélectionner --</option>
                                                @foreach($axes as $axe)
                                                    <option value="{{ $axe->id }}" @if($firstDepense->axe_id == $axe->id) selected @endif>
                                                        {{ $axe->code }} - {{ $axe->libelle }}
                                                    </option>
                                                @endforeach
                                            </select>
                                            <input type="hidden" name="emplois[{{ $blocIndex }}][axe_id]" value="{{ $firstDepense->axe_id }}">
                                        </div>

                                                        <div class="col-md-12">

                                            <label>Domaine PSD</label>
                                            <select name="emplois[{{ $blocIndex }}][domainepsd_id]" class="form-control bg-light" disabled>
                                                <option value="">-- Sélectionner --</option>
                                                @foreach($domainepsds as $domainepsd)
                                                    <option value="{{ $domainepsd->id }}" @if($firstDepense->domainepsd_id == $domainepsd->id) selected @endif>
                                                        {{ $domainepsd->code }} - {{ $domainepsd->libelle }}
                                                    </option>
                                                @endforeach
                                            </select>
                                            <input type="hidden" name="emplois[{{ $blocIndex }}][domainepsd_id]" value="{{ $firstDepense->domainepsd_id }}">
                                        </div>

                                                        <div class="col-md-12">

                                            <label>Programme PSD</label>
                                            <select name="emplois[{{ $blocIndex }}][programme_id]" class="form-control bg-light" disabled>
                                                <option value="">-- Sélectionner --</option>
                                                @foreach($programmes as $programme)
                                                    <option value="{{ $programme->id }}" @if($firstDepense->programme_id == $programme->id) selected @endif>
                                                        {{ $programme->code }} - {{ $programme->libelle }}
                                                    </option>
                                                @endforeach
                                            </select>
                                            <input type="hidden" name="emplois[{{ $blocIndex }}][programme_id]" value="{{ $firstDepense->programme_id }}">
                                        </div>
                                    </div>

                                    <hr>

                                    <div class="table-responsive">
                                        <table class="table table-bordered table-sm table-depenses">
                                            <thead>
                                                <tr>
                                                    <th>Poste de gestion</th>
                                                    <th>Compte syscohada</th>
        
                                                    <th>Nature dépenses</th><th>Nbre</th><th>Quantité</th><th>C.U</th><th>Montant</th>
                                                    @php $mois = ['janvier','fevrier','mars','avril','mai','juin','juillet','aout','septembre','octobre','novembre','decembre']; @endphp
                                                    @foreach($mois as $m)<th>{{ ucfirst($m) }}</th>@endforeach
                                                   
                                                </tr>
                                            </thead>
                                            <tbody class="depense-body">
                                                @foreach($depenses as $ligneIndex => $d)
                                                    <tr>
                                                        <td>
                                            <select name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][postegestion_id]" class="form-control">
                                                <option value="">--Sélectionner--</option>
                                                @foreach($postegestions as $poste)
                                                    @if((int)$poste->code >= 1 && (int)$poste->code <= 9)
                                                        <option value="{{ $poste->id }}"
                                                            {{ (int)$d->postegestion_id === (int)$poste->id ? 'selected' : '' }}>
                                                            {{ $poste->code }} - {{ $poste->libelle }}
                                                        </option>
                                                    @endif
                                                @endforeach
                                            </select>
                                        </td>
                                        <td>
                                           <select name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][comptesyscohada_id]" class="form-control">
                                                <option value="">--Sélectionner--</option>
                                                @foreach($comptesyscohadas as $compte)
                                                    @if((int)$compte->code >= 201800 && (int)$compte->code <= 691100)
                                                        <option value="{{ $compte->id }}"
                                                            {{ (int)$d->comptesyscohada_id === (int)$compte->id ? 'selected' : '' }}>
                                                            {{ $compte->code }} - {{ $compte->libelle }}
                                                        </option>
                                                    @endif
                                                @endforeach
                                            </select>
                                        </td>
                                                        <td><input type="text" name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][nature]" class="form-control input-nature" value="{{ $d->nature }}"></td>
                                                        <td><input type="number" name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][nbre]" class="form-control input-small" value="{{ $d->nbre }}"></td>
                                                        <td><input type="number" name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][qte]" class="form-control input-small" value="{{ $d->qte }}"></td>
                                                        <td><input type="number" name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][c_u]" class="form-control" value="{{ $d->c_u }}"></td>
                                                        <td><input type="number" name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][montant]" class="form-control" value="{{ $d->montant }}"></td>
                                                        @foreach($mois as $m)
                                                            <td><input type="number" class="form-control mois" name="emplois[{{ $blocIndex }}][depenses][{{ $ligneIndex }}][{{ $m }}]" value="{{ $d->$m ?? 0 }}"></td>
                                                        @endforeach
                                                        
                                                    </tr>
                                                @endforeach
                                            </tbody>
                                        </table>
                                    </div>

                                   

                                </div>
                               
                                @endforeach
                            </div>

                           

                            <div class="step-footer d-flex justify-content-between">
                                <button type="button" class="btn btn-secondary prev">Précédent</button>
                                <div>
                                     <button type="submit" class="btn btn-success">
                                        <i class="fas fa-check"></i> Valider
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>

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

</div>

@endsection

<!-- =================== SCRIPTS JS =================== -->
@push('scripts')
<script>
    let currentStep = 1;
    const totalSteps = 3;

    // ================= VALIDATION RESSOURCES =================
    function validateRessources() {

        let erreur = false;

        document.querySelectorAll(".budget-line").forEach(function(row){

            let montantTotal = parseFloat(row.querySelector("input[name*='montant_inscrit']").value) || 0;

            let mois = row.querySelectorAll(
                "input[name*='janvier'],input[name*='fevrier'],input[name*='mars'],input[name*='avril'],input[name*='mai'],input[name*='juin'],input[name*='juillet'],input[name*='aout'],input[name*='septembre'],input[name*='octobre'],input[name*='novembre'],input[name*='decembre']"
            );

            let somme = 0;

            mois.forEach(function(m){
                somme += parseFloat(m.value) || 0;
            });

            if(montantTotal !== somme){
                erreur = true;
            }
        });

        return erreur;
    }

    // ================= STEP NAVIGATION =================
    function showStep(newStep) {

        if (newStep < 1 || newStep > totalSteps) return;

        let current = document.getElementById('step' + currentStep);
        let next = document.getElementById('step' + newStep);

        if (!current || !next) return;

        if (newStep > currentStep) {
            current.classList.add('exit-left');
        } else {
            current.classList.add('exit-right');
        }

        next.style.display = 'block';

        setTimeout(() => {
            current.classList.remove('active', 'exit-left', 'exit-right');
            current.style.display = 'none';

            next.classList.add('active');
        }, 200);

        currentStep = newStep;
    }

    // ================= NEXT BUTTON =================
    document.querySelectorAll('.next').forEach(btn => {
    btn.addEventListener('click', (e) => {

        let typeContrat = "{{ $besoinbudgetaire->type_contrat }}";

        // 🔥 CAS SPECIAL : PERMANENT
        if(currentStep === 1 && typeContrat === 'permanent'){
            showStep(3); // 🔥 saut direct STEP 3
            return;
        }

        // 🔥 VALIDATION STEP 2
        if(currentStep === 2){

            let erreurRessource = validateRessources();

            if(erreurRessource){
                e.preventDefault();
                alert("Erreur : Le Montant Inscrit doit être égal à la somme des mois (Janvier - Décembre)");
                return false;
            }
        }

        // 🔥 comportement normal
        showStep(currentStep + 1);
    });
});

    // ================= PREV BUTTON =================
    document.querySelectorAll('.prev').forEach(btn => {
    btn.addEventListener('click', () => {

        let typeContrat = "{{ $besoinbudgetaire->type_contrat }}";

        // 🔥 CAS SPECIAL : PERMANENT
        if(currentStep === 3 && typeContrat === 'permanent'){
            showStep(1); // 🔥 retour direct STEP 1
            return;
        }

        // 🔥 comportement normal
        showStep(currentStep - 1);
    });
});

    // ================= INIT =================
    window.addEventListener('load', () => {

        document.querySelectorAll('.step').forEach(step => {
            step.style.display = 'none';
        });

        let first = document.getElementById('step1');
        first.style.display = 'block';
        first.classList.add('active');
    });
</script>

<script>
     // Liste des postes et comptes pour les selects dynamiques
    const postegestions = @json($postegestions); // id + libelle + code
    const comptesyscohadas = @json($comptesyscohadas); // id + code + libelle

    // Affiche "code - libelle" si disponible
    function selectOptions(items, isPoste = true){
        return items.map(i => {
            let text;
            if(isPoste){
                text = `${i.code ?? i.id} - ${i.libelle ?? ''}`; // Poste : code + libelle
            } else {
                text = `${i.code ?? i.id} - ${i.libelle ?? ''}`; // Compte : code + libelle
            }
            return `<option value="${i.id}">${text}</option>`;
        }).join('');
    }
</script>
<script>   
   // ================= CALCUL AUTOMATIQUE MONTANT BUDGET EMPLOIS =================

    document.addEventListener("input", function(e){

        if(
            e.target.name.includes('[nbre]') ||
            e.target.name.includes('[qte]') ||
            e.target.name.includes('[c_u]')
        ){

            let row = e.target.closest("tr");

            let nbre = parseFloat(row.querySelector("input[name*='[nbre]']").value) || 0;
            let qte = parseFloat(row.querySelector("input[name*='[qte]']").value) || 0;
            let cu = parseFloat(row.querySelector("input[name*='[c_u]']").value) || 0;

            let montant = nbre * qte * cu;

            row.querySelector("input[name*='[montant]']").value = montant;
        }

    });


    // ================= VALIDATION AVANT SOUMISSION =================

    document.querySelector("form").addEventListener("submit", function(e){

        let erreur = false;
        let erreurRessource = false;
        let erreurDepense = false;

        // ===== VERIFICATION BUDGET RESSOURCES =====

        document.querySelectorAll(".budget-line").forEach(function(row){

            let montantTotal = parseFloat(row.querySelector("input[name*='montant_inscrit']").value) || 0;

            let mois = row.querySelectorAll(
                "input[name*='janvier'],input[name*='fevrier'],input[name*='mars'],input[name*='avril'],input[name*='mai'],input[name*='juin'],input[name*='juillet'],input[name*='aout'],input[name*='septembre'],input[name*='octobre'],input[name*='novembre'],input[name*='decembre']"
            );

            let somme = 0;

            mois.forEach(function(m){
                somme += parseFloat(m.value) || 0;
            });

            if(montantTotal !== somme){
                erreur = true;
                erreurRessource = true;
            }

        });


        // ===== VERIFICATION BUDGET EMPLOIS =====

        document.querySelectorAll(".table-depenses tbody tr").forEach(function(row){

            let montant = parseFloat(row.querySelector("input[name*='[montant]']").value) || 0;

            let mois = row.querySelectorAll(
                "input[name*='janvier'],input[name*='fevrier'],input[name*='mars'],input[name*='avril'],input[name*='mai'],input[name*='juin'],input[name*='juillet'],input[name*='aout'],input[name*='septembre'],input[name*='octobre'],input[name*='novembre'],input[name*='decembre']"
            );

            let somme = 0;

            mois.forEach(function(m){
                somme += parseFloat(m.value) || 0;
            });

            if(montant !== somme){
                erreur = true;
                erreurDepense = true;
            }

        });


        if(erreur){

            e.preventDefault();

            let message = "Erreur :\n\n";

            if(erreurRessource){
                message += "• Budget Ressources : Le Montant Inscrit doit être égal à la somme Janvier - Décembre\n";
            }

            if(erreurDepense){
                message += "• Budget Emplois : Le Montant doit être égal à la somme Janvier - Décembre\n";
            }

            alert(message);

            return false;

        }

    });
</script>

<script>
document.addEventListener("DOMContentLoaded", function () {

    const typeContrat = document.getElementById("typeContrat");

    const blocContratSelect = document.getElementById("blocContratSelect");
    const blocNomContrat = document.getElementById("blocNomContrat");
    const blocImmatriculation = document.getElementById("blocImmatriculation");

    const inputNomContrat = document.getElementById("inputNomContrat");
    const inputImmatriculation = document.getElementById("immatriculationVisible");

    function show(el){
        if(el) el.classList.remove("d-none");
    }

    function hide(el){
        if(el) el.classList.add("d-none");
    }

    function reset(){
        hide(blocContratSelect);
        hide(blocNomContrat);
        hide(blocImmatriculation);

        // reset état champs (important en modification)
        if(inputNomContrat){
            inputNomContrat.readOnly = true;
            inputNomContrat.classList.add("bg-light");
        }

        if(inputImmatriculation){
            inputImmatriculation.readOnly = true;
            inputImmatriculation.classList.add("bg-light");
        }
    }

    function applyRules(type){

        if(!type) return;

        reset();

        // ================= PERMANENT =================
        if(type === "permanent"){
            show(blocContratSelect);
            return;
        }

        // ================= ACCESSOIRE =================
        if(type === "accessoire"){
            show(blocNomContrat);

            if(inputNomContrat){
                inputNomContrat.readOnly = true;
                inputNomContrat.classList.add("bg-light");
            }

            return;
        }

        // ================= SIGNÉ =================
        if(type === "signe"){
            show(blocNomContrat);
            show(blocImmatriculation);

            if(inputNomContrat){
                inputNomContrat.readOnly = true;
                inputNomContrat.classList.add("bg-light");
            }

            if(inputImmatriculation){
                inputImmatriculation.readOnly = true;
                inputImmatriculation.classList.add("bg-light");
            }

            return;
        }
    }

    // ================= INIT (MODIFICATION) =================
    if(typeContrat && typeContrat.value){
        applyRules(typeContrat.value);
    }

});
</script>
@endpush