@extends('admin/layouts/app')

@section('page-title')
    <title>Dashboard | Simple Admission</title>

    <link href="{{ asset('plugins/custom/fullcalendar/fullcalendar.bundle.css') }}" rel="stylesheet" type="text/css"/>
    <link href="{{ asset('plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css"/>
@endsection

@section('page-breadcrumb')
    <div data-kt-swapper="true" data-kt-swapper-mode="prepend" data-kt-swapper-parent="{default: '#kt_content_container', 'lg': '#kt_toolbar_container'}" class="page-title d-flex align-items-center flex-wrap me-3 mb-5 mb-lg-0">
        <!--begin::Title-->
        <h1 class="d-flex align-items-center text-dark fw-bolder fs-3 my-1">Dashboard</h1>
        <!--end::Title-->
        <!--begin::Separator-->
        <span class="h-20px border-gray-300 border-start mx-4"></span>
        <!--end::Separator-->
        <!--begin::Breadcrumb-->
        <ul class="breadcrumb breadcrumb-separatorless fw-bold fs-7 my-1">
            <!--begin::Item-->
            <li class="breadcrumb-item text-muted">
                <a href="{{route('dashboard')}}" class="text-muted text-hover-primary">Dashboard</a>
            </li>
        </ul>
        <!--end::Breadcrumb-->
    </div>
@endsection

