@extends('portal.layouts.app')

@section('content')
    <div class="portal-grid portal-grid--cards">
        <div class="portal-card">
            <div class="portal-stat__label">{{ trans('portal.dashboard.employee_code') }}</div>
            <div class="portal-stat__value">{{ auth('employee')->user()->code }}</div>
        </div>
        <div class="portal-card">
            <div class="portal-stat__label">{{ trans('portal.dashboard.branch') }}</div>
            <div class="portal-stat__value" style="font-size: 22px;">{{ auth('employee')->user()->branch?->name ?? trans('portal.common.not_available') }}</div>
        </div>
        <div class="portal-card">
            <div class="portal-stat__label">{{ trans('portal.dashboard.employment_status') }}</div>
            <div class="portal-stat__value" style="font-size: 22px;">{{ auth('employee')->user()->employment_status ?? trans('portal.common.not_available') }}</div>
        </div>
        @if ($unreadCount > 0)
            <div class="portal-card" style="border-left: 4px solid var(--portal-accent);">
                <div class="portal-stat__label">{{ trans('portal.dashboard.unread_notifications') }}</div>
                <div class="portal-stat__value" style="color:var(--portal-accent);">{{ $unreadCount }}</div>
            </div>
        @endif
    </div>

    {{-- Pending Requests Alert --}}
    @if ($pendingRequests->isNotEmpty())
        <div class="portal-card" style="margin-top: 18px; border-left: 4px solid var(--portal-warning);">
            <h2 class="portal-card__title">{{ trans('portal.dashboard.pending_requests_title') }}</h2>
            <div class="portal-list" style="margin-top: 10px;">
                @foreach ($pendingRequests->take(3) as $approval)
                    <div class="portal-list__item">
                        <div>
                            <div class="portal-list__title">{{ ucfirst(str_replace('_', ' ', $approval->request_type)) }}</div>
                            <div class="portal-list__meta">{{ $approval->submitted_at?->format('Y-m-d') }}</div>
                        </div>
                        <span class="portal-badge portal-badge--pending">{{ trans('portal.requests.statuses.pending') }}</span>
                    </div>
                @endforeach
            </div>
            <div class="portal-actions">
                <a class="portal-button portal-button--ghost" href="{{ route('portal.requests') }}">{{ trans('portal.dashboard.view_requests') }}</a>
                <a class="portal-button portal-button--subtle" href="{{ route('portal.notifications') }}">{{ trans('portal.dashboard.view_notifications') }}</a>
            </div>
        </div>
    @endif

    {{-- Recent Notifications --}}
    @if ($recentNotifications->isNotEmpty())
        <div class="portal-card" style="margin-top: 18px;">
            <h2 class="portal-card__title">{{ trans('portal.dashboard.recent_notifications') }}</h2>
            <div class="portal-list" style="margin-top: 10px;">
                @foreach ($recentNotifications as $notification)
                    @php $n = $notificationService->formatNotification($notification) @endphp
                    <div class="portal-list__item" style="{{ !$n['is_read'] ? 'background:var(--portal-primary-soft);border-radius:12px;padding:10px;' : '' }}">
                        <div>
                            <div class="portal-list__title">
                                @if (!$n['is_read'])
                                    <span style="display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--portal-primary);margin-right:7px;vertical-align:middle;"></span>
                                @endif
                                {{ $n['title'] }}
                            </div>
                            <div class="portal-subtle">{{ $n['created_at_human'] }}</div>
                        </div>
                    </div>
                @endforeach
            </div>
            <div class="portal-actions">
                <a class="portal-button portal-button--ghost" href="{{ route('portal.notifications') }}">{{ trans('portal.dashboard.view_all_notifications') }}</a>
            </div>
        </div>
    @endif

    <div class="portal-grid" style="margin-top: 18px;">
        <div class="portal-card">
            <h2 class="portal-card__title">{{ trans('portal.dashboard.quick_access') }}</h2>
            <p class="portal-card__text">{{ trans('portal.dashboard.quick_access_description') }}</p>
            <div class="portal-actions">
                <a class="portal-button" href="{{ route('portal.requests') }}">{{ trans('portal.nav.requests') }}</a>
                <a class="portal-button portal-button--ghost" href="{{ route('portal.profile') }}">{{ trans('portal.nav.profile') }}</a>
                <a class="portal-button portal-button--ghost" href="{{ route('portal.payroll') }}">{{ trans('portal.nav.payroll') }}</a>
                <a class="portal-button portal-button--ghost" href="{{ route('portal.attendance') }}">{{ trans('portal.nav.attendance') }}</a>
            </div>
        </div>

        <div class="portal-card">
            <h2 class="portal-card__title">{{ trans('portal.dashboard.read_only_title') }}</h2>
            <p class="portal-card__text">{{ trans('portal.dashboard.read_only_description') }}</p>
        </div>
    </div>
@endsection