@php
    use App\Services\CertificateTypeProfileService;

    $positions = $positions ?? \App\Models\CertificateTemplate::defaultFieldPositions();
    $typeCode = $typeCode ?? 'participation';
    $renderAllFields = $renderAllFields ?? false;
    $activeFields = CertificateTypeProfileService::requiredFields($typeCode);
    $nameOrder = $positions['name_order'] ?? ['first_name', 'other_name', 'last_name'];
    $nameLabels = [
        'first_name' => 'First Name',
        'other_name' => 'Other Name',
        'last_name' => 'Last Name',
    ];
    $showConference = (bool) ($positions['show_conference'] ?? false);
    $showCertNo = (bool) ($positions['show_cert_no'] ?? false);

    $fieldsToRender = $renderAllFields
        ? array_keys(CertificateTypeProfileService::FIELD_DEFINITIONS)
        : $activeFields;
@endphp

@foreach($fieldsToRender as $fieldKey)
    @php
        $field = CertificateTypeProfileService::field($fieldKey);
        $isActive = in_array($fieldKey, $activeFields, true);
        $hiddenClass = ($renderAllFields && ! $isActive) ? 'd-none' : '';
    @endphp

    @if($fieldKey === 'qr')
        <div class="col-12 cert-field-section cert-field-qr {{ $hiddenClass }}" data-field="qr"><hr class="my-2"><h6 class="mb-2">QR Code (required)</h6></div>
        <div class="col-md-4 cert-field-section cert-field-qr {{ $hiddenClass }}" data-field="qr">
            <label class="form-label small">QR Code X</label>
            <input type="number" name="field_positions[{{ $field['x_key'] }}]" class="form-control cert-pos-input" data-pos="{{ $field['x_key'] }}" value="{{ old('field_positions.'.$field['x_key'], $positions[$field['x_key']] ?? $field['default_x']) }}" @if($isActive) required @endif>
        </div>
        <div class="col-md-4 cert-field-section cert-field-qr {{ $hiddenClass }}" data-field="qr">
            <label class="form-label small">QR Code Y</label>
            <input type="number" name="field_positions[{{ $field['y_key'] }}]" class="form-control cert-pos-input" data-pos="{{ $field['y_key'] }}" value="{{ old('field_positions.'.$field['y_key'], $positions[$field['y_key']] ?? $field['default_y']) }}" @if($isActive) required @endif>
        </div>
        <div class="col-md-4 cert-field-section cert-field-qr {{ $hiddenClass }}" data-field="qr">
            <label class="form-label small">QR Code Size</label>
            <input type="number" name="field_positions[{{ $field['size_key'] }}]" class="form-control cert-pos-input" data-pos="{{ $field['size_key'] }}" value="{{ old('field_positions.'.$field['size_key'], $positions[$field['size_key']] ?? $field['default_size']) }}" @if($isActive) required @endif>
        </div>
    @else
        @php
            $sectionLabel = $fieldKey === 'name'
                ? CertificateTypeProfileService::nameLabel($typeCode).' (required)'
                : ($field['label'] ?? ucfirst($fieldKey)).' (required)';
        @endphp
        <div class="col-12 cert-field-section cert-field-{{ $fieldKey }} {{ $hiddenClass }}" data-field="{{ $fieldKey }}"><hr class="my-2"><h6 class="mb-2 cert-field-label" data-field-label="{{ $fieldKey }}">{{ $sectionLabel }}</h6></div>
        <div class="col-md-6 cert-field-section cert-field-{{ $fieldKey }} {{ $hiddenClass }}" data-field="{{ $fieldKey }}">
            <label class="form-label small">{{ $field['label'] }} Y</label>
            <input type="number" name="field_positions[{{ $field['y_key'] }}]" class="form-control cert-pos-input" data-pos="{{ $field['y_key'] }}" value="{{ old('field_positions.'.$field['y_key'], $positions[$field['y_key']] ?? $field['default_y']) }}" @if($isActive) required @endif>
        </div>
        <div class="col-md-6 cert-field-section cert-field-{{ $fieldKey }} {{ $hiddenClass }}" data-field="{{ $fieldKey }}">
            <label class="form-label small">{{ $field['label'] }} Font Size</label>
            <input type="number" name="field_positions[{{ $field['size_key'] }}]" class="form-control cert-pos-input" data-pos="{{ $field['size_key'] }}" value="{{ old('field_positions.'.$field['size_key'], $positions[$field['size_key']] ?? $field['default_size']) }}" @if($isActive) required @endif>
        </div>

        @if($fieldKey === 'name')
            <div class="col-md-6 cert-field-section cert-field-name {{ $hiddenClass }}" data-field="name">
                <label class="form-label small">Name Font</label>
                <select name="field_positions[name_font]" class="form-select cert-name-font-input">
                    @foreach(\App\Services\CertificateFontService::available() as $fontKey => $font)
                        <option value="{{ $fontKey }}" data-family="{{ $font['family'] }}" @selected(old('field_positions.name_font', $positions['name_font'] ?? \App\Services\CertificateFontService::defaultNameFontKey()) === $fontKey)>{{ $font['label'] }}</option>
                    @endforeach
                </select>
            </div>
            @unless(array_key_exists('silentha', \App\Services\CertificateFontService::available()))
                <div class="col-md-6 cert-field-section cert-field-name {{ $hiddenClass }}" data-field="name">
                    <small class="text-muted d-block mt-4">Place <code>Silentha.ttf</code> in <code>public/fonts/certificates/</code> to enable Silentha.</small>
                </div>
            @endunless

            <div class="col-12 cert-name-order-section cert-field-section cert-field-name {{ $hiddenClass }} {{ CertificateTypeProfileService::showsNameOrder($typeCode) ? '' : 'd-none' }}" data-field="name">
                <hr class="my-2">
                <h6 class="mb-2">Name Order</h6>
                <p class="small text-muted mb-2">Choose the sequence for displaying the name.</p>
                <div class="row g-2">
                    @foreach([0, 1, 2] as $slot)
                        @php $selected = $nameOrder[$slot] ?? ''; @endphp
                        <div class="col-md-4">
                            <label class="form-label small">Part {{ $slot + 1 }}</label>
                            <select name="field_positions[name_order][]" class="form-select cert-name-order-input">
                                <option value="">(Skip)</option>
                                @foreach($nameLabels as $value => $label)
                                    <option value="{{ $value }}" @selected($selected === $value)>{{ $label }}</option>
                                @endforeach
                            </select>
                        </div>
                    @endforeach
                </div>
            </div>
        @endif
    @endif
