  <!--start main wrapper-->
    <main class="main-wrapper">
        <div class="main-content">
            <div class="row">
                <div class="col-md-8 my-2">
                    <div class="d-flex align-items-center gap-2 mb-2">

                        <h3 class="fmon m-0 fw-bolder">Accounts Receivables</h3>
                    </div>
                </div>
                <div class="col-md-4 my-2 d-flex justify-content-end">
                    <button class="btn bg-white d-flex gap-5 align-items-center px-3 border-15">
                        Filter <img src="<?php echo base_url(); ?>assets/images/e.png " alt="" width="20px">
                    </button>

                </div>

            </div>
            <div class="row my-2">
                <div class="col-md-3 my-2">
                    <div class="card un-card     ">
                        <div class="card-body">
                            <a href="<?php echo base_url().'site/house'; ?>" class="d-flex gap-2 align-items-center">
                                <img src="<?php echo base_url(); ?>assets/images/house.png" alt="" width="50px">
                                <p class="ft4 fmon m-0">House/Units</p>

                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 my-2">
                    <div class="card un-card ">
                        <div class="card-body">
                            <a href="<?php echo base_url().'site/accountr'; ?>" class="d-flex gap-2 align-items-center">
                                <img src="<?php echo base_url(); ?>assets/images/accountrec.png" alt="" width="50px">
                                <p class="ft4 fmon">Account
                                    Receivables</p>

                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 my-2">
                    <div class="card un-card ">
                        <div class="card-body">
                            <a href="<?php echo base_url().'site/genbills'; ?>" class="d-flex gap-2 align-items-center">
                                <img src="<?php echo base_url(); ?>assets/images/vehile.png" alt="" width="50px">
                                <p class="ft4 fmon">Generated
                                    Bills </p>

                            </a>
                        </div>
                    </div>
                </div>
                <div class="col-md-3 my-2">
                    <div class="card un-card ">
                        <div class="card-body">
                            <a href="<?php echo base_url().'site/billhistory'; ?>" class="d-flex gap-3 align-items-center">
                                <img src="<?php echo base_url(); ?>assets/images/hb.png" alt="" width="50px">
                                <p class="ft4 fmon">History of
                                    Bills</p>

                            </a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row my-3">
                <div class="col-md-6 my-2">
                    <div class="card border-15">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div class="d-flex align-items-center gap-2">
                                    <img src="<?php echo base_url(); ?>assets/images/finan.png" alt="">
                                    <p class="fmon  ft1 m-0 text-black">Maintenance</p>
                                </div>
                                <button class="btn addBtn2 d-flex gap-2 b"><img src="<?php echo base_url(); ?>assets/images/megaIcons/aplu.png"
                                        alt=""> </button>
                            </div>
                            <div class="my-2">
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 my-2">
                    <div class="card border-15">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div class="d-flex align-items-center gap-2">
                                    <img src="<?php echo base_url(); ?>assets/images/manti.png" alt="">
                                    <p class="fmon  ft1 m-0 text-black">Fines/Interest</p>
                                </div>
                                <button class="btn addBtn2 d-flex gap-2 b"><img src="<?php echo base_url(); ?>assets/images/megaIcons/aplu.png"
                                        alt=""> </button>
                            </div>
                            <div class="my-2">
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 my-2">
                    <div class="card border-15">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div class="d-flex align-items-center gap-2">
                                    <img src="<?php echo base_url(); ?>assets/images/extr.png" alt="">
                                    <p class="fmon  ft1 m-0 text-black">Extraordinary</p>
                                </div>
                                <button class="btn addBtn2 d-flex gap-2 b"><img src="<?php echo base_url(); ?>assets/images/megaIcons/aplu.png"
                                        alt=""> </button>
                            </div>
                            <div class="my-2">
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-6 my-2">
                    <div class="card border-15">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div class="d-flex align-items-center gap-2">
                                    <img src="<?php echo base_url(); ?>assets/images/common.png" alt="">
                                    <p class="fmon  ft1 m-0 text-black">Common Areas</p>
                                </div>
                                <button class="btn addBtn2 d-flex gap-2 b"><img src="<?php echo base_url(); ?>assets/images/megaIcons/aplu.png"
                                        alt=""> </button>
                            </div>
                            <div class="my-2">
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                                <div class="my-2">
                                    <p class="ft3 fmon mb-0">House 93 Zone 5</p>
                                    <div class="d-flex gap-4">
                                        <p class="ft6">Status: <span class="ft7">Upcoming Maintenance</span> </p>
                                        <p class="ft6 bor-left">Date: <span class="ft7">21 May, 2024 </span> </p>
                                        <p class="ft6 bor-left">Fine: <span class="ft7">$250.00 </span> </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>


    </main>
    <!--end main wrapper-->
