@extends('layouts.app')
@section('content')
<section class="content-header pb-0">
    <div class="container-fluid">
        <div class="row align-items-center mb-3">
            <div class="col-sm-6">
                <h4 class="font-weight-bold mb-0"><i class="fa fa-handshake text-primary mr-2"></i> طلبات الإلغاء  (كاش)</h4>
            </div>
            <div class="col-sm-6 text-right">
                <span class="text-muted small">تتطلب هذه الطلبات موافقة الطرفين (المالك والزبون) لرد العربون أو قيم الحجز.</span>
            </div>
        </div>
    </div>
</section>
<div class="content px-3 mt-2">
    @include('flash::message')
    <!-- KPI Summary Cards -->
    @if(isset($kpis))
    <div class="row mb-4">
        <!-- Total Pending -->
        <div class="col-md-4 col-sm-6 mb-3">
            <div class="card kpi-card h-100" style="border-bottom: 4px solid #ffc107;">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 font-weight-bold" style="font-size: 13px;">طلبات معلقة (بانتظار الموافقة)</p>
                            <h3 class="font-weight-bold text-warning mb-0">{{ $kpis['pending_count'] }} <small class="text-sm text-muted">طلب</small></h3>
                        </div>
                        <div class="kpi-icon badge-soft-warning text-warning"><i class="fa fa-hourglass-half"></i></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Total Refund Amount -->
        <div class="col-md-4 col-sm-6 mb-3">
            <div class="card kpi-card h-100" style="border-bottom: 4px solid #dc3545;">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 font-weight-bold" style="font-size: 13px;">قيمة المطالبات للإرجاع (للمعلقة)</p>
                            <h3 class="font-weight-bold text-danger mb-0">{{ number_format($kpis['pending_amount'], 2) }} <small class="text-sm text-muted">د.ل</small></h3>
                        </div>
                        <div class="kpi-icon badge-soft-danger text-danger"><i class="fa fa-money-bill-wave"></i></div>
                    </div>
                </div>
            </div>
        </div>
        <!-- Total Approved -->
        <div class="col-md-4 col-sm-6 mb-3">
            <div class="card kpi-card h-100" style="border-bottom: 4px solid #28a745;">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 font-weight-bold" style="font-size: 13px;">الطلبات المكتملة والموافق عليها</p>
                            <h3 class="font-weight-bold text-success mb-0">{{ $kpis['approved_count'] }} <small class="text-sm text-muted">طلب</small></h3>
                        </div>
                        <div class="kpi-icon badge-soft-success text-success"><i class="fa fa-check-circle"></i></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    @endif
    <!-- Filters -->
    @include('tbl_cancel_request.filter')
    <!-- Data Table -->
    <div class="card border-0 shadow-sm" style="border-radius: 12px;">
        <div class="card-body p-0">
            <div class="table-responsive">
                @include('tbl_cancel_request.table')
            </div>
        </div>
    </div>
</div>
@endsection