@extends('sur-mesure.layouts.app')

@section('title', __('surmesure.quotes'))

@section('styles')
    <style>
        .sm-table { width: 100%; border-collapse: collapse; }
        .sm-table th {
            text-align: left; font-size: 12px; text-transform: uppercase;
            letter-spacing: .5px; color: #888; padding: 12px 14px; border-bottom: 1px solid #eee;
        }
        .sm-table td { padding: 14px; border-bottom: 1px solid #f4f4f4; vertical-align: middle; }
        .sm-table tr:last-child td { border-bottom: none; }

        .sm-status {
            font-size: 11px; text-transform: uppercase; letter-spacing: .5px;
            border-radius: 20px; padding: 4px 12px; white-space: nowrap;
        }
        .sm-status-pending { background: #fff8e5; color: #8a6d18; }
        .sm-status-quoted { background: #eef3fb; color: #2f5687; }
        .sm-status-accepted { background: #eaf8ee; color: #2c6b3f; }
        .sm-status-declined, .sm-status-cancelled { background: #fff1f1; color: #a12626; }

        .sm-filters { display: flex; gap: 10px; margin: 24px 0; flex-wrap: wrap; }
        .sm-chip {
            border: 1px solid #ddd; border-radius: 30px; padding: 9px 18px;
            text-decoration: none; color: #555; font-size: 14px;
        }
        .sm-chip.is-active { border-color: #C3AD66; background: #faf6ea; color: #8a7430; font-weight: 600; }

        .sm-view {
            border: none; border-radius: 8px; padding: 8px 14px; font-size: 13px;
            background: #f3eeda; color: #8a7430; text-decoration: none;
        }

        .sm-empty { text-align: center; padding: 50px 20px; color: #999; }
    </style>
@endsection

@section('content')
    <div class="sm-page">
        <div class="sm-card">
            <h3>{{ __('surmesure.quotes') }}</h3>
            <p class="sm-lead">{{ __('surmesure.quotes_intro') }}</p>

            @if(session('success'))
                <div class="sm-alert-success">{{ session('success') }}</div>
            @endif

            <div class="sm-filters">
                <a href="{{ route('sur-mesure.quotes.index') }}"
                   class="sm-chip {{ request('status') ? '' : 'is-active' }}">{{ __('surmesure.filter_all') }}</a>
                @foreach(['pending', 'quoted', 'accepted', 'declined'] as $status)
                    <a href="{{ route('sur-mesure.quotes.index', ['status' => $status]) }}"
                       class="sm-chip {{ request('status') === $status ? 'is-active' : '' }}">
                        {{ __('surmesure.quote_status_' . $status) }}
                    </a>
                @endforeach
            </div>

            @if($quotes->isEmpty())
                <div class="sm-empty">{{ __('surmesure.no_quote') }}</div>
            @else
                <div style="overflow-x:auto;">
                    <table class="sm-table">
                        <thead>
                            <tr>
                                <th>{{ __('surmesure.creation_name') }}</th>
                                <th>{{ __('surmesure.customer') }}</th>
                                <th>{{ __('surmesure.date') }}</th>
                                <th>{{ __('surmesure.quote_price') }}</th>
                                <th>{{ __('surmesure.status') }}</th>
                                <th></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($quotes as $quote)
                                <tr>
                                    <td><strong>{{ $quote->product->product_name ?? '—' }}</strong></td>
                                    <td>
                                        {{ $quote->buyer->name ?? '—' }}
                                        <div style="font-size:12px;color:#999;">{{ $quote->buyer->email ?? '' }}</div>
                                    </td>
                                    <td>{{ $quote->created_at->format('d/m/Y') }}</td>
                                    <td>
                                        {{ $quote->quoted_price
                                            ? number_format((float) $quote->quoted_price, 2, ',', ' ') . ' ' . $quote->quoted_currency
                                            : '—' }}
                                    </td>
                                    <td>
                                        <span class="sm-status sm-status-{{ $quote->status }}">
                                            {{ __('surmesure.quote_status_' . $quote->status) }}
                                        </span>
                                    </td>
                                    <td style="text-align:right;">
                                        <a class="sm-view" href="{{ route('sur-mesure.quotes.show', $quote) }}">{{ __('surmesure.view') }}</a>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <div style="margin-top:24px;">
                    {{ $quotes->links() }}
                </div>
            @endif
        </div>
    </div>
@endsection