@extends('layouts.app')

@section('content')
<div class="container-wrapper">
    <nav aria-label="breadcrumb" class="mb-2">
        <ol class="breadcrumb mb-0 small text-uppercase fw-bold letter-spacing-1">
            <li class="breadcrumb-item"><a href="{{ route('dashboard') }}" class="text-decoration-none text-muted">Dashboard</a></li>
            <li class="breadcrumb-item"><a href="#" class="text-decoration-none text-muted">Accountant</a></li>
            <li class="breadcrumb-item active text-primary" aria-current="page">Currency Adjustments</li>
        </ol>
    </nav>

    <div class="d-flex justify-content-between align-items-center mb-4 px-3">
        <div>
            <h2 class="h3 font-weight-bold text-dark mb-1">Currency Adjustments</h2>
            <p class="text-muted small mb-0">Record exchange rate differences (Forex Gain/Loss).</p>
        </div>
        <a href="{{ route('accountant.currency-adjustments.create') }}" class="btn btn-primary shadow-sm rounded-3 px-4">
            <i class="fas fa-plus me-2"></i> New Adjustment
        </a>
    </div>

    <div class="card border-0 shadow-sm rounded-4 overflow-hidden mx-3">
        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0">
                <thead class="bg-light bg-opacity-50">
                    <tr>
                        <th class="ps-4 border-0 small fw-bold text-muted text-uppercase">Date</th>
                        <th class="border-0 small fw-bold text-muted text-uppercase">Currency</th>
                        <th class="border-0 small fw-bold text-muted text-uppercase">Exchange Rate</th>
                        <th class="border-0 small fw-bold text-muted text-uppercase">Gain / Loss</th>
                        <th class="border-0 small fw-bold text-muted text-uppercase">Journal</th>
                        <th class="text-end pe-4 border-0"></th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($adjustments as $adjustment)
                    <tr>
                        <td class="ps-4">
                            <span class="fw-bold text-dark">{{ date('d M Y', strtotime($adjustment->adjustment_date)) }}</span>
                        </td>
                        <td><span class="badge bg-light text-dark border">{{ $adjustment->currency }}</span></td>
                        <td>1 {{ $adjustment->currency }} = {{ number_format($adjustment->exchange_rate, 4) }}</td>
                        <td>
                            @if($adjustment->gain_loss_amount >= 0)
                                <span class="text-success fw-bold"><i class="fas fa-arrow-up me-1"></i> ${{ number_format($adjustment->gain_loss_amount, 2) }}</span>
                            @else
                                <span class="text-danger fw-bold"><i class="fas fa-arrow-down me-1"></i> -${{ number_format(abs($adjustment->gain_loss_amount), 2) }}</span>
                            @endif
                        </td>
                        <td>
                            @if($adjustment->journal_id)
                                <a href="{{ route('accountant.journals.index') }}?id={{ $adjustment->journal_id }}" class="btn btn-sm btn-light border text-primary small">
                                    <i class="fas fa-book me-1"></i> View Journal
                                </a>
                            @endif
                        </td>
                        <td class="text-end pe-4">
                            <button class="btn btn-sm btn-link text-muted"><i class="far fa-trash-alt"></i></button>
                        </td>
                    </tr>
                    @empty
                    <tr>
                        <td colspan="6" class="text-center py-5">
                            <div class="mb-3 opacity-25"><i class="fas fa-exchange-alt fa-3x"></i></div>
                            <h5 class="text-muted">No currency adjustments yet.</h5>
                        </td>
                    </tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection