@if(auth()->user()->hasRole('administrator'))

<!--begin::Card widget 7-->
<div class="card card-flush h-md-50 mb-5 mb-xl-10">
	<!--begin::Header-->
	<div class="card-header pt-5">
		<!--begin::Title-->
		<div class="card-title d-flex flex-column">
			<!--begin::Amount-->
			<span class="fs-2hx fw-bold text-gray-900 me-2 lh-1 ls-n2">{{ $head->count() }}</span>
			<!--end::Amount-->
			<!--begin::Subtitle-->
				<span class="text-gray-500 pt-1 fw-semibold fs-6">Province Head</span>
			<!--end::Subtitle-->
		</div>
		<!--end::Title-->
	</div>
	<!--end::Header-->
	<!--begin::Card body-->
	<div class="card-body d-flex flex-column justify-content-end pe-0">
		<!--begin::Title-->
		
			<span class="fs-6 fw-bolder text-gray-800 d-block mb-2">Province Head</span>
		
		<!--end::Title-->
		<!--begin::Users group-->
		<div class="symbol-group symbol-hover flex-nowrap">
			{{-- {dd($head);} --}}
			@if($head->count() > 0)				
                @foreach($head->take(5) as $user)
                    @php
                        $initials = strtoupper(substr($user->user->name ?? '', 0, 2));
                    @endphp
                    <div class="symbol symbol-35px symbol-circle" data-bs-toggle="tooltip" title="{{ $user->user->name ?? '' }}">
                        <span class="symbol-label bg-primary text-inverse-primary fw-bold">{{ $initials }}</span>
                    </div>
                @endforeach
			@endif
			{{-- <a href="#" class="symbol symbol-35px symbol-circle" data-bs-toggle="modal" data-bs-target="#kt_modal_view_users">
				<span class="symbol-label bg-dark text-gray-300 fs-8 fw-bold">+{{ $head->count() }}</span>
			</a> --}}
		</div>		
		<!--end::Users group-->
	</div>
	<!--end::Card body-->
</div>
<!--end::Card widget 7-->

