@extends('admin.layouts.app')

@section('title', 'Staff Details')

@section('content')
<div class="page-header">
    <div>
        <h2>Staff Details</h2>
        <p>View employee profile and employment information</p>
    </div>
    <div class="staff-page-actions">
        <a href="{{ route('admin.staffs.edit', $staff) }}" class="btn-primary"><i class="fas fa-edit"></i> Edit Staff</a>
    </div>
</div>

<div class="staff-profile-header">
    <div class="staff-avatar">{{ strtoupper(mb_substr($staff->full_name, 0, 1)) }}</div>
    <div class="staff-profile-title">
        <div class="staff-name-row">
            <h2>{{ $staff->full_name }}</h2>
            <span class="badge {{ $staff->status === 'Active' ? 'badge-success' : 'badge-danger' }}">{{ $staff->status }}</span>
        </div>
        <p>{{ $staff->designation->name }} <span>•</span> {{ $staff->employee_id }}</p>
    </div>
    <div class="staff-profile-quick-contact">
        <a href="tel:{{ $staff->mobile }}"><i class="fas fa-phone"></i> {{ $staff->mobile }}</a>
        <a href="mailto:{{ $staff->email }}"><i class="fas fa-envelope"></i> {{ $staff->email }}</a>
    </div>
</div>

<div class="staff-details-grid">
    <section class="staff-detail-card">
        <div class="staff-detail-card-title"><i class="fas fa-user"></i><h3>Personal Information</h3></div>
        <div class="staff-detail-list">
            <div><span>Employee ID</span><strong>{{ $staff->employee_id }}</strong></div>
            <div><span>Full Name</span><strong>{{ $staff->full_name }}</strong></div>
            <div><span>Gender</span><strong>{{ $staff->gender }}</strong></div>
            <div><span>Date of Birth</span><strong>{{ $staff->date_of_birth->format('d M Y') }}</strong></div>
        </div>
    </section>

    <section class="staff-detail-card">
        <div class="staff-detail-card-title"><i class="fas fa-briefcase"></i><h3>Employment Information</h3></div>
        <div class="staff-detail-list">
            <div><span>Designation</span><strong>{{ $staff->designation->name }}</strong></div>
            <div><span>Joining Date</span><strong>{{ $staff->joining_date->format('d M Y') }}</strong></div>
            <div><span>Employment Status</span><strong><span class="badge {{ $staff->status === 'Active' ? 'badge-success' : 'badge-danger' }}">{{ $staff->status }}</span></strong></div>
        </div>
    </section>

    <section class="staff-detail-card">
        <div class="staff-detail-card-title"><i class="fas fa-address-book"></i><h3>Contact Information</h3></div>
        <div class="staff-detail-list">
            <div><span>Mobile Number</span><strong><a href="tel:{{ $staff->mobile }}">{{ $staff->mobile }}</a></strong></div>
            <div><span>Alternate Mobile</span><strong>{{ $staff->alternate_mobile ?? 'Not provided' }}</strong></div>
            <div><span>Email Address</span><strong class="staff-email"><a href="mailto:{{ $staff->email }}">{{ $staff->email }}</a></strong></div>
        </div>
    </section>

    <section class="staff-detail-card">
        <div class="staff-detail-card-title"><i class="fas fa-map-marker-alt"></i><h3>Address</h3></div>
        <div class="staff-address-content">
            <p>{{ $staff->address }}</p>
            <p>{{ $staff->city }}, {{ $staff->state }}</p>
            <span>{{ $staff->pincode }}</span>
        </div>
    </section>
</div>
@endsection