@extends('layouts.app')
@section('title', $caisse ? 'Modifier la caisse' : 'Nouvelle caisse')
@section('page-title', 'Fichiers de base — Caisses')

@push('styles')
<style>
    .c-card { background:#fff; border-radius:12px; border:1px solid var(--border); padding:18px 22px; margin-bottom:14px; }
    .f-label { font-size:12px; font-weight:700; color:var(--text-muted); white-space:nowrap; }
    .f-input { border:1.5px solid var(--border); border-radius:7px; padding:5px 9px; font-family:'Nunito',sans-serif; font-size:13px; font-weight:600; color:var(--text); background:#fff; outline:none; transition:border-color 0.2s; }
    .f-input:focus { border-color:var(--yellow); }
    .f-select { appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 8px center; background-size:14px; padding-right:28px; }
    .check-lbl { display:flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--text); cursor:pointer; white-space:nowrap; }
    .check-lbl input { accent-color:var(--navy); cursor:pointer; }
    .radio-lbl { display:flex; align-items:center; gap:6px; font-size:13px; font-weight:600; color:var(--text); cursor:pointer; }
    .radio-lbl input { accent-color:var(--navy); cursor:pointer; }
    .frow { display:grid; align-items:start; gap:6px 12px; margin-bottom:10px; }
    .frow-1 { grid-template-columns: 150px 1fr; }
    .frow-2 { grid-template-columns: 150px 1fr 150px 1fr; }
    .frow-3 { grid-template-columns: 150px 1fr 150px 1fr 150px 1fr; }
    .s-title { font-size:11px; font-weight:900; text-transform:uppercase; letter-spacing:1px; color:var(--navy); border-bottom:2px solid var(--yellow); padding-bottom:5px; margin-bottom:14px; }
    .sep { border:none; border-top:1.5px solid var(--border); margin:16px 0; }
    .action-bar { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; border-top:2px solid var(--border); padding-top:14px; margin-top:4px; }
    .btn-ref-open { background:var(--navy); color:#fff; border:none; border-radius:20px; padding:8px 20px; font-family:'Nunito',sans-serif; font-size:13px; font-weight:800; cursor:pointer; display:inline-flex; align-items:center; gap:7px; }
    .btn-ref-open:hover { opacity:.88; }
    .act-left { display:flex; gap:10px; align-items:center; }
    .btn-y { background:var(--yellow); color:var(--navy); border:none; border-radius:20px; padding:8px 22px; font-family:'Nunito',sans-serif; font-size:13px; font-weight:800; cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
    .btn-y:hover { background:var(--yellow-dark); }
    .btn-ghost { background:#fff; color:var(--text-muted); border:1.5px solid var(--border); border-radius:20px; padding:7px 18px; font-family:'Nunito',sans-serif; font-size:13px; font-weight:700; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; }
    .btn-ghost:hover { background:#F4F6FB; }
    .btn-danger { background:#fff; color:#E53E3E; border:1.5px solid #E53E3E; border-radius:20px; padding:7px 18px; font-family:'Nunito',sans-serif; font-size:13px; font-weight:700; cursor:pointer; display:inline-flex; align-items:center; gap:6px; }
    .btn-danger:hover { background:#FFF5F5; }
</style>
@endpush

@section('content')

@php $c = $caisse; @endphp

@if(!$c)
{{-- Référentiel national --}}
<div class="c-card" style="margin-bottom:14px; display:flex; align-items:center; gap:14px; flex-wrap:wrap;">
    <div style="flex:1;">
        <div class="s-title" style="margin-bottom:4px;">Référentiel national</div>
        <p style="font-size:12px; color:var(--text-muted); margin:0;" id="refSelLabel">Recherchez parmi les 1 577 caisses standard pour pré-remplir le formulaire.</p>
    </div>
    <button type="button" class="btn-ref-open" id="refOpenBtn" onclick="refOpen()">
        <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round"><circle cx="11" cy="11" r="7"/><line x1="16.5" y1="16.5" x2="22" y2="22"/></svg>
        Rechercher une caisse
    </button>
</div>

@endif

<form method="POST" action="{{ $c ? route('organismes.update', $c->id) : route('organismes.store') }}" autocomplete="off">
@csrf
@if($c) @method('PUT') @endif

{{-- En-tête --}}
<div class="c-card">
    <div style="display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;">
        <h2 style="font-size:16px; font-weight:900; color:var(--navy); margin:0;">
            {{ $c ? $c->nom : 'Nouvelle caisse' }}
        </h2>
        <div style="display:flex; gap:14px; align-items:center; flex-wrap:wrap;">
            <label class="check-lbl">
                <input type="checkbox" name="mode_test" value="1" {{ $c?->mode_test ? 'checked' : '' }}> Caisse en mode test
            </label>
            <label class="check-lbl">
                <input type="checkbox" name="teletransmission" value="1" id="chkTele"
                    {{ $c?->teletransmission ? 'checked' : '' }} onchange="toggleTele()"> Caisse en Télétransmission
            </label>
        </div>
    </div>
</div>

{{-- Identification --}}
<div class="c-card">
    <div class="s-title">Identification</div>

    <div class="frow frow-1" style="margin-bottom:12px;">
        <label class="f-label">Nom de la caisse *</label>
        <input type="text" class="f-input" name="nom" value="{{ $c?->nom }}" required>
    </div>
    <div class="frow frow-2">
        <label class="f-label">Ligne adresse 1</label>
        <input type="text" class="f-input" name="adresse1" value="{{ $c?->adresse1 }}">
        <label class="f-label">Téléphone</label>
        <input type="tel" class="f-input" style="max-width:180px;" name="telephone" value="{{ $c?->telephone }}">
    </div>
    <div style="display:grid; grid-template-columns:150px 1fr 150px 1fr; gap:6px 12px; align-items:start; margin-bottom:10px;">
        <label class="f-label" style="padding-top:6px;">Ligne adresse 2</label>
        <input type="text" class="f-input" name="adresse2" value="{{ $c?->adresse2 }}">
        <label class="f-label" style="padding-top:6px;">Commentaire</label>
        <textarea class="f-input" name="commentaire" rows="3" style="resize:vertical;">{{ $c?->commentaire }}</textarea>
    </div>
    <div class="frow frow-1">
        <label class="f-label">Ligne adresse 3</label>
        <input type="text" class="f-input" name="adresse3" value="{{ $c?->adresse3 }}">
    </div>
    <div style="display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-top:6px;">
        <label class="f-label">Code postal</label>
        <input type="text" class="f-input" style="width:80px;" name="cp" value="{{ $c?->code_postal }}">
        <label class="f-label">Ville</label>
        <input type="text" class="f-input" style="width:200px;" name="ville" value="{{ $c?->ville }}">
    </div>
</div>

{{-- Télétransmission NOÉMIE --}}
<div class="c-card" id="blocTele">
    <div class="s-title">Télétransmission NOÉMIE</div>

    <div style="display:flex; align-items:center; gap:20px; flex-wrap:wrap; margin-bottom:14px;">
        <div style="display:flex; align-items:center; gap:8px;">
            <label class="f-label">Code envoi NOÉMIE</label>
            <input type="text" class="f-input" style="width:70px;" name="code_noemie" value="{{ $c?->code_noemie }}">
        </div>
        <label class="check-lbl"><input type="checkbox" name="envoi_rpps" value="1" {{ $c?->envoi_rpps ? 'checked' : '' }}> Envoi No RPPS</label>
        <label class="check-lbl"><input type="checkbox" name="sep_cmu"   value="1" {{ $c?->sep_cmu    ? 'checked' : '' }}> Séparation lots noémie pour les CMU</label>
        <label class="check-lbl"><input type="checkbox" name="sep_taux"  value="1" {{ $c?->sep_taux   ? 'checked' : '' }}> Séparation des lots noémie 55% et 100%</label>
    </div>

    <div class="frow frow-3" style="margin-bottom:10px;">
        <label class="f-label">Code Grand régime</label>
        <input type="text" class="f-input" style="max-width:70px;" name="code_gr" value="{{ $c?->code_grand_regime }}">
        <label class="f-label">Caisse gestionnaire</label>
        <input type="text" class="f-input" style="max-width:70px;" name="caisse_gest" value="{{ $c?->caisse_gestionnaire }}">
        <label class="f-label">Centre gestionnaire</label>
        <input type="text" class="f-input" style="max-width:70px;" name="centre_gest" value="{{ $c?->centre_gestionnaire }}">
    </div>
    <div class="frow frow-3" style="margin-bottom:10px;">
        <label class="f-label">Code affiliation</label>
        <input type="text" class="f-input" style="max-width:120px;" name="code_affil" value="{{ $c?->code_affiliation }}">
        <label class="f-label">Centre informatique</label>
        <input type="text" class="f-input" style="max-width:70px;" name="centre_info" value="{{ $c?->centre_informatique }}">
        <label class="f-label">Organisme destinataire</label>
        <input type="text" class="f-input" style="max-width:70px;" name="org_dest" value="{{ $c?->organisme_destinataire }}">
    </div>
    <div style="display:flex; align-items:center; gap:10px; margin-bottom:14px;">
        <label class="f-label">Type destinataire NOÉMIE</label>
        <input type="text" class="f-input" style="width:70px;" name="type_dest_noemie" value="{{ $c?->type_dest_noemie }}">
    </div>

    <hr class="sep">

    <div class="frow frow-2" style="margin-bottom:10px;">
        <label class="f-label">Adresse destinataire</label>
        <input type="text" class="f-input" name="adresse_dest" value="{{ $c?->adresse_destinataire }}">
        <label class="f-label">No Organisme</label>
        <input type="text" class="f-input" style="max-width:180px;" name="no_organisme" value="{{ $c?->no_organisme }}">
    </div>
    <div class="frow frow-2">
        <label class="f-label">No CRAM</label>
        <input type="text" class="f-input" style="max-width:70px;" name="no_cram" value="{{ $c?->no_cram }}">
        <label class="f-label">Type de contrat</label>
        <input type="text" class="f-input" style="max-width:70px;" name="type_contrat" value="{{ $c?->type_contrat }}">
    </div>

    <hr class="sep">

    <div style="display:flex; align-items:flex-start; gap:40px; flex-wrap:wrap;">
        <div>
            <div class="f-label" style="margin-bottom:10px;">Mode d'envoi</div>
            <div style="display:flex; flex-direction:column; gap:8px;">
                <label class="radio-lbl">
                    <input type="radio" name="mode_envoi" value="global"
                        {{ ($c?->mode_envoi ?? 'global') === 'global' ? 'checked' : '' }}> Envoi global
                </label>
                <label class="radio-lbl">
                    <input type="radio" name="mode_envoi" value="non"
                        {{ ($c?->mode_envoi) === 'non' ? 'checked' : '' }}> Ne pas cocher (pour l'instant)
                </label>
            </div>
        </div>
    </div>
</div>

{{-- Actions --}}
<div class="c-card">
    <div class="action-bar">
        <div class="act-left">
            <button type="submit" class="btn-y">
                <svg viewBox="0 0 24 24" style="width:14px;height:14px;stroke:var(--navy);fill:none;stroke-width:2.5;stroke-linecap:round;"><polyline points="20 6 9 17 4 12"/></svg>
                Valider
            </button>
            @if($c)
            <button type="button" class="btn-danger" onclick="document.getElementById('del-form').submit()">
                <svg viewBox="0 0 24 24" style="width:14px;height:14px;stroke:#E53E3E;fill:none;stroke-width:2;stroke-linecap:round;"><polyline points="3 6 5 6 21 6"/><path d="M19 6l-1 14a2 2 0 01-2 2H8a2 2 0 01-2-2L5 6"/><path d="M9 6V4h6v2"/></svg>
                Supprimer
            </button>
            @endif
            <a href="{{ route('organismes.index') }}" class="btn-ghost">Quitter</a>
        </div>
    </div>
</div>

</form>

@if($c)
<form id="del-form" method="POST" action="{{ route('organismes.destroy', $c->id) }}" onsubmit="return confirm('Supprimer cette caisse ?')">
    @csrf @method('DELETE')
</form>
@endif

@endsection

@push('modals')
@if(!$c)
<style>
    #refModal { display:none; position:fixed; top:0; left:0; width:100vw; height:100vh; z-index:9000; background:rgba(0,0,0,.5); }
    #refModal.open { display:flex; align-items:center; justify-content:center; }
    #refBox { background:#fff; border-radius:14px; width:min(920px,96vw); max-height:88vh; display:flex; flex-direction:column; box-shadow:0 20px 60px rgba(0,0,0,.3); overflow:hidden; }
    #refBoxHead { padding:14px 18px 12px; border-bottom:2px solid #e8eaf0; display:flex; align-items:center; gap:10px; flex-wrap:wrap; background:#F4F6FB; }
    #refBoxHead h3 { margin:0; font-size:14px; font-weight:900; color:#1a1a2e; white-space:nowrap; }
    #refSearch { flex:2; min-width:180px; border:2px solid #FBBF24; border-radius:8px; padding:6px 11px; font-family:'Nunito',sans-serif; font-size:13px; font-weight:600; color:#222; outline:none; background:#fff; }
    #refSearch:focus { border-color:#1a1a2e; }
    #refDept, #refRegime { border:1.5px solid #d1d5db; border-radius:8px; padding:6px 10px; font-family:'Nunito',sans-serif; font-size:12px; font-weight:700; color:#222; background:#fff; outline:none; cursor:pointer; }
    #refDept { width:200px; }
    #refCount { font-size:11px; color:#888; white-space:nowrap; margin-left:auto; }
    #refClose { background:none; border:none; cursor:pointer; color:#888; font-size:24px; line-height:1; padding:0 2px; flex-shrink:0; }
    #refClose:hover { color:#1a1a2e; }
    #refBody { overflow-y:auto; flex:1; }
    #refTable { width:100%; border-collapse:collapse; font-size:12px; }
    #refTable thead th { position:sticky; top:0; background:#F4F6FB; padding:8px 10px; text-align:left; font-size:10px; font-weight:900; text-transform:uppercase; letter-spacing:.8px; color:#888; border-bottom:2px solid #e8eaf0; white-space:nowrap; }
    #refTable tbody tr { cursor:pointer; border-bottom:1px solid #f0f0f0; }
    #refTable tbody tr:hover { background:#FFF9E6; }
    #refTable tbody td { padding:7px 10px; color:#333; }
    #refTable tbody td:first-child { font-weight:800; color:#1a1a2e; }
    #refTable .td-code { font-family:monospace; color:#666; font-size:11px; }
    #refEmpty { padding:32px; text-align:center; color:#aaa; font-size:13px; font-style:italic; }
</style>

<div id="refModal" role="dialog" aria-modal="true">
    <div id="refBox">
        <div id="refBoxHead">
            <h3>Référentiel national des caisses</h3>
            <input type="text" id="refSearch" placeholder="Nom, code organisme, commune…" autocomplete="off">
            <select id="refDept">
                <option value="">Tous les départements</option>
                <option value="01">01 — Ain</option>
                <option value="02">02 — Aisne</option>
                <option value="03">03 — Allier</option>
                <option value="04">04 — Alpes-de-Haute-Provence</option>
                <option value="05">05 — Hautes-Alpes</option>
                <option value="06">06 — Alpes-Maritimes</option>
                <option value="07">07 — Ardèche</option>
                <option value="08">08 — Ardennes</option>
                <option value="09">09 — Ariège</option>
                <option value="10">10 — Aube</option>
                <option value="11">11 — Aude</option>
                <option value="12">12 — Aveyron</option>
                <option value="13">13 — Bouches-du-Rhône</option>
                <option value="14">14 — Calvados</option>
                <option value="15">15 — Cantal</option>
                <option value="16">16 — Charente</option>
                <option value="17">17 — Charente-Maritime</option>
                <option value="18">18 — Cher</option>
                <option value="19">19 — Corrèze</option>
                <option value="2A">2A — Corse-du-Sud</option>
                <option value="2B">2B — Haute-Corse</option>
                <option value="21">21 — Côte-d'Or</option>
                <option value="22">22 — Côtes-d'Armor</option>
                <option value="23">23 — Creuse</option>
                <option value="24">24 — Dordogne</option>
                <option value="25">25 — Doubs</option>
                <option value="26">26 — Drôme</option>
                <option value="27">27 — Eure</option>
                <option value="28">28 — Eure-et-Loir</option>
                <option value="29">29 — Finistère</option>
                <option value="30">30 — Gard</option>
                <option value="31">31 — Haute-Garonne</option>
                <option value="32">32 — Gers</option>
                <option value="33">33 — Gironde</option>
                <option value="34">34 — Hérault</option>
                <option value="35">35 — Ille-et-Vilaine</option>
                <option value="36">36 — Indre</option>
                <option value="37">37 — Indre-et-Loire</option>
                <option value="38">38 — Isère</option>
                <option value="39">39 — Jura</option>
                <option value="40">40 — Landes</option>
                <option value="41">41 — Loir-et-Cher</option>
                <option value="42">42 — Loire</option>
                <option value="43">43 — Haute-Loire</option>
                <option value="44">44 — Loire-Atlantique</option>
                <option value="45">45 — Loiret</option>
                <option value="46">46 — Lot</option>
                <option value="47">47 — Lot-et-Garonne</option>
                <option value="48">48 — Lozère</option>
                <option value="49">49 — Maine-et-Loire</option>
                <option value="50">50 — Manche</option>
                <option value="51">51 — Marne</option>
                <option value="52">52 — Haute-Marne</option>
                <option value="53">53 — Mayenne</option>
                <option value="54">54 — Meurthe-et-Moselle</option>
                <option value="55">55 — Meuse</option>
                <option value="56">56 — Morbihan</option>
                <option value="57">57 — Moselle</option>
                <option value="58">58 — Nièvre</option>
                <option value="59">59 — Nord</option>
                <option value="60">60 — Oise</option>
                <option value="61">61 — Orne</option>
                <option value="62">62 — Pas-de-Calais</option>
                <option value="63">63 — Puy-de-Dôme</option>
                <option value="64">64 — Pyrénées-Atlantiques</option>
                <option value="65">65 — Hautes-Pyrénées</option>
                <option value="66">66 — Pyrénées-Orientales</option>
                <option value="67">67 — Bas-Rhin</option>
                <option value="68">68 — Haut-Rhin</option>
                <option value="69">69 — Rhône</option>
                <option value="70">70 — Haute-Saône</option>
                <option value="71">71 — Saône-et-Loire</option>
                <option value="72">72 — Sarthe</option>
                <option value="73">73 — Savoie</option>
                <option value="74">74 — Haute-Savoie</option>
                <option value="75">75 — Paris</option>
                <option value="76">76 — Seine-Maritime</option>
                <option value="77">77 — Seine-et-Marne</option>
                <option value="78">78 — Yvelines</option>
                <option value="79">79 — Deux-Sèvres</option>
                <option value="80">80 — Somme</option>
                <option value="81">81 — Tarn</option>
                <option value="82">82 — Tarn-et-Garonne</option>
                <option value="83">83 — Var</option>
                <option value="84">84 — Vaucluse</option>
                <option value="85">85 — Vendée</option>
                <option value="86">86 — Vienne</option>
                <option value="87">87 — Haute-Vienne</option>
                <option value="88">88 — Vosges</option>
                <option value="89">89 — Yonne</option>
                <option value="90">90 — Territoire de Belfort</option>
                <option value="91">91 — Essonne</option>
                <option value="92">92 — Hauts-de-Seine</option>
                <option value="93">93 — Seine-Saint-Denis</option>
                <option value="94">94 — Val-de-Marne</option>
                <option value="95">95 — Val-d'Oise</option>
                <option value="971">971 — Guadeloupe</option>
                <option value="972">972 — Martinique</option>
                <option value="973">973 — Guyane</option>
                <option value="974">974 — La Réunion</option>
                <option value="976">976 — Mayotte</option>
            </select>
            <select id="refRegime">
                <option value="">Tous les régimes</option>
                <option value="01">01 — Général</option>
                <option value="02">02 — Agricole</option>
                <option value="03">03 — Indépendants</option>
                <option value="90">90 — Autres</option>
            </select>
            <span id="refCount"></span>
            <button type="button" id="refClose" onclick="refClose()" title="Fermer">&times;</button>
        </div>
        <div id="refBody">
            <table id="refTable">
                <thead><tr><th>Nom</th><th>Code</th><th>Rég.</th><th>CP</th><th>Commune</th><th>Téléphone</th></tr></thead>
                <tbody id="refTbody"></tbody>
            </table>
            <div id="refEmpty" style="display:none;">Aucun résultat</div>
        </div>
    </div>
</div>
@endif
@endpush

@push('scripts')
<script>
function toggleTele() {
    const checked = document.getElementById('chkTele').checked;
    const bloc = document.getElementById('blocTele');
    bloc.style.opacity = checked ? '1' : '0.45';
    bloc.style.pointerEvents = checked ? 'auto' : 'none';
}
document.addEventListener('DOMContentLoaded', function() {
    @if(!$c)
    var chk = document.getElementById('chkTele');
    if (chk) chk.checked = true;
    @endif
    toggleTele();
});

@if(!$c)
(function() {
    var allData = null, loading = false;
    var modal   = document.getElementById('refModal');
    var search  = document.getElementById('refSearch');
    var regime  = document.getElementById('refRegime');
    var dept    = document.getElementById('refDept');
    var tbody   = document.getElementById('refTbody');
    var empty   = document.getElementById('refEmpty');
    var count   = document.getElementById('refCount');
    var table   = document.getElementById('refTable');

    window.refOpen = function() {
        modal.classList.add('open');
        document.body.style.overflow = 'hidden';
        if (allData) { render(); search.focus(); return; }
        if (loading) return;
        loading = true;
        tbody.innerHTML = '<tr><td colspan="6" style="padding:20px;text-align:center;color:#aaa;">Chargement…</td></tr>';
        table.style.display = 'table'; empty.style.display = 'none';
        fetch('{{ route('organismes.ref.search') }}?q=&all=1')
            .then(function(r){
                if (!r.ok) return r.json().then(function(e){ throw new Error(e.error || 'Erreur '+r.status); });
                return r.json();
            })
            .then(function(data){ allData = data; loading = false; render(); search.focus(); })
            .catch(function(err){ tbody.innerHTML = '<tr><td colspan="6" style="padding:20px;text-align:center;color:#e53e3e;">' + (err.message||'Erreur de chargement') + '</td></tr>'; loading = false; });
    };

    window.refClose = function() {
        modal.classList.remove('open');
        document.body.style.overflow = '';
    };

    modal.addEventListener('click', function(e){ if (e.target === modal) refClose(); });
    document.addEventListener('keydown', function(e){ if (e.key === 'Escape' && modal.classList.contains('open')) refClose(); });

    search.addEventListener('input', render);
    regime.addEventListener('change', render);
    dept.addEventListener('change', render);

    function esc(s){ return String(s||'').replace(/&/g,'&amp;').replace(/</g,'&lt;').replace(/>/g,'&gt;'); }

    function render() {
        if (!allData) return;
        var q  = search.value.toLowerCase().trim();
        var gr = regime.value;
        var dp = dept.value;
        var filtered = allData.filter(function(o) {
            if (gr && (o.grand_regime || '').trim() !== gr) return false;
            if (dp) {
                var cp = (o.code_postal || '');
                // Corse 2A: CP 200xx-201xx, 2B: CP 202xx-209xx
                if (dp === '2A' && !(/^20[01]/.test(cp))) return false;
                if (dp === '2B' && !(/^20[2-9]/.test(cp))) return false;
                if (dp !== '2A' && dp !== '2B' && !cp.startsWith(dp)) return false;
            }
            if (!q) return true;
            return (o.nom||'').toLowerCase().includes(q)
                || (o.id_orga||'').toLowerCase().startsWith(q)
                || (o.commune||'').toLowerCase().includes(q)
                || (o.adresse1||'').toLowerCase().includes(q)
                || (o.adresse2||'').toLowerCase().includes(q)
                || (o.code_postal||'').startsWith(q);
        });
        count.textContent = filtered.length + ' / ' + allData.length;
        if (!filtered.length) {
            tbody.innerHTML = ''; table.style.display = 'none'; empty.style.display = 'block'; return;
        }
        table.style.display = 'table'; empty.style.display = 'none';
        var rows = filtered.slice(0, 300).map(function(o) {
            return '<tr data-nom="' + esc(o.nom) + '" data-json=\'' + JSON.stringify(o).replace(/'/g,"&#39;") + '\'>'
                + '<td>' + esc(o.nom) + '</td>'
                + '<td class="td-code">' + esc(o.id_orga) + '</td>'
                + '<td class="td-code">' + esc(o.grand_regime) + '</td>'
                + '<td class="td-code">' + esc(o.code_postal) + '</td>'
                + '<td>' + esc(o.commune) + '</td>'
                + '<td class="td-code">' + esc(o.telephone) + '</td>'
                + '</tr>';
        });
        if (filtered.length > 300) rows.push('<tr><td colspan="6" style="text-align:center;padding:8px;color:#aaa;font-style:italic;font-size:11px;">… et ' + (filtered.length-300) + ' autres — affinez la recherche</td></tr>');
        tbody.innerHTML = rows.join('');
        tbody.querySelectorAll('tr[data-json]').forEach(function(tr) {
            tr.addEventListener('click', function() {
                var o = JSON.parse(this.dataset.json);
                var villeVal = (o.commune || '') + (o.cedex ? ' ' + o.cedex : '');
                setField('nom',              o.nom);
                setField('adresse1',         o.adresse1);
                setField('adresse2',         o.adresse2);
                setField('cp',               o.code_postal);
                setField('ville',            villeVal);
                setField('telephone',        o.telephone);
                setField('code_gr',          o.grand_regime);
                setField('caisse_gest',      o.caisse_gest);
                setField('centre_gest',      o.cd_org);
                var codeAffil = (o.grand_regime || '') + (o.caisse_gest || '') + (o.cd_org || '');
                setField('code_affil', codeAffil);
                setField('centre_info',      o.ctr_inf);
                setField('org_dest',         o.org_dest);
                setField('no_organisme',     o.id_orga);
                setField('type_dest_noemie', o.type_dest);
                var addrDest = codeAffil.substring(0, 5) + '@' + (o.caisse_gest || '') + '.' + (o.grand_regime || '') + '.rss.fr';
                setField('adresse_dest', addrDest);
                var chkTele = document.getElementById('chkTele');
                if (chkTele && !chkTele.checked) { chkTele.checked = true; toggleTele(); }
                document.getElementById('refSelLabel').innerHTML = '<strong style="color:var(--navy);">' + esc(o.nom) + '</strong> sélectionnée — modifiez les champs si besoin.';
                refClose();
            });
        });
    }

    function setField(name, val) {
        var el = document.querySelector('[name="' + name + '"]');
        if (el && val != null) el.value = val;
    }
})();
@endif
</script>
@endpush