@endforeach

<div class="col-12 cert-optional-fields {{ CertificateTypeProfileService::showsOptionalOverlays($typeCode) ? '' : 'd-none' }}">
    <hr class="my-2">
    <h6 class="mb-2">Optional fields</h6>
    <p class="small text-muted mb-2">Enable only if these details are not already printed on your template artwork.</p>

    <div class="form-check mb-2">
        <input type="checkbox" name="field_positions[show_conference]" value="1" class="form-check-input cert-toggle-conference" id="show_conference_{{ $fieldId ?? 'new' }}" @checked(old('field_positions.show_conference', $showConference))>
        <label class="form-check-label" for="show_conference_{{ $fieldId ?? 'new' }}">Include conference name</label>
    </div>
    <div class="row g-3 cert-conference-fields mb-3 {{ $showConference ? '' : 'd-none' }}">
        <div class="col-md-6">
            <label class="form-label small">Conference Y</label>
            <input type="number" name="field_positions[conference_y]" class="form-control cert-pos-input" data-pos="conference_y" value="{{ old('field_positions.conference_y', $positions['conference_y'] ?? 340) }}">
        </div>
        <div class="col-md-6">
            <label class="form-label small">Conference Font Size</label>
            <input type="number" name="field_positions[conference_size]" class="form-control cert-pos-input" data-pos="conference_size" value="{{ old('field_positions.conference_size', $positions['conference_size'] ?? 18) }}">
        </div>
    </div>

    <div class="form-check mb-2">
        <input type="checkbox" name="field_positions[show_cert_no]" value="1" class="form-check-input cert-toggle-certno" id="show_cert_no_{{ $fieldId ?? 'new' }}" @checked(old('field_positions.show_cert_no', $showCertNo))>
        <label class="form-check-label" for="show_cert_no_{{ $fieldId ?? 'new' }}">Include certificate number</label>
    </div>
    <div class="row g-3 cert-certno-fields {{ $showCertNo ? '' : 'd-none' }}">
        <div class="col-md-6">
            <label class="form-label small">Certificate No. Y</label>
            <input type="number" name="field_positions[cert_no_y]" class="form-control cert-pos-input" data-pos="cert_no_y" value="{{ old('field_positions.cert_no_y', $positions['cert_no_y'] ?? 480) }}">
        </div>
    </div>
</div>

<p class="col-12 small text-muted mb-0 cert-fields-hint">{{ CertificateTypeProfileService::hint($typeCode) }}</p>