@extends('layouts.app')

@php
    $locale = app()->getLocale();
    $isRtl = $locale === 'ar';
    $currency = \App\Models\Setting::currencyLabel($locale);
@endphp

@section('title', ($isRtl ? 'تفاصيل المعدة' : 'Equipment Details') . ' - ' . $equipment->name)

@section('content')
<div class="max-w-5xl mx-auto space-y-8">
    <div class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4">
        <div class="flex items-center gap-3">
            <a href="{{ route('equipment.index') }}" class="p-2 hover:bg-slate-100 rounded-xl transition-colors">
                <i data-lucide="arrow-{{ $isRtl ? 'right' : 'left' }}" class="w-5 h-5 text-slate-600"></i>
            </a>
            <div>
                <h1 class="text-3xl font-black text-slate-800">{{ $isRtl ? 'تفاصيل المعدة' : 'Equipment Details' }}</h1>
                <p class="text-slate-500 mt-1">{{ $equipment->name }}</p>
            </div>
        </div>

        <div class="flex flex-wrap gap-3">
            <a href="{{ route('equipment.edit', $equipment) }}" class="inline-flex items-center gap-2 px-5 py-3 bg-blue-600 hover:bg-blue-700 text-white rounded-xl font-semibold shadow-lg shadow-blue-500/20 transition-all">
                <i data-lucide="pencil" class="w-5 h-5"></i>
                {{ $isRtl ? 'تعديل' : 'Edit' }}
            </a>
            <form action="{{ route('equipment.destroy', $equipment) }}" method="POST" onsubmit="return confirm('{{ $isRtl ? 'حذف المعدة؟' : 'Delete this equipment?' }}')">
                @csrf
                @method('DELETE')
                <button type="submit" class="inline-flex items-center gap-2 px-5 py-3 bg-rose-600 hover:bg-rose-700 text-white rounded-xl font-semibold shadow-lg shadow-rose-500/20 transition-all">
                    <i data-lucide="trash-2" class="w-5 h-5"></i>
                    {{ $isRtl ? 'حذف' : 'Delete' }}
                </button>
            </form>
        </div>
    </div>

    <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
        <div class="lg:col-span-2 bg-white rounded-3xl border-2 border-slate-200 p-8 space-y-6">
            <div class="flex items-start gap-5">
                @if($equipment->photo)
                    <img src="{{ asset('storage/' . $equipment->photo) }}" class="w-28 h-28 rounded-3xl object-cover border border-slate-200" alt="">
                @else
                    <div class="w-28 h-28 rounded-3xl bg-slate-100 flex items-center justify-center border border-slate-200">
                        <i data-lucide="dumbbell" class="w-10 h-10 text-slate-500"></i>
                    </div>
                @endif

                <div class="flex-1">
                    <div class="flex flex-wrap items-center gap-3">
                        <span class="px-3 py-1.5 rounded-full bg-slate-100 text-slate-700 text-xs font-bold uppercase">{{ $equipment->category }}</span>
                        <span class="px-3 py-1.5 rounded-full text-xs font-bold
                            {{ $equipment->status === 'active' ? 'bg-emerald-100 text-emerald-700' :
                               ($equipment->status === 'maintenance' ? 'bg-amber-100 text-amber-700' :
                               ($equipment->status === 'broken' ? 'bg-rose-100 text-rose-700' : 'bg-slate-100 text-slate-700')) }}">
                            {{ strtoupper($equipment->status) }}
                        </span>
                        @if($equipment->is_warranty_valid)
                            <span class="px-3 py-1.5 rounded-full bg-blue-100 text-blue-700 text-xs font-bold">{{ $isRtl ? 'ضمان ساري' : 'Warranty' }}</span>
                        @endif
                    </div>

                    <h2 class="text-2xl font-black text-slate-800 mt-3">{{ $equipment->name }}</h2>
                    <p class="text-slate-500 mt-1">
                        {{ $equipment->brand ?? '—' }} {{ $equipment->model ? '• ' . $equipment->model : '' }}
                    </p>
                    @if($equipment->serial_number)
                        <p class="text-xs text-slate-400 mt-2 font-mono">{{ $equipment->serial_number }}</p>
                    @endif
                </div>
            </div>

            @if($equipment->description)
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'الوصف' : 'Description' }}</p>
                    <p class="text-slate-800 leading-relaxed">{{ $equipment->description }}</p>
                </div>
            @endif

            <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'الموقع' : 'Location' }}</p>
                    <p class="font-bold text-slate-800">{{ $equipment->location ?? '—' }}</p>
                </div>
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'تاريخ الشراء' : 'Purchase Date' }}</p>
                    <p class="font-bold text-slate-800">{{ $equipment->purchase_date?->format('Y-m-d') ?? '—' }}</p>
                </div>
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'سعر الشراء' : 'Purchase Price' }}</p>
                    <p class="font-bold text-slate-800">
                        {{ $equipment->purchase_price !== null ? number_format((float)$equipment->purchase_price, 2) . ' ' . $currency : '—' }}
                    </p>
                </div>
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'انتهاء الضمان' : 'Warranty Expiry' }}</p>
                    <p class="font-bold text-slate-800">{{ $equipment->warranty_expiry?->format('Y-m-d') ?? '—' }}</p>
                </div>
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'آخر صيانة' : 'Last Maintenance' }}</p>
                    <p class="font-bold text-slate-800">{{ $equipment->last_maintenance?->format('Y-m-d') ?? '—' }}</p>
                </div>
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'الصيانة القادمة' : 'Next Maintenance' }}</p>
                    <p class="font-bold {{ $equipment->next_maintenance && $equipment->next_maintenance->lte(now()->addDays(7)) ? 'text-rose-700' : 'text-slate-800' }}">
                        {{ $equipment->next_maintenance?->format('Y-m-d') ?? '—' }}
                    </p>
                </div>
            </div>

            @if($equipment->notes)
                <div class="p-4 bg-slate-50 rounded-2xl border border-slate-200">
                    <p class="text-xs text-slate-500 mb-1">{{ $isRtl ? 'ملاحظات' : 'Notes' }}</p>
                    <p class="text-slate-800 leading-relaxed">{{ $equipment->notes }}</p>
                </div>
            @endif
        </div>

        <div class="bg-white rounded-3xl border-2 border-slate-200 p-8 space-y-6">
            <h2 class="text-lg font-black text-slate-800">{{ $isRtl ? 'الصيانة' : 'Maintenance' }}</h2>

            @if($equipment->status === 'active')
                <form action="{{ route('equipment.maintenance', $equipment) }}" method="POST" onsubmit="return confirm('{{ $isRtl ? 'إدخال المعدة للصيانة؟' : 'Put this equipment into maintenance?' }}')">
                    @csrf
                    <button type="submit" class="w-full inline-flex items-center justify-center gap-2 px-6 py-3 bg-amber-500 hover:bg-amber-600 text-white rounded-xl font-bold transition-colors">
                        <i data-lucide="wrench" class="w-5 h-5"></i>
                        {{ $isRtl ? 'بدء الصيانة' : 'Start Maintenance' }}
                    </button>
                </form>
            @endif

            @if($equipment->status === 'maintenance')
                <div class="p-4 bg-amber-50 border border-amber-200 rounded-2xl text-amber-800 text-sm">
                    {{ $isRtl ? 'المعدة حالياً في حالة صيانة. يمكنك إنهاء الصيانة وتحديد الموعد القادم.' : 'This equipment is currently under maintenance. You can complete it and set next date.' }}
                </div>

                <form action="{{ route('equipment.complete-maintenance', $equipment) }}" method="POST" class="space-y-4">
                    @csrf
                    <div>
                        <label class="block text-sm font-bold text-slate-700 mb-2">{{ $isRtl ? 'موعد الصيانة القادمة' : 'Next Maintenance' }}</label>
                        <input type="date" name="next_maintenance" value="{{ old('next_maintenance', $equipment->next_maintenance?->format('Y-m-d')) }}"
                               class="w-full px-4 py-3 bg-slate-50 border-2 border-slate-200 rounded-xl focus:border-emerald-500 focus:ring-4 focus:ring-emerald-500/10 outline-none transition-all">
                    </div>
                    <div>
                        <label class="block text-sm font-bold text-slate-700 mb-2">{{ $isRtl ? 'ملاحظات الصيانة' : 'Maintenance Notes' }}</label>
                        <textarea name="notes" rows="3"
                                  class="w-full px-4 py-3 bg-slate-50 border-2 border-slate-200 rounded-xl focus:border-emerald-500 focus:ring-4 focus:ring-emerald-500/10 outline-none transition-all resize-none">{{ old('notes') }}</textarea>
                    </div>
                    <button type="submit" class="w-full inline-flex items-center justify-center gap-2 px-6 py-3 bg-emerald-600 hover:bg-emerald-700 text-white rounded-xl font-bold transition-colors">
                        <i data-lucide="check" class="w-5 h-5"></i>
                        {{ $isRtl ? 'إنهاء الصيانة' : 'Complete Maintenance' }}
                    </button>
                </form>
            @endif

            @if(!in_array($equipment->status, ['active', 'maintenance']))
                <div class="p-4 bg-slate-50 border border-slate-200 rounded-2xl text-slate-700 text-sm">
                    {{ $isRtl ? 'حالة المعدة الحالية لا تسمح بإجراءات صيانة مباشرة من هنا.' : 'Current status does not allow maintenance actions here.' }}
                </div>
            @endif
        </div>
    </div>
</div>
@endsection