@extends('layouts.dashboard')

@section('title', trans('dashboard.nav_quotes'))
@section('header_title', trans('dashboard.nav_quotes'))

@section('content')
<div class="space-y-6">
    <div class="p-4 rounded-2xl bg-navy-900 border border-slate-800 flex flex-col sm:flex-row items-center justify-between gap-4 text-xs">
        <form method="GET" class="flex items-center gap-3">
            <input type="text" name="search" value="{{ request('search') }}" placeholder="{{ trans('dashboard.search_quotes') }}" class="rounded-xl bg-navy-950 border border-slate-700 text-slate-100 px-3 py-2 w-64 focus:border-brand-500 focus:outline-none">
            <button class="px-4 py-2 rounded-xl bg-slate-800 hover:bg-slate-700 text-slate-200 font-bold">{{ trans('dashboard.filter_btn') }}</button>
        </form>
        <a href="{{ route('dashboard.quotes.create') }}" class="px-4 py-2 rounded-xl bg-brand-500 hover:bg-brand-600 text-white font-bold">{{ trans('dashboard.new_quote') }}</a>
    </div>

    <div class="bg-navy-900 border border-slate-800 rounded-2xl overflow-hidden">
        <table class="w-full text-xs">
            <thead class="bg-navy-950/60 text-slate-400 border-b border-slate-800">
                <tr>
                    <th class="p-4 text-start">{{ trans('dashboard.quote_number') }}</th>
                    <th class="p-4 text-start">{{ trans('dashboard.th_buyer') }}</th>
                    <th class="p-4 text-start">{{ trans('dashboard.th_total') }}</th>
                    <th class="p-4 text-start">{{ trans('dashboard.status_th') }}</th>
                    <th class="p-4 text-start">{{ trans('dashboard.action') }}</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-800/60 text-slate-300">
                @forelse($quotes as $quote)
                    <tr>
                        <td class="p-4 font-bold text-white code-font">
                            <a href="{{ route('dashboard.quotes.show', $quote->uuid) }}" class="hover:text-brand-400">{{ $quote->quote_number }}</a>
                        </td>
                        <td class="p-4 text-emerald-400 font-bold code-font whitespace-nowrap">
                            <span class="inline-flex items-center gap-1.5" dir="ltr">
                                <x-riyal-symbol class="w-[1.05em] h-[1.05em]" />
                                <span>{{ number_format($quote->total, 2) }}</span>
                            </span>
                        </td>
                        <td class="p-4">
                            <a href="{{ route('dashboard.quotes.show', $quote->uuid) }}" class="text-brand-400 font-semibold hover:underline">{{ trans('dashboard.details_link') }}</a>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="5" class="text-center py-12 text-slate-500">{{ trans('dashboard.no_quotes') }}</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
        @if($quotes->hasPages())
            <div class="p-4 border-t border-slate-800">{{ $quotes->links() }}</div>
        @endif
    </div>
</div>
@endsection