@extends('dashboard.layouts.app')

@section('content')
    <div class="container-fluid app-bg">
        <div class="page-shell">
            <div class="space-y-4">
                <x-page-title
                    title="Leave Type Details"
                    description="Review leave type configuration details.">
                    <a href="{{ route('leave_types.index') }}" class="asset-btn asset-btn--secondary">
                        Back
                    </a>
                </x-page-title>

                <div class="ui-card">
                    <div class="ui-card__body p-4">
                        <div class="row g-3">
                            <div class="col-md-6">
                                <div class="text-muted small">Type</div>
                                <div class="fw-semibold">{{ $type->type }}</div>
                            </div>

                            <div class="col-md-6">
                                <div class="text-muted small">Total Days Per Year</div>
                                <div class="fw-semibold">{{ $type->total_days }}</div>
                            </div>

                            <div class="col-md-6">
                                <div class="text-muted small">Maximum Consecutive Days Allowed</div>
                                <div class="fw-semibold">{{ $type->max_leaves_allowed }}</div>
                            </div>

                            <div class="col-md-6">
                                <div class="text-muted small">Applicable After (work days)</div>
                                <div class="fw-semibold">{{ $type->applicable_after_work_days }}</div>
                            </div>

                            <div class="col-md-6">
                                <div class="text-muted small">Status</div>
                                <span class="ui-pill ui-pill--{{ $type->active_status ? 'success' : 'danger' }}">
                                    {{ $type->active_status ? 'Active' : 'Inactive' }}
                                </span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection