@extends('backend.template-admin')
@section('content')
    <section class="mb-3">
        <div class="grid grid-cols-4 grid-rows-1 gap-4">
            <div class="col-span-6 md:col-span-2  shadow-md h-24 rounded-tr-2xl rounded-tl-2xl rounded-br-2xl p-4 ">
                <div class="flex">
                    <div>
                        <h1 class="text-base font-medium text-orange-500">RM</h1>
                        <h1 class="mt-2 text-orange-600">Uang Masuk</h1>
                    </div>
                    <div class="ms-auto mt-auto px-5">
                        <h1 class="text-3xl font-semibold text-orange-700">RM.{{ number_format($kemasukkan, 2) }}</h1>
                    </div>
                </div>
            </div>
            <div
                class="col-span-6 md:col-span-2  shadow-md h-24 rounded-tr-2xl rounded-tl-2xl rounded-br-2xl p-4  md:col-start-3">
                <div class="flex">
                    <div>
                        <h1 class="text-base font-medium text-orange-500">RM</h1>
                        <h1 class="mt-2 text-orange-600">Uang Keluar</h1>
                    </div>
                    <div class="ms-auto mt-auto px-5">
                        <h1 class="text-3xl font-semibold text-orange-700">RM.{{ number_format($pengeluaran, 2) }}</h1>
                    </div>
                </div>
            </div>

        </div>

    </section>
    <div class="flex items-center justify-center mb-3 rounde border-gray-200  p-4 shadow-md rounded-2xl ">
        <div class="w-full p-2">
            {!! $dashboardChart->container() !!}
        </div>
    </div>
    <script src="{{ $dashboardChart->cdn() }}"></script>

    {{ $dashboardChart->script() }}
@endsection