@extends('layouts.app')

@section('content')
    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="mb-6">
                <form action="{{ route('admin.inquiries.index') }}" method="GET" class="w-full">
                    <input type="text" name="search" value="{{ request('search') }}" 
                           placeholder="{{ app()->getLocale() == 'ar' ? 'البحث عن طلب (اسم، هاتف، سيارة...)' : 'Search inquiry (name, phone, car...)' }}"
                           class="w-full bg-[#111] border border-gray-800 rounded-xl px-4 py-3 text-sm text-white focus:ring-[#d4af37] focus:border-[#d4af37] transition-all {{ app()->getLocale() == 'ar' ? 'text-right' : 'text-left' }}">
                </form>
            </div>

            <div class="bg-[#111] border border-gray-800 rounded-2xl overflow-hidden">
                <table class="w-full {{ app()->getLocale() == 'ar' ? 'text-right' : 'text-left' }}">
                    <thead class="bg-black/50 text-gray-500 text-xs uppercase">
                        <tr>
                            <th class="px-6 py-4">{{ app()->getLocale() == 'ar' ? 'العميل' : 'Customer' }}</th>
                            <th class="px-6 py-4">{{ app()->getLocale() == 'ar' ? 'السيارة' : 'Car' }}</th>
                            <th class="px-6 py-4">{{ app()->getLocale() == 'ar' ? 'نوع الطلب' : 'Request Type' }}</th>
                            <th class="px-6 py-4">{{ app()->getLocale() == 'ar' ? 'الحالة' : 'Status' }}</th>
                            <th class="px-6 py-4">{{ app()->getLocale() == 'ar' ? 'التاريخ' : 'Date' }}</th>
                            <th class="px-6 py-4">{{ app()->getLocale() == 'ar' ? 'العمليات' : 'Actions' }}</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-800">
                        @foreach($inquiries as $inquiry)
                        <tr class="hover:bg-white/5 transition-colors">
                            <td class="px-6 py-4">
                                <div class="font-bold text-sm text-white">{{ $inquiry->customer->name }}</div>
                                <div class="text-[10px] text-gray-500">{{ $inquiry->customer->phone }}</div>
                            </td>
                            <td class="px-6 py-4 text-sm">{{ $inquiry->car->title }}</td>
                            <td class="px-6 py-4 text-xs">{{ $inquiry->request_type }}</td>
                            <td class="px-6 py-4">
                                <span class="text-[10px] px-2 py-0.5 rounded-full 
                                    {{ $inquiry->status == 'new' ? 'bg-red-500/20 text-red-400' : ($inquiry->status == 'contacted' ? 'bg-blue-500/20 text-blue-400' : 'bg-green-500/20 text-green-400') }}">
                                    {{ $inquiry->status }}
                                </span>
                            </td>
                            <td class="px-6 py-4 text-xs text-gray-500">{{ $inquiry->created_at->format('Y/m/d H:i') }}</td>
                            <td class="px-6 py-4">
                                <a href="{{ route('admin.inquiries.show', $inquiry->id) }}" class="text-[#d4af37] hover:underline text-xs">{{ app()->getLocale() == 'ar' ? 'عرض التفاصيل' : 'View Details' }}</a>
                            </td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
                <div class="p-4 border-t border-gray-800">
                    {{ $inquiries->links() }}
                </div>
            </div>
        </div>
    </div>
@endsection