<div>
    {{-- Ini contoh modal uang kembalian --}}
    @if ($showReturnModal)
        <div class="modal fade show d-block" tabindex="-1" role="dialog" style="background: rgba(0,0,0,0.5);">
            <div class="modal-dialog modal-dialog-centered" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Input Uang Kembalian</h5>
                        <button type="button" class="close"
                            wire:click="$set('showReturnModal', false)">&times;</button>
                    </div>
                    <div class="modal-body">
                        <label>Masukkan jumlah uang kembalian:</label>
                        <input type="number" wire:model="returnedAmount" class="form-control"
                            placeholder="Contoh: 50000">
                        @error('returnedAmount')
                            <span class="text-danger">{{ $message }}</span>
                        @enderror
                    </div>
                    <div class="modal-footer">
                        <button type="button" wire:click="saveReturn" class="btn btn-primary">Simpan</button>
                        <button type="button" wire:click="$set('showReturnModal', false)"
                            class="btn btn-secondary">Batal</button>
                    </div>
                </div>
            </div>
        </div>
    @endif

    <table class="table table-striped">
        <thead>
            <tr>
                <th>No</th>
                <th>Nomor DO</th>
                <th>Biaya Solar</th>
                <th>Lembur</th>
                <th>Menginap</th>
                <th>Antrian</th>
                <th>Total</th>
                <th>Uang Saku</th>
                <th>Kembalian</th>

                <th>Status</th>
                <th>Action</th>
            </tr>
        </thead>
        <tbody>
            @foreach ($costs as $cost)
                <tr>
                    <td>{{ $loop->iteration }}</td>
                    <td>{{ $cost->trip->do_number }}</td>

                    <td>{{ $cost->fuel_cost }}</td>
                    <td>{{ $cost->lembur_cost }}</td>
                    <td>{{ $cost->menginap_cost }}</td>
                    <td>{{ $cost->antrian_cost }}</td>
                    <td>{{ $cost->total_cost }}</td>
                    <td>{{ $cost->uang_saku }}</td>
                    <td>{{ $cost->kembalian }}</td>

                    <td>{{ $cost->status }}</td>
                    <td>
                        <button class="btn btn-sm btn-success" wire:click="supirKembali({{ $cost->id }})">
                            <i class="ri-checkbox-circle-fill"></i>
                        </button>
                    </td>
                </tr>
            @endforeach
        </tbody>
    </table>

    {{ $costs->links() }}
</div>
