
<!-- Start the content for this page -->
<?= startSection('dashboard') ?> 
	<div class="row justify-content-center mb-3">
        <div class="col-11">
            <div class="row align-items-center mb-2">
                <div class="col">
                    <h2 class="h5 page-title">Welcome!</h2>
                </div>
            </div> 

            <div class="row">
                <!-- Add Donations Widget -->
                <div class="col-md-6 col-xl-3 mb-4">
                    <a href="<?=$basePath?>/events" class="text-decoration-none">
                        <div class="card shadow-lg bg-light text-black card-floating">
                            <div class="card-body">
                                <div class="row align-items-center">
                                    <div class="col-3 text-center">
                                        <span class="circle circle-sm bg-primary-light">
                                        <i class="fe fe-16 fe-plus text-white mb-0"></i>
                                        </span>
                                    </div>
                                    <div class="col-9">
                                        <h5 class="card-title text-black">Events Donations</h5>
                                        <p class="card-text">List of events for donation</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>

                <!-- List Donations Widget -->
                <div class="col-md-6 col-xl-3 mb-4">
                    <a href="<?=$basePath?>/request" class="text-decoration-none">
                        <div class="card shadow-lg bg-light text-black card-floating">
                            <div class="card-body">
                                <div class="row align-items-center">
                                    <div class="col-3 text-center">
                                        <span class="circle circle-sm bg-success-light">
                                        <i class="fe fe-16 fe-list text-white mb-0"></i>
                                        </span>
                                    </div>
                                    <div class="col-9">
                                        <h5 class="card-title text-black">Request Donations</h5>
                                        <p class="card-text">List of requesting for donation</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>

                <!-- Manage Users Widget -->
                <div class="col-md-6 col-xl-3 mb-4">
                    <a href="<?=$basePath?>/request-approval" class="text-decoration-none">
                        <div class="card shadow-lg bg-light text-black card-floating">
                            <div class="card-body">
                                <div class="row align-items-center">
                                    <div class="col-3 text-center">
                                        <span class="circle circle-sm bg-warning-light">
                                        <i class="fe fe-16 fe-users text-white mb-0"></i>
                                        </span>
                                    </div>
                                    <div class="col-9">
                                        <h5 class="card-title text-black">Request Approval</h5>
                                        <p class="card-text">List of request for approval</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>

                <!-- Reports Widget -->
                <div class="col-md-6 col-xl-3 mb-4">
                    <a href="#" class="text-decoration-none">
                        <div class="card shadow-lg bg-light text-black card-floating">
                            <div class="card-body">
                                <div class="row align-items-center">
                                    <div class="col-3 text-center">
                                        <span class="circle circle-sm bg-danger-light">
                                        <i class="fe fe-16 fe-file text-white mb-0"></i>
                                        </span>
                                    </div>
                                    <div class="col-9">
                                        <h5 class="card-title text-black">Reports</h5>
                                        <p class="card-text">Generate donation reports</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
<?= endSection() ?> 