<div class="section-title">{{ __('Elementos (Features)') }}</div>

@if(empty($features))
    <div class="text-center text-gray-400 py-8">
        <p>{{ __('No hay elementos en el rango seleccionado.') }}</p>
    </div>
@else
    <div class="overflow-x-auto">
        <table>
            <thead>
                <tr>
                    <th>Elemento</th>
                    <th>Fase</th>
                    <th>Capa</th>
                    <th>Estado</th>
                    <th>Progreso (%)</th>
                    <th>Prog. Plan (%)</th>
                    <th>Inicio Plan</th>
                    <th>Fin Plan</th>
                    <th>Inicio Real</th>
                    <th>Fin Real</th>
                    <th>Δ Fin (d)</th>
                    <th>Δ Inicio (d)</th>
                    <th>SPI</th>
                    <th>En Plazo</th>
                    <th>Responsable</th>
                    <th>Template</th>
                    <th>Últ. Insp.</th>
                    <th>Resultado</th>
                    <th>Insp.</th>
                    <th>Issues</th>
                </tr>
            </thead>
            <tbody>
                @foreach($features as $feature)
                    @php
                        $hasEndDev = $feature['deviation_days'] !== null;
                        $endDevColor = $hasEndDev && $feature['deviation_days'] > 0 ? 'text-red-600' : ($hasEndDev && $feature['deviation_days'] < 0 ? 'text-green-600' : '');
                        $hasStartDev = $feature['start_deviation_days'] !== null;
                        $startDevColor = $hasStartDev && $feature['start_deviation_days'] > 0 ? 'text-red-600' : ($hasStartDev && $feature['start_deviation_days'] < 0 ? 'text-green-600' : '');
                        $hasProgDev = $feature['progress_deviation'] !== null;
                        $progDevColor = $hasProgDev && $feature['progress_deviation'] < 0 ? 'text-red-600' : 'text-green-600';
                    @endphp
                <tr>
                    <td class="font-medium">{{ $feature['name'] }}</td>
                    <td>{{ $feature['phase'] }}</td>
                    <td>{{ $feature['layer'] }}</td>
                    <td>
                        <span class="badge" style="background: {{ $feature['status_color'] }}20; color: {{ $feature['status_color'] }};">
                            {{ $feature['status_label'] }}
                        </span>
                    </td>
                    <td>
                        <div style="display:flex;align-items:center;gap:6px;">
                            <div style="flex:1;background:#e5e7eb;border-radius:4px;height:6px;min-width:60px;">
                                <div style="height:6px;border-radius:4px;background:{{ $feature['status_color'] }};width:{{ min(100, $feature['progress']) }}%;"></div>
                            </div>
                            <span style="font-size:11px;color:#6b7280;white-space:nowrap;">{{ $feature['progress'] }}%</span>
                        </div>
                    </td>
                    <td>{{ $feature['planned_progress'] }}%</td>
                    <td>{{ $feature['planned_start'] ?? '—' }}</td>
                    <td>{{ $feature['planned_end'] ?? '—' }}</td>
                    <td>{{ $feature['actual_start'] ?? '—' }}</td>
                    <td>{{ $feature['actual_end'] ?? '—' }}</td>
                    <td class="{{ $endDevColor }}">{{ $feature['deviation_days'] ?? '—' }}</td>
                    <td class="{{ $startDevColor }}">{{ $feature['start_deviation_days'] ?? '—' }}</td>
                    <td>{{ $feature['spi'] ?? '—' }}</td>
                    <td>
                        @if($feature['is_on_track'] === true)
                            <span class="badge badge-success">{{ __('Sí') }}</span>
                        @elseif($feature['is_on_track'] === false)
                            <span class="badge badge-error">{{ __('No') }}</span>
                        @else
                            <span class="badge badge-ghost">{{ __('N/A') }}</span>
                        @endif
                    </td>
                    <td>{{ $feature['responsible'] }}</td>
                    <td>{{ $feature['template'] }}</td>
                    <td>{{ $feature['last_inspection_date'] ?? '—' }}</td>
                    <td>
                        @if($feature['last_inspection_result'])
                            <span class="badge {{ $feature['last_inspection_result'] === 'pass' ? 'badge-success' : ($feature['last_inspection_result'] === 'fail' ? 'badge-error' : 'badge-warning') }}">
                                {{ $feature['last_inspection_result'] === 'pass' ? 'Aprobada' : ($feature['last_inspection_result'] === 'fail' ? 'Fallida' : 'Condicional') }}
                            </span>
                        @endif
                    </td>
                    <td>{{ $feature['inspections_count'] }}</td>
                    <td>{{ $feature['open_issues_count'] }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
@endif