@extends('user.layouts.master')
@section('title', \App\Helpers\TranslationHelper::translate('Dashboard'))

@section('crumb')
    <x-bread-crumb :breadcrumbs="[['text' => \App\Helpers\TranslationHelper::translate('Statics')]]" :button="[]" :title="\App\Helpers\TranslationHelper::translate('Dashboard')">
    </x-bread-crumb>
@endsection

@push('admin_css')

<style>
    .card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.card:hover {
    transform: scale(1.02);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
}
</style>

@endpush

@section('content')

    <div id="kt_app_content" class="app-content flex-column-fluid">
        <!--begin::Content container-->
        <div id="kt_app_content_container" class="app-container container-fluid">
            <!--begin::Row-->
            <div class="row g-5 gx-xl-10 mb-5 mb-xl-10">
                <div class="col-12 mb-xl-10">

                    <div class="row gx-4 gy-4">

                        <!--begin::Col-->
                        {{-- <div class="col-md-6 col-lg-6 col-xl-6 mb-md-5 mb-xl-10"> --}}
                        <div class="col-md-4 mb-5">
                            <!--begin::Card widget 17-->
                            <div
                                class="card card-flush bgi-no-repeat bgi-size-contain bgi-position-x-end h-xl-100"  style=" background-color: rgb(164, 34, 73); color: #fff;">
                                <!--begin::Card body-->
                                <div class="card-body align-items-end mb-0 p-5">
                                    <!--begin::Info-->

                                    <div
                                        class="d-flex align-items-start justify-content-between mb-3">
                                        <div class="fw-bold px-3">
                                            <span class="fs-4 opacity-50 d-block">{{ \App\Helpers\TranslationHelper::translate('Purchases') }}</span>
                                            <span class="fs-2x fw-bold ">{{$totalPurchase}}<smallclass="fs-4"></small></span>
                                        </div>
                                        <div class="m-0 icon" style="background-color: #3974ff6e;">
                                            <i class="ki-solid ki-calendar-add  fs-3x"
                                               style="color: #8d929e;">
                                            </i>
                                        </div>
                                    </div>

                                    {{-- <div class="d-flex align-items-center  justify-content-between">
															<span class="badge badge-light-success fs-3  p-3">
																<i
                                                                    class="ki-duotone ki-arrow-up fs-4 text-success ms-n1"><span
                                                                        class="path1"></span><span
                                                                        class="path2"></span></i>
																9.2%
															</span>
                                    </div> --}}
                                    <!--end::Info-->
                                </div>
                                <!--end::Card body-->
                            </div>
                            <!--end::Card widget 17-->

                        </div>
                        <!--end::Col-->

                        <!--begin::Col-->
                        {{-- <div class="col-md-4 mb-5">
                            <!--begin::Card widget 17-->
                            <!--begin::List widget 26-->
                            <div
                                class="card card-flush bgi-no-repeat bgi-size-contain bgi-position-x-end h-xl-100" style=" background-color: rgb(164, 34, 73); color: #fff;">

                                <!--begin::Card body-->
                                <div class="card-body align-items-end mb-0 p-5">
                                    <!--begin::Info-->
                                    <div
                                        class="d-flex align-items-start justify-content-between mb-3">
                                        <div class="fw-bold px-3">
                                            <span class="fs-4 opacity-50 d-block">{{ \App\Helpers\TranslationHelper::translate('Cards') }}</span>
                                            <span class="fs-2x fw-bold ">{{$totalCard}}</span>
                                        </div>
                                        <div class="m-0 icon" style="background-color: #ffd5596e;">
                                            <i class="ki-duotone ki-shop fs-3x"
                                               style="color: #ac9140;">
                                                <span class="path1"></span>
                                                <span class="path2"></span>
                                                <span class="path3"></span>
                                                <span class="path4"></span>
                                                <span class="path5"></span>
                                            </i>
                                        </div>
                                    </div>
                                    <!--end::Info-->

                                </div>
                                <!--end::Card body-->
                            </div>

                        </div> --}}
                        <!--end::Col-->

                        <!--begin::Col-->
                        <div class="col-md-4 mb-5">
                            <!--begin::Card widget 17-->
                            <!--begin::List widget 26-->
                            <div
                                class="card card-flush bgi-no-repeat bgi-size-contain bgi-position-x-end h-xl-100" style=" background-color: rgb(164, 34, 73); color: #fff;">

                                <!--begin::Card body-->
                                <div class="card-body align-items-end mb-0 p-5">
                                    <!--begin::Info-->
                                    <div
                                        class="d-flex align-items-start justify-content-between mb-3">
                                        <div class="fw-bold px-3">
                                            <span class="fs-4 opacity-50 d-block">{{ \App\Helpers\TranslationHelper::translate('Stock Projects') }}</span>
                                            <span class="fs-2x fw-bold ">{{$totalStockProject}}</span>
                                        </div>
                                        <div class="m-0 icon" style="background-color: #ffd5596e;">
                                            <i class="ki-duotone ki-shop fs-3x"
                                               style="color: #ac9140;">
                                                <span class="path1"></span>
                                                <span class="path2"></span>
                                                <span class="path3"></span>
                                                <span class="path4"></span>
                                                <span class="path5"></span>
                                            </i>
                                        </div>
                                    </div>
                                    <!--end::Info-->

                                </div>
                                <!--end::Card body-->
                            </div>

                        </div>

                        {{-- </div> --}}
                        <!--end::Col-->

                    </div>
                </div>



            </div>
                                <!--end::Tap pane-->
                                <!--end::Table container-->
                            </div>
                            <!--end::Tab Content-->
                        </div>
                        <!--end: Card Body-->
                    </div>
                </div>
                <!--begin::Col-->

            </div>
            <!--end::Row-->
            <!--end::Content container-->
        </div>
        <!--end::Content-->
    </div>

@endsection

@push('admin_js')
<script src="https://cdn.amcharts.com/lib/5/index.js"></script>
<script src="https://cdn.amcharts.com/lib/5/xy.js"></script>
<script src="https://cdn.amcharts.com/lib/5/themes/Animated.js"></script>


@endpush