@extends('layouts.app')
@section('title', 'Historial de Caja')
@section('content')
<div class="container-fluid py-4">

    <div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-2">
        <div>
            <h4 class="fw-bold mb-0">💰 Historial de Turnos de Caja</h4>
            <small class="text-muted">Auditoría de aperturas y cierres por cajero</small>
        </div>
        <div class="d-flex gap-2 flex-wrap align-items-end">
            <form action="{{ route('cash_registers.index') }}" method="GET" class="d-flex gap-2 align-items-end flex-wrap">
                <div>
                    <label class="form-label small fw-semibold mb-1">Desde</label>
                    <input type="date" name="desde" value="{{ request('desde') }}" class="form-control form-control-sm">
                </div>
                <div>
                    <label class="form-label small fw-semibold mb-1">Hasta</label>
                    <input type="date" name="hasta" value="{{ request('hasta') }}" class="form-control form-control-sm">
                </div>
                <button type="submit" class="btn btn-sm btn-outline-secondary fw-bold"><i class="bi bi-funnel-fill me-1"></i> Filtrar</button>
                @if(request('desde') || request('hasta'))
                    <a href="{{ route('cash_registers.index') }}" class="btn btn-sm btn-outline-danger" title="Quitar filtro"><i class="bi bi-x-lg"></i></a>
                @endif
            </form>
            <a href="{{ route('cash_registers.create') }}" class="btn fw-bold text-white" style="background:#f97316;">
                <i class="bi bi-plus-circle me-1"></i> Abrir Turno
            </a>
        </div>
    </div>

    <div class="card border-0 shadow-sm" style="border-radius:16px;overflow:hidden;">
        <div class="card-body p-0">
            <div class="table-responsive">
                <table class="table table-hover align-middle mb-0">
                    <thead style="background:#1e1b3a;">
                        <tr>
                            <th class="px-4 py-3 text-white fw-semibold" style="font-size:.75rem;">#</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">CAJERO</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">APERTURA</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">CIERRE</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">APERTURA S/</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">ESPERADO</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">REAL</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">DIFERENCIA</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">ESTADO</th>
                            <th class="py-3 text-white fw-semibold" style="font-size:.75rem;">ACCIONES</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($registers as $reg)
                        @php $diff = $reg->difference ?? 0; @endphp
                        <tr>
                            <td class="px-4 py-3">
                                <span class="fw-bold text-muted">#{{ $reg->id }}</span>
                            </td>
                            <td class="py-3">
                                <div class="d-flex align-items-center gap-2">
                                    <div class="rounded-circle d-flex align-items-center justify-content-center text-white fw-bold"
                                         style="width:32px;height:32px;font-size:13px;background:#6366f1;flex-shrink:0;">
                                        {{ substr($reg->user->name ?? 'U', 0, 1) }}
                                    </div>
                                    <span class="fw-semibold" style="font-size:.85rem;">{{ $reg->user->name ?? '-' }}</span>
                                </div>
                            </td>
                            <td class="py-3">
                                <span class="d-block fw-semibold" style="font-size:.82rem;">{{ $reg->opening_time->format('d/m/Y') }}</span>
                                <span class="text-muted" style="font-size:.75rem;">{{ $reg->opening_time->format('H:i') }}</span>
                            </td>
                            <td class="py-3">
                                @if($reg->closing_time)
                                    <span class="d-block fw-semibold" style="font-size:.82rem;">{{ $reg->closing_time->format('d/m/Y') }}</span>
                                    <span class="text-muted" style="font-size:.75rem;">{{ $reg->closing_time->format('H:i') }}</span>
                                @else
                                    <span class="text-muted">—</span>
                                @endif
                            </td>
                            <td class="py-3 fw-bold" style="font-size:.85rem;">S/ {{ number_format($reg->opening_amount, 2) }}</td>
                            <td class="py-3 fw-bold text-primary" style="font-size:.85rem;">
                                S/ {{ number_format($reg->expected_amount ?? $reg->opening_amount, 2) }}
                            </td>
                            <td class="py-3 fw-bold" style="font-size:.85rem;">
                                @if($reg->status === 'closed')
                                    S/ {{ number_format($reg->closing_amount, 2) }}
                                @else <span class="text-muted">—</span> @endif
                            </td>
                            <td class="py-3 fw-bold" style="font-size:.85rem;">
                                @if($reg->status === 'closed')
                                    <span class="{{ $diff >= 0 ? 'text-success' : 'text-danger' }}">
                                        {{ $diff >= 0 ? '+' : '' }}S/ {{ number_format($diff, 2) }}
                                    </span>
                                @else <span class="text-muted">—</span> @endif
                            </td>
                            <td class="py-3">
                                @if($reg->status === 'open')
                                    <span class="badge px-3 py-2 rounded-pill fw-bold" style="background:#fff3cd;color:#856404;font-size:.72rem;">
                                        <i class="bi bi-door-open me-1"></i> Abierta
                                    </span>
                                @else
                                    <span class="badge px-3 py-2 rounded-pill fw-bold" style="background:#f0fdf4;color:#166534;font-size:.72rem;">
                                        <i class="bi bi-check-circle me-1"></i> Cerrada
                                    </span>
                                @endif
                            </td>
                            <td class="py-3">
                                <div class="d-flex gap-1">
                                    <a href="{{ route('cash_registers.report', $reg->id) }}"
                                       class="btn btn-sm fw-bold" style="background:#eef2ff;color:#6366f1;border:1px solid #c7d2fe;" title="Ver Reporte">
                                        <i class="bi bi-bar-chart-fill"></i>
                                    </a>
                                    <a href="{{ route('cash_registers.export_pdf', $reg->id) }}" target="_blank"
                                       class="btn btn-sm btn-danger fw-bold" title="Imprimir PDF">
                                        <i class="bi bi-file-earmark-pdf"></i>
                                    </a>
                                    <a href="{{ route('cash_registers.export_excel', $reg->id) }}"
                                       class="btn btn-sm fw-bold text-white" style="background:#1d6f42;" title="Exportar Excel">
                                        <i class="bi bi-file-earmark-excel"></i>
                                    </a>
                                </div>
                            </td>
                        </tr>
                        @empty
                        <tr>
                            <td colspan="10" class="text-center py-5 text-muted">
                                <i class="bi bi-inbox fs-1 d-block mb-2"></i>
                                No hay turnos de caja registrados
                            </td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
        @if($registers->hasPages())
        <div class="card-footer bg-white border-top px-4 py-3">
            {{ $registers->links() }}
        </div>
        @endif
    </div>
</div>
@endsection