@extends('layouts.app')
@section('title', $status->name)

@section('content')
<x-page-head icon="signpost-split" :title="$status->name" :subtitle="$status->code">
    <x-slot:actions>
        <span class="badge bg-{{ $status->color ?: 'secondary' }}">{{ $status->name }}</span>
        @if($status->is_active)
            <span class="badge bg-success">{{ __('config.active') }}</span>
        @else
            <span class="badge bg-secondary">{{ __('config.inactive') }}</span>
        @endif
        <a href="{{ route('admin.application-statuses.edit', $status) }}" class="btn btn-primary btn-sm">
            <i class="bi bi-pencil"></i> {{ __('app.edit') }}
        </a>
        <a href="{{ route('admin.application-statuses.index') }}" class="btn btn-secondary btn-sm">
            <i class="bi bi-arrow-{{ app()->getLocale() === 'en' ? 'left' : 'right' }}"></i> {{ __('app.back') }}
        </a>
    </x-slot:actions>
</x-page-head>

<div class="row g-2 g-md-3 mb-3">
    <div class="col-6 col-md-3">
        <div class="mini-stat">
            <div class="ms-value">{{ number_format($status->applications_count) }}</div>
            <div class="ms-label">{{ __('app.applications') }}</div>
        </div>
    </div>
    <div class="col-6 col-md-3">
        <div class="mini-stat">
            <div class="ms-value">{{ $next->count() }}</div>
            <div class="ms-label">{{ __('config.application_statuses.allowed_transitions') }}</div>
        </div>
    </div>
</div>

<div class="row g-3">
    <div class="col-lg-5">
        <x-detail-card :title="__('app.basic_info')" icon="info-circle">
            <x-detail-item :label="__('config.code')"><code>{{ $status->code }}</code></x-detail-item>
            <x-detail-item :label="__('config.name_ar')">{{ $status->name_ar }}</x-detail-item>
            <x-detail-item :label="__('config.name_en')">{{ $status->name_en }}</x-detail-item>
            <x-detail-item :label="__('config.application_statuses.color')">
                <span class="badge bg-{{ $status->color }}">{{ __('config.application_statuses.colors.' . $status->color) }}</span>
            </x-detail-item>
            <x-detail-item :label="__('config.application_statuses.stage_group')">
                {{ $status->stage_group ? __('config.application_statuses.groups.' . $status->stage_group) : '' }}
            </x-detail-item>
            <x-detail-item :label="__('config.sort_order')">{{ $status->sort_order }}</x-detail-item>
            <x-detail-item :label="__('config.application_statuses.is_initial')">
                <i class="bi bi-{{ $status->is_initial ? 'check-circle-fill text-success' : 'dash-circle text-muted' }}"></i>
            </x-detail-item>
            <x-detail-item :label="__('config.application_statuses.is_final')">
                <i class="bi bi-{{ $status->is_final ? 'check-circle-fill text-success' : 'dash-circle text-muted' }}"></i>
            </x-detail-item>
            <x-detail-item :label="__('config.application_statuses.is_rejected')">
                <i class="bi bi-{{ $status->is_rejected ? 'check-circle-fill text-danger' : 'dash-circle text-muted' }}"></i>
            </x-detail-item>
        </x-detail-card>
    </div>

    <div class="col-lg-7">
        {{-- Outgoing transitions --}}
        <x-related-card :title="__('config.application_statuses.allowed_transitions')" icon="arrow-right-circle" :count="$next->count()" class="mb-3">
            <div class="card-body d-flex flex-wrap gap-2">
                @forelse($next as $s)
                    <a href="{{ route('admin.application-statuses.show', $s) }}" class="text-decoration-none">
                        <span class="badge bg-{{ $s->color ?: 'secondary' }} p-2">{{ $s->name }}</span>
                    </a>
                @empty
                    <span class="text-muted">{{ __('app.no_related') }}</span>
                @endforelse
            </div>
        </x-related-card>

        {{-- Incoming transitions (statuses that can move into this one) --}}
        <x-related-card :title="__('config.application_statuses.incoming_transitions')" icon="arrow-down-left-circle" :count="$incoming->count()">
            <div class="card-body d-flex flex-wrap gap-2">
                @forelse($incoming as $s)
                    <a href="{{ route('admin.application-statuses.show', $s) }}" class="text-decoration-none">
                        <span class="badge bg-{{ $s->color ?: 'secondary' }} p-2">{{ $s->name }}</span>
                    </a>
                @empty
                    <span class="text-muted">{{ __('app.no_related') }}</span>
                @endforelse
            </div>
        </x-related-card>
    </div>
</div>
@endsection