@extends('layouts.app')
@section('title', 'Recibos por Honorarios')

@section('content')
    <div class="page-head">
        <h1>Recibos por Honorarios</h1>
        <a href="{{ route('recibos.create') }}" class="btn btn-primary">+ Registrar recibo</a>
    </div>

    <div class="alert alert-info">
        📌 <strong>Solo registro/control.</strong> Los Recibos por Honorarios se <strong>emiten en el portal SUNAT SOL</strong>
        (o la app de SUNAT). Aquí llevas el control de lo emitido: montos, retención de renta (4ta categoría) y reportes.
    </div>

    <form method="GET" style="display:flex;gap:10px;align-items:flex-end;margin-bottom:16px">
        <div class="field" style="max-width:200px">
            <label>Periodo</label>
            <input type="month" name="mes" value="{{ $mes }}">
        </div>
        <button class="btn">Filtrar</button>
    </form>

    <div class="cards-grid">
        <div class="card stat">
            <div class="label">Renta bruta (periodo)</div>
            <div class="value">S/ {{ number_format((float) $totales['bruto'], 2) }}</div>
        </div>
        <div class="card stat">
            <div class="label">Retención de renta</div>
            <div class="value" style="color:var(--rojo)">S/ {{ number_format((float) $totales['retencion'], 2) }}</div>
        </div>
        <div class="card stat">
            <div class="label">Monto neto recibido</div>
            <div class="value" style="color:var(--verde)">S/ {{ number_format((float) $totales['neto'], 2) }}</div>
        </div>
    </div>

    <div class="card table-wrap">
        <table class="tabla">
            <thead>
                <tr><th>Recibo</th><th>Fecha</th><th>Cliente</th><th class="text-right">Bruto</th><th class="text-right">Retención</th><th class="text-right">Neto</th><th>Estado</th><th></th></tr>
            </thead>
            <tbody>
                @forelse($recibos as $r)
                    <tr>
                        <td class="mono">{{ $r->serie ? $r->serie.'-'.$r->numero : '—' }}</td>
                        <td>{{ $r->fecha_emision?->format('d/m/Y') }}</td>
                        <td>{{ $r->cliente_razon_social }}<br><span class="muted mono">{{ $r->cliente_numero_documento }}</span></td>
                        <td class="text-right">{{ number_format((float) $r->monto_bruto, 2) }}</td>
                        <td class="text-right">{{ number_format((float) $r->retencion_renta, 2) }}</td>
                        <td class="text-right">{{ number_format((float) $r->monto_neto, 2) }}</td>
                        <td><span class="badge {{ $r->estado === 'pagado' ? 'green' : ($r->estado === 'anulado' ? 'red' : 'gray') }}">{{ ucfirst($r->estado) }}</span></td>
                        <td class="text-right" style="white-space:nowrap">
                            <a href="{{ route('recibos.edit', $r) }}" class="btn btn-sm">Editar</a>
                            <form method="POST" action="{{ route('recibos.destroy', $r) }}" style="display:inline" onsubmit="return confirm('¿Eliminar recibo?')">
                                @csrf @method('DELETE')
                                <button class="btn btn-sm btn-danger">✕</button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="8" class="muted" style="text-align:center;padding:28px">Sin recibos en este periodo.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div style="margin-top:16px">{{ $recibos->links() }}</div>
@endsection