@section('main-content')
    <div class="post d-flex flex-column-fluid" id="kt_post">
        <!--begin::Container-->
        <div id="kt_content_container" class="container-xxl">
            <!--begin::About card-->
            {{--		<div class="card">--}}
            {{--			<!--begin::Body-->--}}
            {{--			<div class="card-body p-5 px-lg-19 py-lg-16">--}}
            {{--				<p style="margin-bottom: 0px;font-size: 30px;font-weight: 300;">Welcome, {{$name ? $name : ''}}</p>--}}
            {{--			</div>--}}
            {{--			<!--end::Body-->--}}
            {{--		</div>--}}

            <!--begin::Post-->
            <div class="content flex-column-fluid" id="kt_content">
                <div class="row g-4 mb-6">

                    @if(Auth::user()->role->role->role_type == 1)
                        <div class="col-xl-3 col-md-4 col-sm-6">
                            <div class="card">
                                <div class="card-body">
                                    <div class="d-flex align-items-center">
                                        <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                            <i class="las la-user text-primary"></i>
                                        </div>
                                        <div class="ms-5">
                                            <p class="fs-14 text-cs-gray mb-0">Total Institute</p>
                                            <p class="fs-14 text-cs-black mb-0">
                                                {{ $totalInstitute }}

                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif

                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Total Course</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{$totalInsCourse}}
                                            @else
                                                {{ $totalCourse }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>


                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Total Student</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $totalInsStudent }}
                                            @else
                                                {{ $totalStudent }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>


                    @if(Auth::user()->role->role->role_type == 1)
                        <div class="col-xl-3 col-md-4 col-sm-6">
                            <div class="card">
                                <div class="card-body">
                                    <div class="d-flex align-items-center">
                                        <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                            <i class="las la-user text-primary"></i>
                                        </div>
                                        <div class="ms-5">
                                            <p class="fs-14 text-cs-gray mb-0">New Student(7 days)</p>
                                            <p class="fs-14 text-cs-black mb-0">
                                                {{ $last7DaysStudent }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif

                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Total Application</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $totalInsCourseApplied }}
                                            @else
                                                {{ $totalCourseApplied }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">New Application(7 Days)</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $totalInsLast7daysApplication }}
                                            @else
                                                {{ $totalLast7daysApplication }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    {{--                    <div class="col-xl-3 col-md-4 col-sm-6">--}}
                    {{--                        <div class="card">--}}
                    {{--                            <div class="card-body">--}}
                    {{--                                <div class="d-flex align-items-center">--}}
                    {{--                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">--}}
                    {{--                                        <i class="las la-user text-primary"></i>--}}
                    {{--                                    </div>--}}
                    {{--                                    <div class="ms-5">--}}
                    {{--                                        <p class="fs-14 text-cs-gray mb-0">Last 7 Days Application</p>--}}
                    {{--                                        <p class="fs-14 text-cs-black mb-0">--}}
                    {{--                                            @if(Auth::user()->role->role->role_type == 2)--}}
                    {{--                                                {{ $totalInsLast7daysApplication }}--}}
                    {{--                                            @else--}}
                    {{--                                                {{ $totalLast7daysApplication }}--}}
                    {{--                                            @endif--}}
                    {{--                                        </p>--}}
                    {{--                                    </div>--}}
                    {{--                                </div>--}}
                    {{--                            </div>--}}
                    {{--                        </div>--}}
                    {{--                    </div>--}}
                    {{--                    <div class="col-xl-3 col-md-4 col-sm-6">--}}
                    {{--                        <div class="card">--}}
                    {{--                            <div class="card-body">--}}
                    {{--                                <div class="d-flex align-items-center">--}}
                    {{--                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">--}}
                    {{--                                        <i class="las la-user text-primary"></i>--}}
                    {{--                                    </div>--}}
                    {{--                                    <div class="ms-5">--}}
                    {{--                                        <p class="fs-14 text-cs-gray mb-0">Due Application</p>--}}
                    {{--                                        <p class="fs-14 text-cs-black mb-0">10</p>--}}
                    {{--                                    </div>--}}
                    {{--                                </div>--}}
                    {{--                            </div>--}}
                    {{--                        </div>--}}
                    {{--                    </div>--}}

                    {{--                    <div class="col-xl-3 col-md-4 col-sm-6">--}}
                    {{--                        <div class="card">--}}
                    {{--                            <div class="card-body">--}}
                    {{--                                <div class="d-flex align-items-center">--}}
                    {{--                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">--}}
                    {{--                                        <i class="las la-user text-primary"></i>--}}
                    {{--                                    </div>--}}
                    {{--                                    <div class="ms-5">--}}
                    {{--                                        <p class="fs-14 text-cs-gray mb-0">Total Business</p>--}}
                    {{--                                        <p class="fs-14 text-cs-black mb-0">5000</p>--}}
                    {{--                                    </div>--}}
                    {{--                                </div>--}}
                    {{--                            </div>--}}
                    {{--                        </div>--}}
                    {{--                    </div>--}}

                        @if(Auth::user()->role->role->role_type == 1)
                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Pending Application</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                                {{ $totalPendingApplication }}
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                        @endif

                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Successful Application</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $successInsApplication }}
                                            @else
                                                {{ $successApplication }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                    @if(Auth::user()->role->role->role_type == 1)
                        <div class="col-xl-3 col-md-4 col-sm-6">
                            <div class="card">
                                <div class="card-body">
                                    <div class="d-flex align-items-center">
                                        <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                            <i class="las la-user text-primary"></i>
                                        </div>
                                        <div class="ms-5">
                                            <p class="fs-14 text-cs-gray mb-0">Pending Leads</p>
                                            <p class="fs-14 text-cs-black mb-0">
                                                {{ $pendingLeads }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endif
                    {{--                    <div class="col-xl-3 col-md-4 col-sm-6">--}}
                    {{--                        <div class="card">--}}
                    {{--                            <div class="card-body">--}}
                    {{--                                <div class="d-flex align-items-center">--}}
                    {{--                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">--}}
                    {{--                                        <i class="las la-user text-primary"></i>--}}
                    {{--                                    </div>--}}
                    {{--                                    <div class="ms-5">--}}
                    {{--                                        <p class="fs-14 text-cs-gray mb-0">Hold Application</p>--}}
                    {{--                                        <p class="fs-14 text-cs-black mb-0">10</p>--}}
                    {{--                                    </div>--}}
                    {{--                                </div>--}}
                    {{--                            </div>--}}
                    {{--                        </div>--}}
                    {{--                    </div>--}}


                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Questions & Answers</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $totalInsQA }}
                                            @else
                                                {{ $totalQA }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Reviews</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $totalInsReview }}
                                            @else
                                                {{ $totalReview }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-xl-3 col-md-4 col-sm-6">
                        <div class="card">
                            <div class="card-body">
                                <div class="d-flex align-items-center">
                                    <div class="symbol symbol-circle bg-primary bg-opacity-25 d-flex align-items-center justify-content-center" style="width: 28px; height: 28px">
                                        <i class="las la-user text-primary"></i>
                                    </div>
                                    <div class="ms-5">
                                        <p class="fs-14 text-cs-gray mb-0">Followers</p>
                                        <p class="fs-14 text-cs-black mb-0">
                                            @if(Auth::user()->role->role->role_type == 2)
                                                {{ $totalInsFollowers }}
                                            @else
                                                {{ $totalFollowers }}
                                            @endif
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row g-4 mb-6">
                    <div class="col-lg-6">
                        <div class="card">
                            <div class="card-header border-0">
                                <h3 class="card-title">Location</h3>
                                <div class="card-toolbar">
                                    <button class="btn btn-sm btn-light-primary">View</button>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="chartdiv" id="chartdiv" style="height: 300px; width: 100%;"></div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6">
                        <div class="card">
                            <div class="card-header border-0">
                                <h3 class="card-title">Gender</h3>
                                <div class="card-toolbar">
                                    <button class="btn btn-sm btn-light-primary">View</button>
                                </div>
                            </div>
                            <div class="card-body">
                                <div class="genderChart" id="genderChart" style="height: 300px; width: 100%;"></div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--begin::Card-->
                <div class="card">
                    <!--begin::Card header-->
                    <div class="card-header">
                        <h2 class="card-title fw-bold">Calendar</h2>
                        <div class="card-toolbar">
                            <button class="btn btn-flex btn-primary d-none" data-kt-calendar="add">
                                <!--begin::Svg Icon | path: icons/duotune/arrows/arr075.svg-->
                                <span class="svg-icon svg-icon-2">
												<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
													<rect opacity="0.5" x="11.364" y="20.364" width="16" height="2" rx="1" transform="rotate(-90 11.364 20.364)" fill="currentColor"/>
													<rect x="4.36396" y="11.364" width="16" height="2" rx="1" fill="currentColor"/>
												</svg>
											</span>
                                <!--end::Svg Icon-->Add Event
                            </button>
                        </div>
                    </div>
                    <!--end::Card header-->
                    <!--begin::Card body-->
                    <div class="card-body">
                        <!--begin::Calendar-->
                        <div id="kt_calendar_app"></div>
                        <!--end::Calendar-->
                    </div>
                    <!--end::Card body-->
                </div>
                <!--end::Card-->
                <!--begin::Modals-->
                <!--begin::Modal - New Product-->
                <div class="modal fade" id="kt_modal_add_event" tabindex="-1" aria-hidden="true">
                    <!--begin::Modal dialog-->
                    <div class="modal-dialog modal-dialog-centered mw-650px">
                        <!--begin::Modal content-->
                        <div class="modal-content">
                            <!--begin::Form-->
                            <form class="form" action="#" id="kt_modal_add_event_form">
                                <!--begin::Modal header-->
                                <div class="modal-header">
                                    <!--begin::Modal title-->
                                    <h2 class="fw-bold" data-kt-calendar="title">Add Event</h2>
                                    <!--end::Modal title-->
                                    <!--begin::Close-->
                                    <div class="btn btn-icon btn-sm btn-active-icon-primary" id="kt_modal_add_event_close">
                                        <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                        <span class="svg-icon svg-icon-1">
															<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
																<rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="currentColor"/>
																<rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="currentColor"/>
															</svg>
														</span>
                                        <!--end::Svg Icon-->
                                    </div>
                                    <!--end::Close-->
                                </div>
                                <!--end::Modal header-->
                                <!--begin::Modal body-->
                                <div class="modal-body py-10 px-lg-17">
                                    <!--begin::Input group-->
                                    <div class="fv-row mb-9">
                                        <!--begin::Label-->
                                        <label class="fs-6 fw-semibold required mb-2">Event Name</label>
                                        <!--end::Label-->
                                        <!--begin::Input-->
                                        <input type="text" class="form-control form-control-solid" placeholder="" name="calendar_event_name"/>
                                        <!--end::Input-->
                                    </div>
                                    <!--end::Input group-->
                                    <!--begin::Input group-->
                                    <div class="fv-row mb-9">
                                        <!--begin::Label-->
                                        <label class="fs-6 fw-semibold mb-2">Event Description</label>
                                        <!--end::Label-->
                                        <!--begin::Input-->
                                        <input type="text" class="form-control form-control-solid" placeholder="" name="calendar_event_description"/>
                                        <!--end::Input-->
                                    </div>
                                    <!--end::Input group-->
                                    <!--begin::Input group-->
                                    <div class="fv-row mb-9">
                                        <!--begin::Label-->
                                        <label class="fs-6 fw-semibold mb-2">Event Location</label>
                                        <!--end::Label-->
                                        <!--begin::Input-->
                                        <input type="text" class="form-control form-control-solid" placeholder="" name="calendar_event_location"/>
                                        <!--end::Input-->
                                    </div>
                                    <!--end::Input group-->
                                    <!--begin::Input group-->
                                    <div class="fv-row mb-9">
                                        <!--begin::Checkbox-->
                                        <label class="form-check form-check-custom form-check-solid">
                                            <input class="form-check-input" type="checkbox" value="" id="kt_calendar_datepicker_allday"/>
                                            <span class="form-check-label fw-semibold" for="kt_calendar_datepicker_allday">All Day</span>
                                        </label>
                                        <!--end::Checkbox-->
                                    </div>
                                    <!--end::Input group-->
                                    <!--begin::Input group-->
                                    <div class="row row-cols-lg-2 g-10">
                                        <div class="col">
                                            <div class="fv-row mb-9">
                                                <!--begin::Label-->
                                                <label class="fs-6 fw-semibold mb-2 required">Event Start Date</label>
                                                <!--end::Label-->
                                                <!--begin::Input-->
                                                <input class="form-control form-control-solid" name="calendar_event_start_date" placeholder="Pick a start date" id="kt_calendar_datepicker_start_date"/>
                                                <!--end::Input-->
                                            </div>
                                        </div>
                                        <div class="col" data-kt-calendar="datepicker">
                                            <div class="fv-row mb-9">
                                                <!--begin::Label-->
                                                <label class="fs-6 fw-semibold mb-2">Event Start Time</label>
                                                <!--end::Label-->
                                                <!--begin::Input-->
                                                <input class="form-control form-control-solid" name="calendar_event_start_time" placeholder="Pick a start time" id="kt_calendar_datepicker_start_time"/>
                                                <!--end::Input-->
                                            </div>
                                        </div>
                                    </div>
                                    <!--end::Input group-->
                                    <!--begin::Input group-->
                                    <div class="row row-cols-lg-2 g-10">
                                        <div class="col">
                                            <div class="fv-row mb-9">
                                                <!--begin::Label-->
                                                <label class="fs-6 fw-semibold mb-2 required">Event End Date</label>
                                                <!--end::Label-->
                                                <!--begin::Input-->
                                                <input class="form-control form-control-solid" name="calendar_event_end_date" placeholder="Pick a end date" id="kt_calendar_datepicker_end_date"/>
                                                <!--end::Input-->
                                            </div>
                                        </div>
                                        <div class="col" data-kt-calendar="datepicker">
                                            <div class="fv-row mb-9">
                                                <!--begin::Label-->
                                                <label class="fs-6 fw-semibold mb-2">Event End Time</label>
                                                <!--end::Label-->
                                                <!--begin::Input-->
                                                <input class="form-control form-control-solid" name="calendar_event_end_time" placeholder="Pick a end time" id="kt_calendar_datepicker_end_time"/>
                                                <!--end::Input-->
                                            </div>
                                        </div>
                                    </div>
                                    <!--end::Input group-->
                                </div>
                                <!--end::Modal body-->
                                <!--begin::Modal footer-->
                                <div class="modal-footer flex-center">
                                    <!--begin::Button-->
                                    <button type="reset" id="kt_modal_add_event_cancel" class="btn btn-light me-3">Cancel</button>
                                    <!--end::Button-->
                                    <!--begin::Button-->
                                    <button type="button" id="kt_modal_add_event_submit" class="btn btn-primary">
                                        <span class="indicator-label">Submit</span>
                                        <span class="indicator-progress">Please wait...
														<span class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
                                    </button>
                                    <!--end::Button-->
                                </div>
                                <!--end::Modal footer-->
                            </form>
                            <!--end::Form-->
                        </div>
                    </div>
                </div>
                <!--end::Modal - New Product-->
                <!--begin::Modal - New Product-->
                <div class="modal fade" id="kt_modal_view_event" tabindex="-1" aria-hidden="true">
                    <!--begin::Modal dialog-->
                    <div class="modal-dialog modal-dialog-centered mw-650px">
                        <!--begin::Modal content-->
                        <div class="modal-content">
                            <!--begin::Modal header-->
                            <div class="modal-header border-0 justify-content-end">
                                <!--begin::Close-->
                                <div class="btn btn-icon btn-sm btn-color-gray-500 btn-active-icon-primary" data-bs-toggle="tooltip" title="Hide Event" data-bs-dismiss="modal">
                                    <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                    <span class="svg-icon svg-icon-1">
														<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
															<rect opacity="0.5" x="6" y="17.3137" width="16" height="2" rx="1" transform="rotate(-45 6 17.3137)" fill="currentColor"/>
															<rect x="7.41422" y="6" width="16" height="2" rx="1" transform="rotate(45 7.41422 6)" fill="currentColor"/>
														</svg>
													</span>
                                    <!--end::Svg Icon-->
                                </div>
                                <!--end::Close-->
                            </div>
                            <!--end::Modal header-->
                            <!--begin::Modal body-->
                            <div class="modal-body pt-0 pb-20 px-lg-17">
                                <!--begin::Row-->
                                <div class="d-flex">
                                    <!--begin::Icon-->
                                    <!--begin::Svg Icon | path: icons/duotune/general/gen014.svg-->
                                    <span class="svg-icon svg-icon-1 svg-icon-muted me-5">
														<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
															<path opacity="0.3" d="M21 22H3C2.4 22 2 21.6 2 21V5C2 4.4 2.4 4 3 4H21C21.6 4 22 4.4 22 5V21C22 21.6 21.6 22 21 22Z" fill="currentColor"/>
															<path d="M6 6C5.4 6 5 5.6 5 5V3C5 2.4 5.4 2 6 2C6.6 2 7 2.4 7 3V5C7 5.6 6.6 6 6 6ZM11 5V3C11 2.4 10.6 2 10 2C9.4 2 9 2.4 9 3V5C9 5.6 9.4 6 10 6C10.6 6 11 5.6 11 5ZM15 5V3C15 2.4 14.6 2 14 2C13.4 2 13 2.4 13 3V5C13 5.6 13.4 6 14 6C14.6 6 15 5.6 15 5ZM19 5V3C19 2.4 18.6 2 18 2C17.4 2 17 2.4 17 3V5C17 5.6 17.4 6 18 6C18.6 6 19 5.6 19 5Z" fill="currentColor"/>
															<path
                                                                d="M8.8 13.1C9.2 13.1 9.5 13 9.7 12.8C9.9 12.6 10.1 12.3 10.1 11.9C10.1 11.6 10 11.3 9.8 11.1C9.6 10.9 9.3 10.8 9 10.8C8.8 10.8 8.59999 10.8 8.39999 10.9C8.19999 11 8.1 11.1 8 11.2C7.9 11.3 7.8 11.4 7.7 11.6C7.6 11.8 7.5 11.9 7.5 12.1C7.5 12.2 7.4 12.2 7.3 12.3C7.2 12.4 7.09999 12.4 6.89999 12.4C6.69999 12.4 6.6 12.3 6.5 12.2C6.4 12.1 6.3 11.9 6.3 11.7C6.3 11.5 6.4 11.3 6.5 11.1C6.6 10.9 6.8 10.7 7 10.5C7.2 10.3 7.49999 10.1 7.89999 10C8.29999 9.90003 8.60001 9.80003 9.10001 9.80003C9.50001 9.80003 9.80001 9.90003 10.1 10C10.4 10.1 10.7 10.3 10.9 10.4C11.1 10.5 11.3 10.8 11.4 11.1C11.5 11.4 11.6 11.6 11.6 11.9C11.6 12.3 11.5 12.6 11.3 12.9C11.1 13.2 10.9 13.5 10.6 13.7C10.9 13.9 11.2 14.1 11.4 14.3C11.6 14.5 11.8 14.7 11.9 15C12 15.3 12.1 15.5 12.1 15.8C12.1 16.2 12 16.5 11.9 16.8C11.8 17.1 11.5 17.4 11.3 17.7C11.1 18 10.7 18.2 10.3 18.3C9.9 18.4 9.5 18.5 9 18.5C8.5 18.5 8.1 18.4 7.7 18.2C7.3 18 7 17.8 6.8 17.6C6.6 17.4 6.4 17.1 6.3 16.8C6.2 16.5 6.10001 16.3 6.10001 16.1C6.10001 15.9 6.2 15.7 6.3 15.6C6.4 15.5 6.6 15.4 6.8 15.4C6.9 15.4 7.00001 15.4 7.10001 15.5C7.20001 15.6 7.3 15.6 7.3 15.7C7.5 16.2 7.7 16.6 8 16.9C8.3 17.2 8.6 17.3 9 17.3C9.2 17.3 9.5 17.2 9.7 17.1C9.9 17 10.1 16.8 10.3 16.6C10.5 16.4 10.5 16.1 10.5 15.8C10.5 15.3 10.4 15 10.1 14.7C9.80001 14.4 9.50001 14.3 9.10001 14.3C9.00001 14.3 8.9 14.3 8.7 14.3C8.5 14.3 8.39999 14.3 8.39999 14.3C8.19999 14.3 7.99999 14.2 7.89999 14.1C7.79999 14 7.7 13.8 7.7 13.7C7.7 13.5 7.79999 13.4 7.89999 13.2C7.99999 13 8.2 13 8.5 13H8.8V13.1ZM15.3 17.5V12.2C14.3 13 13.6 13.3 13.3 13.3C13.1 13.3 13 13.2 12.9 13.1C12.8 13 12.7 12.8 12.7 12.6C12.7 12.4 12.8 12.3 12.9 12.2C13 12.1 13.2 12 13.6 11.8C14.1 11.6 14.5 11.3 14.7 11.1C14.9 10.9 15.2 10.6 15.5 10.3C15.8 10 15.9 9.80003 15.9 9.70003C15.9 9.60003 16.1 9.60004 16.3 9.60004C16.5 9.60004 16.7 9.70003 16.8 9.80003C16.9 9.90003 17 10.2 17 10.5V17.2C17 18 16.7 18.4 16.2 18.4C16 18.4 15.8 18.3 15.6 18.2C15.4 18.1 15.3 17.8 15.3 17.5Z"
                                                                fill="currentColor"/>
														</svg>
													</span>
                                    <!--end::Svg Icon-->
                                    <!--end::Icon-->
                                    <div class="mb-9">
                                        <!--begin::Event name-->
                                        <div class="d-flex align-items-center mb-2">
                                            <span class="fs-3 fw-bold me-3" data-kt-calendar="event_name"></span>
                                            <span class="badge badge-light-success" data-kt-calendar="all_day"></span>
                                        </div>
                                        <!--end::Event name-->
                                        <!--begin::Event description-->
                                        <div class="fs-6" data-kt-calendar="event_description"></div>
                                        <!--end::Event description-->
                                    </div>
                                </div>
                                <!--end::Row-->
                                <!--begin::Row-->
                                <div class="d-flex align-items-center mb-2">
                                    <!--begin::Icon-->
                                    <!--begin::Svg Icon | path: icons/duotune/abstract/abs050.svg-->
                                    <span class="svg-icon svg-icon-1 svg-icon-success me-5">
														<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
															<circle fill="currentColor" cx="12" cy="12" r="8"/>
														</svg>
													</span>
                                    <!--end::Svg Icon-->
                                    <!--end::Icon-->
                                    <!--begin::Event start date/time-->
                                    <div class="fs-6">
                                        <span class="fw-bold">Starts</span>
                                        <span data-kt-calendar="event_start_date"></span>
                                    </div>
                                    <!--end::Event start date/time-->
                                </div>
                                <!--end::Row-->
                                <!--begin::Row-->
                                <div class="d-flex align-items-center mb-9">
                                    <!--begin::Icon-->
                                    <!--begin::Svg Icon | path: icons/duotune/abstract/abs050.svg-->
                                    <span class="svg-icon svg-icon-1 svg-icon-danger me-5">
														<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24" version="1.1">
															<circle fill="currentColor" cx="12" cy="12" r="8"/>
														</svg>
													</span>
                                    <!--end::Svg Icon-->
                                    <!--end::Icon-->
                                    <!--begin::Event end date/time-->
                                    <div class="fs-6">
                                        <span class="fw-bold">Ends</span>
                                        <span data-kt-calendar="event_end_date"></span>
                                    </div>
                                    <!--end::Event end date/time-->
                                </div>
                                <!--end::Row-->
                                <!--begin::Row-->
                                <div class="d-flex align-items-center">
                                    <!--begin::Icon-->
                                    <!--begin::Svg Icon | path: icons/duotune/general/gen018.svg-->
                                    <span class="svg-icon svg-icon-1 svg-icon-muted me-5">
														<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
															<path opacity="0.3" d="M18.0624 15.3453L13.1624 20.7453C12.5624 21.4453 11.5624 21.4453 10.9624 20.7453L6.06242 15.3453C4.56242 13.6453 3.76242 11.4453 4.06242 8.94534C4.56242 5.34534 7.46242 2.44534 11.0624 2.04534C15.8624 1.54534 19.9624 5.24534 19.9624 9.94534C20.0624 12.0453 19.2624 13.9453 18.0624 15.3453Z" fill="currentColor"/>
															<path d="M12.0624 13.0453C13.7193 13.0453 15.0624 11.7022 15.0624 10.0453C15.0624 8.38849 13.7193 7.04535 12.0624 7.04535C10.4056 7.04535 9.06241 8.38849 9.06241 10.0453C9.06241 11.7022 10.4056 13.0453 12.0624 13.0453Z" fill="currentColor"/>
														</svg>
													</span>
                                    <!--end::Svg Icon-->
                                    <!--end::Icon-->
                                    <!--begin::Event location-->
                                    <div class="fs-6" data-kt-calendar="event_location"></div>
                                    <!--end::Event location-->
                                </div>
                                <!--end::Row-->
                            </div>
                            <!--end::Modal body-->
                        </div>
                    </div>
                </div>
                <!--end::Modal - New Product-->
                <!--end::Modals-->
            </div>
            <!--end::Post-->
            <!--end::About card-->
        </div>
        <!--end::Container-->
    </div>
@endsection

@section('extra-script')

    <script src="https://cdn.amcharts.com/lib/4/core.js"></script>
    <script src="https://cdn.amcharts.com/lib/4/charts.js"></script>
    <script src="https://cdn.amcharts.com/lib/4/maps.js"></script>
    <script src="https://cdn.amcharts.com/lib/4/geodata/worldLow.js"></script> <!-- Include the worldLow.js for world map -->
    <script src="https://cdn.amcharts.com/lib/4/geodata/bangladeshLow.js"></script> <!-- Include the Bangladesh map data -->
    <script src="https://cdn.amcharts.com/lib/4/themes/animated.js"></script>

    <script>

        var divisionData = [
            {
                id: "BD-H", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentMymIns }}
                    @else
                    {{ $percentMym }}
                    @endif
            },
            {
                id: "BD-G", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentSylIns }}
                    @else
                    {{ $percentSyl }}
                    @endif
            },
            {
                id: "BD-E", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentRajIns }}
                    @else
                    {{ $percentRaj }}
                    @endif
            },
            {
                id: "BD-F", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentRngIns }}
                    @else
                    {{ $percentRng }}
                    @endif
            },
            {
                id: "BD-D", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentKhlIns }}
                    @else
                    {{ $percentKhl }}
                    @endif
            },
            {
                id: "BD-C", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentDhkIns }}
                    @else
                    {{ $percentDhk }}
                    @endif
            },
            {
                id: "BD-B", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentCtgIns }}
                    @else
                    {{ $percentCtg }}
                    @endif
            },
            {
                id: "BD-A", percent: @if(Auth::user()->role->role->role_type == 2)
                    {{ $percentBslIns }}
                    @else
                    {{ $percentBsl }}
                    @endif
            }
        ];

        // Create map instance
        var chart = am4core.create("chartdiv", am4maps.MapChart);

        // Set map definition
        chart.geodata = am4geodata_bangladeshLow;

        // Set projection
        chart.projection = new am4maps.projections.Miller();

        // Create map polygon series
        var polygonSeries = chart.series.push(new am4maps.MapPolygonSeries());


        // Exclude Antartica
        polygonSeries.exclude = ["AQ"];

        // Make map load polygon (like country names) data from GeoJSON
        polygonSeries.useGeodata = true;

        // Configure series
        var polygonTemplate = polygonSeries.mapPolygons.template
        polygonTemplate.fill = am4core.color("#1d75b3");
        polygonTemplate.calculateVisualCenter = true;
        polygonTemplate.tooltipText = `{name}: {percent} %`; // Display division name and user percentage

        // Apply user percentage data
        polygonSeries.data = divisionData;
        polygonTemplate.adapter.add("fillOpacity", function (fillOpacity, target) {
            // Get the division id
            var id = target.dataItem.dataContext.id;
            // Find the corresponding percentage value in divisionData
            var division = divisionData.find(d => d.id === id);
            if (division) {
                // Calculate fill opacity based on percentage value
                var opacity = (division.percent / 100) * 2;
                if (opacity <= 1 && opacity >= 0.85) {
                    opacity = 1;
                } else if (opacity <= 0.85 && opacity >= 0.7) {
                    opacity = 0.9;
                } else if (opacity <= 0.7 && opacity >= 0.55) {
                    opacity = 0.8;
                } else if (opacity <= 0.55 && opacity >= 0.4) {
                    opacity = 0.7;
                } else if (opacity <= 0.4 && opacity >= 0.25) {
                    opacity = 0.6;
                } else if (opacity <= 0.25 && opacity >= 0.1) {
                    opacity = 0.5;
                } else if (opacity <= 0.1 && opacity >= 0.05) {
                    opacity = 0.4;
                } else {
                    opacity = 0.5;
                }
                return opacity;
            }
            return fillOpacity;
        });

        // Add zoom control
        // chart.zoomControl = new am4maps.ZoomControl();


        // Center on Bangladesh
        chart.deltaLongitude = -70;

        // Enable scrolling on mouse wheel
        chart.chartContainer.wheelable = false;

        // Enable animated zooming and panning
        chart.seriesContainer.draggable = false;
        chart.seriesContainer.resizable = false;


        // Add map title
    </script>
    <script>
        var genderChart = am4core.create("genderChart", am4charts.PieChart);

        genderChart.data = [{
            "gender": "Female",
            "person": @if(Auth::user()->role->role->role_type == 2)
                {{ $totalInsFemale }}
                @else
                {{ $totalFemale }}
                @endif
        }, {
            "gender": "Male",
            "person": @if(Auth::user()->role->role->role_type == 2)
                {{ $totalInsMale }}
                @else
                {{ $totalMale }}
                @endif
        }];


        var pieSeries = genderChart.series.push(new am4charts.PieSeries());
        pieSeries.dataFields.value = "person";
        pieSeries.dataFields.category = "gender";

        // Let's cut a hole in our Pie chart the size of 40% the radius
        genderChart.innerRadius = am4core.percent(40);

        pieSeries.colors.list = [
            am4core.color("#F20544"), // Red for Female
            am4core.color("#1d75b3")  // Blue for Male
        ];

        // Disable ticks and labels
        pieSeries.labels.template.disabled = true;
        pieSeries.ticks.template.disabled = true;

        // Disable tooltips
        pieSeries.slices.template.tooltipText = "";

        // Add a legend
        genderChart.legend = new am4charts.Legend();
    </script>
    <script>
        $(document).ready(function () {
            $('.menu.menu-column .menu-item-first:nth-child(1)').addClass('here');
            $('.menu.menu-column .menu-item-first:nth-child(1)').addClass('show');
        });
    </script>
    <!--begin::Vendors Javascript(used for this page only)-->
    <script src="{{ asset('plugins/custom/fullcalendar/fullcalendar.bundle.js') }}"></script>
    <script src="{{ asset('plugins/custom/datatables/datatables.bundle.js') }}"></script>
    <!--end::Vendors Javascript-->
    <!--begin::Custom Javascript(used for this page only)-->
    <script>
        var KTAppCalendar = function () {
            var e, t, n, a, o, r, i, l, d, s, c, m, u, v, f, p, y, D, _, b, k, g, S, Y, h, T, M, w, E, L,
                x = {id: "", eventName: "", eventDescription: "", eventLocation: "", startDate: "", endDate: "", allDay: !1},
                B = !1;
            const q = e => {
                C();
                const n = x.allDay ? moment(x.startDate).format("Do MMM, YYYY") : moment(x.startDate).format("Do MMM, YYYY - h:mm a"),
                    a = x.allDay ? moment(x.endDate).format("Do MMM, YYYY") : moment(x.endDate).format("Do MMM, YYYY - h:mm a");
                var o = {
                    container: "body",
                    trigger: "manual",
                    boundary: "window",
                    placement: "auto",
                    dismiss: !0,
                    html: !0,
                    title: "Event Summary",
                    content: '<div class="fw-bolder mb-2">' + x.eventName + '</div><div class="fs-7"><span class="fw-bold">Start:</span> ' + n + '</div><div class="fs-7 mb-4"><span class="fw-bold">End:</span> ' + a + '</div><div id="kt_calendar_event_view_button" type="button" class="btn btn-sm btn-light-primary">View More</div>'
                };
                (t = KTApp.initBootstrapPopover(e, o)).show(), B = !0, F()
            }, C = () => {
                B && (t.dispose(), B = !1)
            }, N = () => {
                f.innerText = "Add a New Event", v.show();
                const t = p.querySelectorAll('[data-kt-calendar="datepicker"]'),
                    r = p.querySelector("#kt_calendar_datepicker_allday");
                r.addEventListener("click", (e => {
                    e.target.checked ? t.forEach((e => {
                        e.classList.add("d-none")
                    })) : (d.setDate(x.startDate, !0, "Y-m-d"), t.forEach((e => {
                        e.classList.remove("d-none")
                    })))
                })), O(x), _.addEventListener("click", (function (t) {
                    t.preventDefault(), y && y.validate().then((function (t) {
                        console.log("validated!"), "Valid" == t ? (_.setAttribute("data-kt-indicator", "on"), _.disabled = !0, setTimeout((function () {
                            _.removeAttribute("data-kt-indicator"), Swal.fire({
                                text: "New event added to calendar!",
                                icon: "success",
                                buttonsStyling: !1,
                                confirmButtonText: "Ok, got it!",
                                customClass: {confirmButton: "btn btn-primary"}
                            }).then((function (t) {
                                if (t.isConfirmed) {
                                    v.hide(), _.disabled = !1;
                                    let t = !1;
                                    r.checked && (t = !0), 0 === c.selectedDates.length && (t = !0);
                                    var l = moment(i.selectedDates[0]).format(),
                                        s = moment(d.selectedDates[d.selectedDates.length - 1]).format();
                                    if (!t) {
                                        const e = moment(i.selectedDates[0]).format("YYYY-MM-DD"), t = e;
                                        l = e + "T" + moment(c.selectedDates[0]).format("HH:mm:ss"), s = t + "T" + moment(u.selectedDates[0]).format("HH:mm:ss")
                                    }
                                    e.addEvent({
                                        id: V(),
                                        title: n.value,
                                        description: a.value,
                                        location: o.value,
                                        start: l,
                                        end: s,
                                        allDay: t
                                    }), e.render(), p.reset()
                                }
                            }))
                        }), 2e3)) : Swal.fire({
                            text: "Sorry, looks like there are some errors detected, please try again.",
                            icon: "error",
                            buttonsStyling: !1,
                            confirmButtonText: "Ok, got it!",
                            customClass: {confirmButton: "btn btn-primary"}
                        })
                    }))
                }))
            }, A = () => {
                var e, t, n;
                w.show(), x.allDay ? (e = "All Day", t = moment(x.startDate).format("Do MMM, YYYY"), n = moment(x.endDate).format("Do MMM, YYYY")) : (e = "", t = moment(x.startDate).format("Do MMM, YYYY - h:mm a"), n = moment(x.endDate).format("Do MMM, YYYY - h:mm a")), g.innerText = x.eventName, S.innerText = e, Y.innerText = x.eventDescription ? x.eventDescription : "--", h.innerText = x.eventLocation ? x.eventLocation : "--", T.innerText = t, M.innerText = n
            }, H = () => {
            }, F = () => {
                document.querySelector("#kt_calendar_event_view_button").addEventListener("click", (e => {
                    e.preventDefault(), C(), A()
                }))
            }, O = () => {
                n.value = x.eventName ? x.eventName : "", a.value = x.eventDescription ? x.eventDescription : "", o.value = x.eventLocation ? x.eventLocation : "", i.setDate(x.startDate, !0, "Y-m-d");
                const e = x.endDate ? x.endDate : moment(x.startDate).format();
                d.setDate(e, !0, "Y-m-d");
                const t = p.querySelector("#kt_calendar_datepicker_allday"),
                    r = p.querySelectorAll('[data-kt-calendar="datepicker"]');
                x.allDay ? (t.checked = !0, r.forEach((e => {
                    e.classList.add("d-none")
                }))) : (c.setDate(x.startDate, !0, "Y-m-d H:i"), u.setDate(x.endDate, !0, "Y-m-d H:i"), d.setDate(x.startDate, !0, "Y-m-d"), t.checked = !1, r.forEach((e => {
                    e.classList.remove("d-none")
                })))
            }, P = e => {
                x.id = e.id, x.eventName = e.title, x.eventDescription = e.description, x.eventLocation = e.location, x.startDate = e.startStr, x.endDate = e.endStr, x.allDay = e.allDay
            }, V = () => Date.now().toString() + Math.floor(1e3 * Math.random()).toString();
            return {
                init: function () {
                    const t = document.getElementById("kt_modal_add_event");
                    p = t.querySelector("#kt_modal_add_event_form"), n = p.querySelector('[name="calendar_event_name"]'), a = p.querySelector('[name="calendar_event_description"]'), o = p.querySelector('[name="calendar_event_location"]'), r = p.querySelector("#kt_calendar_datepicker_start_date"), l = p.querySelector("#kt_calendar_datepicker_end_date"), s = p.querySelector("#kt_calendar_datepicker_start_time"), m = p.querySelector("#kt_calendar_datepicker_end_time"), D = document.querySelector('[data-kt-calendar="add"]'), _ = p.querySelector("#kt_modal_add_event_submit"), b = p.querySelector("#kt_modal_add_event_cancel"), k = t.querySelector("#kt_modal_add_event_close"), f = p.querySelector('[data-kt-calendar="title"]'), v = new bootstrap.Modal(t);
                    const B = document.getElementById("kt_modal_view_event");
                    var F, O, I, R, G, K;
                    w = new bootstrap.Modal(B), g = B.querySelector('[data-kt-calendar="event_name"]'), S = B.querySelector('[data-kt-calendar="all_day"]'), Y = B.querySelector('[data-kt-calendar="event_description"]'), h = B.querySelector('[data-kt-calendar="event_location"]'), T = B.querySelector('[data-kt-calendar="event_start_date"]'), M = B.querySelector('[data-kt-calendar="event_end_date"]'), F = document.getElementById("kt_calendar_app"), O = moment().startOf("day"), I = O.format("YYYY-MM"), R = O.clone().subtract(1, "day").format("YYYY-MM-DD"), G = O.format("YYYY-MM-DD"), K = O.clone().add(1, "day").format("YYYY-MM-DD"), (e = new FullCalendar.Calendar(F, {
                        headerToolbar: {
                            left: "prev,next today",
                            center: "title",
                            right: "dayGridMonth,timeGridWeek,timeGridDay"
                        },
                        initialDate: G,
                        navLinks: !0,
                        selectable: !0,
                        selectMirror: !0,
                        select: function (e) {
                            C(), P(e)
                        },
                        eventClick: function (e) {
                            C(), P({
                                id: e.event.id,
                                title: e.event.title,
                                description: e.event.extendedProps.description,
                                location: e.event.extendedProps.location,
                                startStr: e.event.startStr,
                                endStr: e.event.endStr,
                                allDay: e.event.allDay
                            }), A()
                        },
                        eventMouseEnter: function (e) {
                            P({
                                id: e.event.id,
                                title: e.event.title,
                                description: e.event.extendedProps.description,
                                location: e.event.extendedProps.location,
                                startStr: e.event.startStr,
                                endStr: e.event.endStr,
                                allDay: e.event.allDay
                            }), q(e.el)
                        },
                        editable: !0,
                        dayMaxEvents: !0,
                        events: {
                            url: "{{url('/api/counseling/session-event')}}",
                            method: 'GET'
                        },
                        datesSet: function () {
                            C()
                        }
                    })).render(), y = FormValidation.formValidation(p, {
                        fields: {
                            calendar_event_name: {validators: {notEmpty: {message: "Event name is required"}}},
                            calendar_event_start_date: {validators: {notEmpty: {message: "Start date is required"}}},
                            calendar_event_end_date: {validators: {notEmpty: {message: "End date is required"}}}
                        },
                        plugins: {
                            trigger: new FormValidation.plugins.Trigger,
                            bootstrap: new FormValidation.plugins.Bootstrap5({
                                rowSelector: ".fv-row",
                                eleInvalidClass: "",
                                eleValidClass: ""
                            })
                        }
                    }), i = flatpickr(r, {enableTime: !1, dateFormat: "Y-m-d"}), d = flatpickr(l, {
                        enableTime: !1,
                        dateFormat: "Y-m-d"
                    }), c = flatpickr(s, {enableTime: !0, noCalendar: !0, dateFormat: "H:i"}), u = flatpickr(m, {
                        enableTime: !0,
                        noCalendar: !0,
                        dateFormat: "H:i"
                    }), H(), D.addEventListener("click", (e => {
                        C(), x = {
                            id: "",
                            eventName: "",
                            eventDescription: "",
                            startDate: new Date,
                            endDate: new Date,
                            allDay: !1
                        }
                    })), b.addEventListener("click", (function (e) {
                        e.preventDefault(), Swal.fire({
                            text: "Are you sure you would like to cancel?",
                            icon: "warning",
                            showCancelButton: !0,
                            buttonsStyling: !1,
                            confirmButtonText: "Yes, cancel it!",
                            cancelButtonText: "No, return",
                            customClass: {confirmButton: "btn btn-primary", cancelButton: "btn btn-active-light"}
                        }).then((function (e) {
                            e.value ? (p.reset(), v.hide()) : "cancel" === e.dismiss && Swal.fire({
                                text: "Your form has not been cancelled!.",
                                icon: "error",
                                buttonsStyling: !1,
                                confirmButtonText: "Ok, got it!",
                                customClass: {confirmButton: "btn btn-primary"}
                            })
                        }))
                    })), k.addEventListener("click", (function (e) {
                        e.preventDefault(), Swal.fire({
                            text: "Are you sure you would like to cancel?",
                            icon: "warning",
                            showCancelButton: !0,
                            buttonsStyling: !1,
                            confirmButtonText: "Yes, cancel it!",
                            cancelButtonText: "No, return",
                            customClass: {confirmButton: "btn btn-primary", cancelButton: "btn btn-active-light"}
                        }).then((function (e) {
                            e.value ? (p.reset(), v.hide()) : "cancel" === e.dismiss && Swal.fire({
                                text: "Your form has not been cancelled!.",
                                icon: "error",
                                buttonsStyling: !1,
                                confirmButtonText: "Ok, got it!",
                                customClass: {confirmButton: "btn btn-primary"}
                            })
                        }))
                    })), (e => {
                        e.addEventListener("hidden.bs.modal", (e => {
                            y && y.resetForm(!0)
                        }))
                    })(t)
                }
            }
        }();
        KTUtil.onDOMContentLoaded((function () {
            KTAppCalendar.init()
        }));
    </script>
    <script type="text/javascript">
        @if(Session::has('message'))
        var type = "{{Session::get('alert-type', 'info')}}"
        switch (type) {
            case 'info':
                toastr.info("{{Session::get('message')}}");
                break;
            case 'success':
                toastr.success("{{Session::get('message')}}");
                break;
            case 'warning':
                toastr.warning("{{Session::get('message')}}");
                break;
            case 'error':
                toastr.error("{{Session::get('message')}}");
                break;
        }
        @endif

        @if(count($errors) > 0)
        @foreach($errors->all() as $error)
        toastr.error("{{ $error }}");
        @endforeach
        @endif
    </script>
    <script src="{{ asset('js/widgets.bundle.js') }}"></script>
    <!--end::Custom Javascript-->
@endsection