@extends('layouts.app')
@section('title', 'Quotation ' . $quotation->quote_no)
@section('header', 'Quotation ' . $quotation->quote_no)

@section('content')
<div class="row" style="margin-bottom: 20px;">
    <div>
        <div style="font-size: 12px; color: #8e9ab4; margin-bottom: 4px;">
            <a href="{{ route('quotations.index') }}" style="color: #6d59ff; text-decoration: none;">← Back to Quotations</a>
        </div>
        <h1 style="margin: 0 0 4px 0;">{{ $quotation->quote_no }}</h1>
        <p style="color: #8e9ab4; margin: 0;">{{ $quotation->customer?->name }} · {{ $quotation->customer?->phone }}</p>
    </div>
    <div>
        @if(auth()->user()?->hasPermission('quotations.print'))
            <a class="btn" target="_blank" href="{{ route('quotations.print', $quotation) }}">
                🖨️ Print / PDF
            </a>
        @endif
    </div>
</div>

<div class="panel" style="margin-top: 0;">
    <table style="width: 100%;">
        <thead>
            <tr>
                <th>Description</th>
                <th>Qty</th>
                <th>Unit Price</th>
                <th>Discount</th>
                <th>Line Total</th>
            </tr>
        </thead>
        <tbody>
            @foreach($quotation->items as $i)
                <tr>
                    <td><strong style="color: #fff;">{{ $i->description }}</strong></td>
                    <td>{{ $i->quantity }}</td>
                    <td>{{ format_inr($i->unit_price) }}</td>
                    <td>{{ format_inr($i->discount) }}</td>
                    <td><strong style="color: #34d399;">{{ format_inr($i->line_total) }}</strong></td>
                </tr>
            @endforeach
        </tbody>
    </table>

    <div style="margin-top: 24px; padding-top: 16px; border-top: 1px solid #1d2740; display: flex; justify-content: flex-end;">
        <div style="min-width: 240px; text-align: right;">
            <p style="margin: 4px 0; color: #8e9ab4;">Subtotal: <strong style="color: #fff;">{{ format_inr($quotation->subtotal) }}</strong></p>
            <p style="margin: 4px 0; color: #8e9ab4;">Tax: <strong style="color: #fff;">{{ format_inr($quotation->tax) }}</strong></p>
            <h2 style="margin: 8px 0 0 0; color: #34d399; font-size: 20px;">Total: {{ format_inr($quotation->total) }}</h2>
        </div>
    </div>

    @if(auth()->user()?->hasPermission('quotations.approve'))
        <div style="margin-top: 24px; padding-top: 16px; border-top: 1px solid #1d2740;">
            <form method="POST" action="{{ route('quotations.status', $quotation) }}" style="display: flex; gap: 10px; align-items: center;">
                @csrf
                @method('PATCH')
                <label style="margin: 0; white-space: nowrap;">Change Status:</label>
                <select name="status" style="width: auto; max-width: 180px; margin: 0;">
                    <option value="draft" {{ $quotation->status === 'draft' ? 'selected' : '' }}>Draft</option>
                    <option value="sent" {{ $quotation->status === 'sent' ? 'selected' : '' }}>Sent</option>
                    <option value="accepted" {{ $quotation->status === 'accepted' ? 'selected' : '' }}>Accepted</option>
                    <option value="rejected" {{ $quotation->status === 'rejected' ? 'selected' : '' }}>Rejected</option>
                    <option value="expired" {{ $quotation->status === 'expired' ? 'selected' : '' }}>Expired</option>
                    <option value="won" {{ $quotation->status === 'won' ? 'selected' : '' }}>Won</option>
                    <option value="lost" {{ $quotation->status === 'lost' ? 'selected' : '' }}>Lost</option>
                </select>
                <button class="btn" style="padding: 7px 14px;">Update Status</button>
            </form>
        </div>
    @endif
</div>
@endsection