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

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

@section('styles')
    <style>
        .sm-quote-grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 26px; align-items: start; }
        @media (max-width: 991px) { .sm-quote-grid { grid-template-columns: 1fr; } }

        .sm-spec { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-bottom: 1px solid #f4f4f4; }
        .sm-spec dt { color: #777; margin: 0; }
        .sm-spec dd { font-weight: 600; margin: 0; text-align: right; }

        .sm-files { margin-top: 16px; display: flex; flex-wrap: wrap; gap: 10px; }
        .sm-file {
            display: inline-flex; align-items: center; gap: 8px;
            background: #f7f4ea; color: #8a7430; border-radius: 10px;
            padding: 8px 14px; font-size: 13px; text-decoration: none;
        }

        .sm-client-message {
            background: #fbfbfb; border: 1px solid #eee; border-radius: 12px;
            padding: 16px; margin-top: 18px; color: #555; line-height: 1.7;
        }

        .sm-status-banner {
            border-radius: 12px; padding: 16px 20px; margin-bottom: 22px; font-weight: 600;
        }
        .sm-status-banner.is-quoted { background: #eef3fb; color: #2f5687; }
        .sm-status-banner.is-accepted { background: #eaf8ee; color: #2c6b3f; }
        .sm-status-banner.is-declined,
        .sm-status-banner.is-cancelled { background: #fff1f1; color: #a12626; }
    </style>
@endsection

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

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

        <div class="sm-quote-grid">
            {{-- La demande du client --}}
            <div class="sm-card">
                <h3>{{ $quote->product->product_name ?? '—' }}</h3>
                <p class="sm-lead">
                    {{ __('surmesure.quote_from', ['name' => $quote->buyer->name ?? '']) }}
                    · {{ $quote->created_at->format('d/m/Y H:i') }}
                </p>

                <dl style="margin:0;">
                    @foreach($quote->answers_json ?? [] as $label => $value)
                        <div class="sm-spec">
                            <dt>{{ $label }}</dt>
                            <dd>{{ $value }}</dd>
                        </div>
                    @endforeach
                </dl>

                @if(!empty($quote->files_json))
                    <div class="sm-files">
                        @foreach($quote->files_json as $label => $path)
                            <a class="sm-file" href="{{ asset('storage/' . $path) }}" target="_blank" rel="noopener">
                                📎 {{ $label }}
                            </a>
                        @endforeach
                    </div>
                @endif

                @if($quote->message)
                    <div class="sm-client-message">{{ $quote->message }}</div>
                @endif

                <div style="margin-top:22px;padding-top:18px;border-top:1px solid #f0f0f0;color:#888;font-size:14px;">
                    {{ __('surmesure.customer') }} : {{ $quote->buyer->email ?? '' }}
                    @if($quote->buyer?->phone) · {{ $quote->buyer->phone }} @endif
                </div>
            </div>

            {{-- Votre réponse --}}
            <div class="sm-card">
                @if($quote->isPending())
                    <h3>{{ __('surmesure.quote_answer_title') }}</h3>
                    <p class="sm-lead">{{ __('surmesure.quote_answer_intro') }}</p>

                    @if($errors->any())
                        <div class="sm-alert-error">
                            <ul>
                                @foreach($errors->all() as $error)<li>{{ $error }}</li>@endforeach
                            </ul>
                        </div>
                    @endif

                    <form action="{{ route('sur-mesure.quotes.respond', $quote) }}" method="POST">
                        @csrf

                        <div class="sm-field">
                            <label for="quoted_price">{{ __('surmesure.quote_price') }} ({{ $quote->product->currency }}) *</label>
                            <input type="number" step="0.01" min="0" id="quoted_price" name="quoted_price"
                                   value="{{ old('quoted_price', $quote->product->product_price) }}" required>
                        </div>

                        <div class="sm-field" style="margin-top:16px;">
                            <label for="quoted_delay_days">{{ __('surmesure.production_delay') }}</label>
                            <input type="number" min="0" max="3650" id="quoted_delay_days" name="quoted_delay_days"
                                   value="{{ old('quoted_delay_days', $quote->product->production_delay_days) }}">
                            <span class="sm-hint">{{ __('surmesure.production_delay_hint') }}</span>
                        </div>

                        <div class="sm-field" style="margin-top:16px;">
                            <label for="maker_message">{{ __('surmesure.quote_maker_message') }}</label>
                            <textarea id="maker_message" name="maker_message" rows="5"
                                      placeholder="{{ __('surmesure.quote_maker_message_placeholder') }}">{{ old('maker_message') }}</textarea>
                        </div>

                        <div class="sm-actions">
                            <button class="rts-btn btn-primary">{{ __('surmesure.quote_send_answer') }}</button>
                        </div>
                    </form>

                    <form action="{{ route('sur-mesure.quotes.decline', $quote) }}" method="POST"
                          style="margin-top:20px;padding-top:20px;border-top:1px solid #f0f0f0;"
                          onsubmit="return confirm(@js(__('surmesure.quote_decline_confirm')));">
                        @csrf
                        <button style="border:none;background:#fff1f1;color:#a12626;border-radius:10px;padding:12px 20px;cursor:pointer;">
                            {{ __('surmesure.quote_decline') }}
                        </button>
                    </form>
                @else
                    <div class="sm-status-banner is-{{ $quote->status }}">
                        {{ __('surmesure.quote_status_' . $quote->status) }}
                    </div>

                    @if($quote->quoted_price)
                        <h3>{{ number_format((float) $quote->quoted_price, 2, ',', ' ') }} {{ $quote->quoted_currency }}</h3>
                        @if($quote->quoted_delay_days)
                            <p class="sm-lead">{{ __('surmesure.delay') }} : {{ $quote->quoted_delay_days }} {{ __('surmesure.days') }}</p>
                        @endif
                    @endif

                    @if($quote->maker_message)
                        <div class="sm-client-message">{{ $quote->maker_message }}</div>
                    @endif

                    <p style="margin-top:20px;color:#888;font-size:14px;">
                        @if($quote->quoted_at)
                            {{ __('surmesure.quote_sent_on') }} {{ $quote->quoted_at->format('d/m/Y H:i') }}
                        @endif
                    </p>
                @endif
            </div>
        </div>
    </div>
@endsection