@else
	<!--begin::List widget 26-->
	<div class="card card-flush h-lg-50">
		<!--begin::Header-->
		<div class="card-header pt-5">
			<!--begin::Title-->
			<h3 class="card-title text-gray-800 fw-bold">Internal Links</h3>
			<!--end::Title-->
			<!--begin::Toolbar-->
			<div class="card-toolbar">
				<!--begin::Menu-->
				{{-- <button class="btn btn-icon btn-color-gray-500 btn-active-color-primary justify-content-end" data-kt-menu-trigger="click" data-kt-menu-placement="bottom-end" data-kt-menu-overflow="true">{!! getIcon('dots-square', 'fs-1 text-gray-300 me-n1') !!}</button>
				<!--begin::Menu 2-->
				<div class="menu menu-sub menu-sub-dropdown menu-column menu-rounded menu-gray-800 menu-state-bg-light-primary fw-semibold w-200px" data-kt-menu="true">
					<!--begin::Menu item-->
					<div class="menu-item px-3">
						<div class="menu-content fs-6 text-gray-900 fw-bold px-3 py-4">Quick Actions</div>
					</div>
					<!--end::Menu item-->
					<!--begin::Menu separator-->
					<div class="separator mb-3 opacity-75"></div>
					<!--end::Menu separator-->
					<!--begin::Menu item-->
					<div class="menu-item px-3">
						<a href="#" class="menu-link px-3">New Ticket</a>
					</div>
					<!--end::Menu item-->
					<!--begin::Menu item-->
					<div class="menu-item px-3">
						<a href="#" class="menu-link px-3">New Customer</a>
					</div>
					<!--end::Menu item-->
					<!--begin::Menu item-->
					<div class="menu-item px-3" data-kt-menu-trigger="hover" data-kt-menu-placement="right-start">
						<!--begin::Menu item-->
						<a href="#" class="menu-link px-3">
							<span class="menu-title">New Group</span>
							<span class="menu-arrow"></span>
						</a>
						<!--end::Menu item-->
						<!--begin::Menu sub-->
						<div class="menu-sub menu-sub-dropdown w-175px py-4">
							<!--begin::Menu item-->
							<div class="menu-item px-3">
								<a href="#" class="menu-link px-3">Admin Group</a>
							</div>
							<!--end::Menu item-->
							<!--begin::Menu item-->
							<div class="menu-item px-3">
								<a href="#" class="menu-link px-3">Staff Group</a>
							</div>
							<!--end::Menu item-->
							<!--begin::Menu item-->
							<div class="menu-item px-3">
								<a href="#" class="menu-link px-3">Member Group</a>
							</div>
							<!--end::Menu item-->
						</div>
						<!--end::Menu sub-->
					</div>
					<!--end::Menu item-->
					<!--begin::Menu item-->
					<div class="menu-item px-3">
						<a href="#" class="menu-link px-3">New Contact</a>
					</div>
					<!--end::Menu item-->
					<!--begin::Menu separator-->
					<div class="separator mt-3 opacity-75"></div>
					<!--end::Menu separator-->
					<!--begin::Menu item-->
					<div class="menu-item px-3">
						<div class="menu-content px-3 py-3">
							<a class="btn btn-primary btn-sm px-4" href="#">Generate Reports</a>
						</div>
					</div>
					<!--end::Menu item-->
				</div> --}}
				<!--end::Menu 2-->
				<!--end::Menu-->
			</div>
			<!--end::Toolbar-->
		</div>
		<!--end::Header-->
		<!--begin::Body-->
		<div class="card-body pt-5">
			<!--begin::Item-->
			<div class="d-flex flex-stack">
				<!--begin::Section-->
				<a href="{{ route('user-management.users.index') }}" class="text-primary fw-semibold fs-6 me-2">Users</a>
				<!--end::Section-->
				<!--begin::Action-->
				<button type="button" class="btn btn-icon btn-sm h-auto btn-color-gray-500 btn-active-color-primary justify-content-end">{!! getIcon('exit-right-corner', 'fs-2') !!}</button>
				<!--end::Action-->
			</div>
			<!--end::Item-->
			<!--begin::Separator-->
			<div class="separator separator-dashed my-3"></div>
			<!--end::Separator-->
			<!--begin::Item-->
			@if(auth()->user()->hasRole('admin') || auth()->user()->hasRole('StateHead'))
			<div class="d-flex flex-stack">
				<!--begin::Section-->
				<a href="{{ route('garragemanager.index') }}" class="text-primary fw-semibold fs-6 me-2">Province Head</a>
				<!--end::Section-->
				<!--begin::Action-->
				<button type="button" class="btn btn-icon btn-sm h-auto btn-color-gray-500 btn-active-color-primary justify-content-end">{!! getIcon('exit-right-corner', 'fs-2') !!}</button>
				<!--end::Action-->
			</div>
			@endif			

			<!--end::Item-->
			<!--begin::Separator-->
			<div class="separator separator-dashed my-3"></div>
			@if(auth()->user()->hasRole('admin'))
			<div class="d-flex flex-stack">
				<!--begin::Section-->
				<a href="{{ route('stateHead.index') }}" class="text-primary fw-semibold fs-6 me-2">State Head</a>
				<!--end::Section-->
				<!--begin::Action-->
				<button type="button" class="btn btn-icon btn-sm h-auto btn-color-gray-500 btn-active-color-primary justify-content-end">{!! getIcon('exit-right-corner', 'fs-2') !!}</button>
				<!--end::Action-->
			</div>
			@endif
			<!--end::Separator-->
			<!--begin::Item-->
			{{-- @if(auth()->user()->hasRole('administrator'))
			<div class="d-flex flex-stack">
				<!--begin::Section-->
				<a href="{{ route('countryAdmin.index') }}" class="text-primary fw-semibold fs-6 me-2">Country Head</a>
				<!--end::Section-->
				<!--begin::Action-->
				<button type="button" class="btn btn-icon btn-sm h-auto btn-color-gray-500 btn-active-color-primary justify-content-end">{!! getIcon('exit-right-corner', 'fs-2') !!}</button>
				<!--end::Action-->
			</div>
			@endif --}}
			<!--end::Item-->
		</div>
		<!--end::Body-->
	</div>
	<!--end::LIst widget 26-->
@endif