@extends('layout',['heading'=>__('ui.clinic_dashboard_title'),'clinic'=>$clinic])
@section('content')
<div class="space-y-6">
<section class="relative overflow-hidden rounded-[22px] bg-gradient-to-l from-[#10243b] via-[#183b51] to-[#117d78] p-6 md:p-8 text-white shadow-xl shadow-slate-300/30"><div class="relative z-10 max-w-2xl"><p class="text-teal-200 text-sm font-bold mb-2">{{ __('ui.daily_operations_summary') }}</p><h2 class="text-2xl md:text-3xl font-extrabold leading-relaxed">{{ __('ui.welcome_to_clinic', ['clinic' => $clinic->name]) }}</h2><p class="text-slate-200 mt-2 leading-7">{{ __('ui.dashboard_intro') }}</p><div class="flex flex-wrap gap-3 mt-6"><a class="bg-white text-[#0d756f] px-4 py-2.5 rounded-xl font-bold" href="/appointments">{{ __('ui.view_today_appointments') }}</a><a class="border border-white/25 bg-white/10 px-4 py-2.5 rounded-xl font-bold" href="/patients">{{ __('ui.open_patient_records') }}</a></div></div><div class="absolute -left-12 -bottom-20 w-64 h-64 rounded-full border-[28px] border-white/10"></div><div class="absolute left-24 -top-20 w-44 h-44 rounded-full bg-teal-300/10"></div></section>
<section class="grid sm:grid-cols-2 xl:grid-cols-4 gap-4"><div class="card p-5"><div class="flex justify-between items-start"><span class="text-slate-500 text-sm font-semibold">{{ __('ui.total_patients') }}</span><span class="w-9 h-9 rounded-xl bg-teal-50 text-teal-700 grid place-items-center font-bold">01</span></div><b class="block text-3xl mt-5">{{ number_format($patients) }}</b><p class="text-xs text-slate-400 mt-1">{{ __('ui.linked_clinic_records') }}</p></div><div class="card p-5"><div class="flex justify-between items-start"><span class="text-slate-500 text-sm font-semibold">{{ __('ui.today_appointments') }}</span><span class="w-9 h-9 rounded-xl bg-amber-50 text-amber-700 grid place-items-center font-bold">02</span></div><b class="block text-3xl mt-5 text-amber-700">{{ number_format($today) }}</b><p class="text-xs text-slate-400 mt-1">{{ __('ui.current_reception_schedule') }}</p></div><div class="card p-5"><div class="flex justify-between items-start"><span class="text-slate-500 text-sm font-semibold">{{ __('ui.services_procedures') }}</span><span class="w-9 h-9 rounded-xl bg-indigo-50 text-indigo-700 grid place-items-center font-bold">03</span></div><b class="block text-3xl mt-5 text-indigo-700">{{ number_format($services) }}</b><p class="text-xs text-slate-400 mt-1">{{ __('ui.financial_catalog_items') }}</p></div><div class="card p-5"><div class="flex justify-between items-start"><span class="text-slate-500 text-sm font-semibold">{{ __('ui.inventory_items_count') }}</span><span class="w-9 h-9 rounded-xl bg-emerald-50 text-emerald-700 grid place-items-center font-bold">04</span></div><b class="block text-3xl mt-5 text-emerald-700">{{ number_format($inventory) }}</b><p class="text-xs text-slate-400 mt-1">{{ __('ui.items_under_review') }}</p></div></section>
<section class="grid lg:grid-cols-[1.35fr_.65fr] gap-6"><div class="card p-6"><div class="flex items-center justify-between mb-6"><div><p class="section-kicker">FINANCIAL SNAPSHOT</p><h3 class="text-lg font-extrabold mt-1">{{ __('ui.income') }}</h3></div><a class="text-sm text-teal-700 font-bold" href="/reports">{{ __('ui.financial_report') }} ←</a></div><div class="grid sm:grid-cols-2 gap-4"><div class="rounded-2xl bg-[#f0fbf9] p-5"><p class="text-sm text-slate-500">{{ __('ui.today') }}</p><strong class="block text-2xl text-teal-700 mt-3">{{ number_format((float)$dailyRevenue, 2) }} <small class="text-sm">{{ __('ui.currency') }}</small></strong><span class="text-xs text-slate-400">{{ __('ui.payments_recorded_today') }}</span></div><div class="rounded-2xl bg-[#f4f7ff] p-5"><p class="text-sm text-slate-500">{{ __('ui.this_month') }}</p><strong class="block text-2xl text-indigo-700 mt-3">{{ number_format((float)$monthlyRevenue, 2) }} <small class="text-sm">{{ __('ui.currency') }}</small></strong><span class="text-xs text-slate-400">{{ __('ui.from_month_start') }}</span></div></div></div><div class="card p-6"><div class="flex justify-between items-center mb-5"><div><p class="section-kicker">VISIT FLOW</p><h3 class="text-lg font-extrabold mt-1">{{ __('ui.visit_status') }}</h3></div><span class="text-xs text-slate-400">{{ $visitStats['total'] }} {{ __('ui.total') }}</span></div><div class="space-y-4"><div><div class="flex justify-between text-sm mb-1"><span>{{ __('ui.completed_visits') }}</span><b class="text-emerald-700">{{ $visitStats['completed'] }} · {{ $visitStats['completed_pct'] }}%</b></div><div class="h-2 bg-slate-100 rounded-full overflow-hidden"><div class="h-full bg-emerald-500 rounded-full" style="width:{{ min(100,$visitStats['completed_pct']) }}%"></div></div></div><div><div class="flex justify-between text-sm mb-1"><span>{{ __('ui.rescheduled_visits') }}</span><b class="text-amber-700">{{ $visitStats['rescheduled'] }} · {{ $visitStats['rescheduled_pct'] }}%</b></div><div class="h-2 bg-slate-100 rounded-full overflow-hidden"><div class="h-full bg-amber-400 rounded-full" style="width:{{ min(100,$visitStats['rescheduled_pct']) }}%"></div></div></div><div><div class="flex justify-between text-sm mb-1"><span>{{ __('ui.cancelled_visits') }}</span><b class="text-rose-700">{{ $visitStats['cancelled'] }} · {{ $visitStats['cancelled_pct'] }}%</b></div><div class="h-2 bg-slate-100 rounded-full overflow-hidden"><div class="h-full bg-rose-400 rounded-full" style="width:{{ min(100,$visitStats['cancelled_pct']) }}%"></div></div></div></div></div></section>
<section class="card p-6"><div class="flex items-center justify-between mb-5"><div><p class="section-kicker">QUICK ACTIONS</p><h3 class="text-lg font-extrabold mt-1">{{ __('ui.quick_actions') }}</h3></div><span class="text-sm text-slate-400">{{ __('ui.start_here') }}</span></div><div class="grid grid-cols-2 md:grid-cols-3 xl:grid-cols-6 gap-3"><a href="/patients" class="p-4 rounded-2xl bg-slate-50 hover:bg-teal-50 transition"><b class="block text-teal-700 mb-1">+ {{ __('ui.new_patient_short') }}</b><span class="text-xs text-slate-500">{{ __('ui.create_new_record') }}</span></a><a href="/appointments" class="p-4 rounded-2xl bg-slate-50 hover:bg-teal-50 transition"><b class="block text-teal-700 mb-1">+ {{ __('ui.appointment_short') }}</b><span class="text-xs text-slate-500">{{ __('ui.book_visit') }}</span></a><a href="/services" class="p-4 rounded-2xl bg-slate-50 hover:bg-teal-50 transition"><b class="block text-teal-700 mb-1">{{ __('ui.catalog') }}</b><span class="text-xs text-slate-500">{{ __('ui.services_and_procedures') }}</span></a><a href="/inventory" class="p-4 rounded-2xl bg-slate-50 hover:bg-teal-50 transition"><b class="block text-teal-700 mb-1">{{ __('ui.inventory') }}</b><span class="text-xs text-slate-500">{{ __('ui.stock_items_quantities') }}</span></a><a href="/insurance" class="p-4 rounded-2xl bg-slate-50 hover:bg-teal-50 transition"><b class="block text-teal-700 mb-1">{{ __('ui.insurance') }}</b><span class="text-xs text-slate-500">{{ __('ui.companies_and_plans') }}</span></a><a href="/clinic-settings" class="p-4 rounded-2xl bg-slate-50 hover:bg-teal-50 transition"><b class="block text-teal-700 mb-1">{{ __('ui.settings') }}</b><span class="text-xs text-slate-500">{{ __('ui.clinic_data') }}</span></a></div></section>
</div>
@endsection