@php
    $parceiros = \V2\Modules\Conexoes\ParceirosInstitucionais\Models\Parceiro::with('galleryLogo')->active()->ordered()->get();
    $hiddenSlugs = $data['hidden_slugs'] ?? [];
    if (!is_array($hiddenSlugs)) {
        $hiddenSlugs = [];
    }
@endphp
<div class="mb-3">
    <div class="card mb-2">
        <div class="card-body py-2">
            <div class="mb-2">
                <input type="text" name="parameters[title]" class="form-control form-control-sm"
                       value="{{ $data['title'] ?? '' }}" placeholder="Título da Seção">
            </div>
            @if($parceiros->isNotEmpty())
            <label class="form-label fw-bold mt-2">Parceiros visíveis</label>
            <p class="text-muted small mb-2">
                Todos os parceiros ativos aparecem no carrossel por padrão.
                Desmarque apenas os que devem ficar <strong>ocultos</strong> — novos parceiros cadastrados aparecem automaticamente.
            </p>
            <div class="row g-2">
                @foreach($parceiros as $parceiro)
                <div class="col-md-6 col-lg-4">
                    <div class="form-check">
                        <input type="hidden" name="parameters[hidden_slugs][]" value="{{ $parceiro->slug }}"
                               class="partner-hidden-slug-input"
                               {{ in_array($parceiro->slug, $hiddenSlugs) ? '' : 'disabled' }}>
                        <input type="checkbox" name="parameters[visible_slugs][]" value="{{ $parceiro->slug }}"
                               class="form-check-input partner-visible-slug-input"
                               id="parceiro_{{ $parceiro->slug }}"
                               {{ !in_array($parceiro->slug, $hiddenSlugs) ? 'checked' : '' }}>
                        <label class="form-check-label small" for="parceiro_{{ $parceiro->slug }}">
                            {{ $parceiro->name }}
                        </label>
                    </div>
                </div>
                @endforeach
            </div>
            @else
            <p class="text-muted fst-italic small mt-2">Nenhum parceiro institucional ativo no momento.</p>
            @endif
        </div>
    </div>
</div>

<script>
(function() {
    function syncHiddenState(checkbox) {
        var container = checkbox.closest('.form-check');
        if (!container) return;
        var hidden = container.querySelector('.partner-hidden-slug-input');
        if (hidden) {
            // Marcado = visível → hidden desabilitado (não é enviado).
            // Desmarcado = oculto → hidden habilitado (entra em hidden_slugs).
            hidden.disabled = checkbox.checked;
        }
    }

    document.addEventListener('change', function(event) {
        if (event.target.classList.contains('partner-visible-slug-input')) {
            syncHiddenState(event.target);
        }
    });

    document.addEventListener('DOMContentLoaded', function() {
        document.querySelectorAll('.partner-visible-slug-input').forEach(syncHiddenState);
    });
})();
</script>