@extends('emails.layout')

@section('document-title')
@yield('title') — {{ $details['number'] }}
@endsection

@section('content')
                    @php
                        $isConfirmation = $isConfirmation ?? false;
                        $fields = $isConfirmation
                            ? ['Order number' => 'number', 'Company' => 'company', 'Community' => 'department', 'Ordered by' => 'creator', 'Order Date' => 'date', 'Status' => 'status']
                            : ['Order number' => 'number', 'Company' => 'company', 'Community' => 'department', 'Created by' => 'creator', 'Order date/time' => 'date', 'Current status' => 'status'];
                    @endphp
                    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" style="font-size:14px;">
                        @foreach ($fields as $label => $field)
                            <tr>
                                <td style="padding:7px 12px 7px 0;width:36%;vertical-align:top;color:#52647c;">{{ $label }}</td>
                                <td style="padding:7px 0;word-break:break-word;font-weight:bold;">{{ $details[$field] ?? '—' }}
                                    @if ($field === 'creator' && $details['creator_email'])
                                        <div style="font-weight:normal;font-size:12px;color:#52647c;">{{ $details['creator_email'] }}</div>
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                    </table>
                    @if (!empty($details['shipping_address']))
                    <p style="font-size:14px;"><strong>Shipping address:</strong> {{ $details['shipping_address'] }}</p>
                    @endif
                    <h2 style="margin:28px 0 12px;font-size:17px;">{{ $isConfirmation ? 'Order Summary' : 'Order items' }}</h2>
                    <table class="order-items" width="100%" cellpadding="0" cellspacing="0" style="width:100%;border-collapse:collapse;table-layout:fixed;font-size:13px;">
                        <thead><tr style="background-color:#e8eef6;">
                            <th scope="col" align="left" style="width:{{ ($showAmounts || $isConfirmation) ? '52%' : '75%' }};padding:12px;">{{ $isConfirmation ? 'Item' : 'Product / variant' }}</th>
                            <th scope="col" align="right" style="width:{{ ($showAmounts || $isConfirmation) ? '18%' : '25%' }};padding:12px;">{{ $isConfirmation ? 'Quantity' : 'Qty' }}</th>
                            @if ($showAmounts || $isConfirmation)
                            <th scope="col" align="right" style="width:30%;padding:12px;">{{ $isConfirmation ? 'Total Units' : 'Total' }}</th>
                            @endif
                        </tr></thead>
                        <tbody>
                            @foreach ($details['items'] as $item)
                                <tr>
                                    <td style="padding:12px;border-bottom:1px solid #e8eef6;word-break:break-word;">
                                        <strong>{{ $item['name'] }}</strong>
                                        @if ($item['variant'])<div style="color:#52647c;">{{ $item['variant'] }}</div>@endif
                                        @if ($item['size'])<div style="color:#52647c;">Size: {{ $item['size'] }}</div>@endif
                                    </td>
                                    <td align="right" style="padding:12px;border-bottom:1px solid #e8eef6;">{{ $item['quantity_label'] }}</td>
                                    @if ($showAmounts || $isConfirmation)
                                    <td align="right" style="padding:12px;border-bottom:1px solid #e8eef6;word-break:break-word;">{{ $isConfirmation ? $item['quantity_label'] : ($item['total'] ?? '—') }}</td>
                                    @endif
                                </tr>
                            @endforeach
                        </tbody>
                        <tfoot><tr>
                            <th scope="row" align="left" style="padding:14px 12px;">{{ $isConfirmation ? 'Total Units' : 'Total' }}</th>
                            <td align="right" style="padding:14px 12px;font-weight:bold;">{{ $details['quantity_label'] }}</td>
                            @if ($showAmounts || $isConfirmation)
                            <td align="right" style="padding:14px 12px;font-weight:bold;">{{ $isConfirmation ? $details['quantity_label'] : ($details['total'] ?? '—') }}</td>
                            @endif
                        </tr></tfoot>
                    </table>
                    @if (! $isConfirmation && $showAmounts && $details['total'] === null)
                        <p style="font-size:12px;color:#52647c;">An amount is unavailable because pricing has not been recorded for every item.</p>
                    @endif
                    @if ($details['status'] === 'Shipped' && ($details['courier'] || $details['tracking_id']))
                        <p style="padding:14px;background-color:#e8eef6;font-size:14px;">
                            @if ($details['courier'])<strong>Courier:</strong> {{ $details['courier'] }}<br>@endif
                            @if ($details['tracking_id'])<strong>Tracking ID:</strong> {{ $details['tracking_id'] }}@endif
                        </p>
                    @endif
                    <table class="email-button" role="presentation" cellpadding="0" cellspacing="0" style="margin:28px 0 12px;">
                        <tr><td bgcolor="#243f6e" style="border-radius:6px;text-align:center;">
                            <a href="{{ $orderUrl }}" style="display:inline-block;padding:13px 24px;border:1px solid #243f6e;border-radius:6px;color:#ffffff;text-decoration:none;font-weight:bold;font-size:14px;">View Order</a>
                        </td></tr>
                    </table>
                    <p style="font-size:12px;color:#52647c;word-break:break-all;">If the button does not work, open:<br>@if ($isConfirmation)Button not working? Copy and paste this link into your browser: @endif<a href="{{ $orderUrl }}" style="color:#243f6e;">{{ $orderUrl }}</a></p>
@endsection