@component('yas_member::emails.consignment-layout')
<div style="font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; color: #1e293b; line-height: 1.6; max-width: 600px; margin: 0 auto;">
    
    <!-- Header Greeting -->
    <div style="margin-bottom: 24px;">
        <h2 style="font-size: 20px; font-weight: 600; color: #0f172a; margin: 0 0 12px 0;">
            
            @lang('yas_theme::app.emails.dear', ['customer_name' => $adminName]) 👋
        </h2>

        <p style="font-size: 15px; color: #475569; margin: 0; line-height: 1.5;">
            @lang('member::app.member.emails.consignment.description')
        </p>
    </div>

    @php
        $keys = ['b','db','ss','c','l','k','or','cr','sr','cc','ac','rc'];
        $selectedAttributes = [];
        foreach ($keys as $key) {
            if (!empty($consignment->$key) && $consignment->$key == 1) {
                $selectedAttributes[] = $attributes[$key] ?? strtoupper($key);
            }
        }
        $comesWithText = count($selectedAttributes) > 0 ? implode(', ', $selectedAttributes) : '-';
        $formattedPrice = !empty($consignment->price) ? core()->formatBasePrice((float) $consignment->price) : '-';
    @endphp

    <!-- Consignment Details Table -->
    <div style="border: 1px solid #e2e8f0; border-radius: 8px; overflow: hidden; background-color: #ffffff; margin-bottom: 24px;">
        
        <div style="background-color: #f8fafc; padding: 12px 16px; border-bottom: 1px solid #e2e8f0;">
            <h3 style="margin: 0; font-size: 14px; font-weight: 600; color: #334155; text-transform: uppercase; letter-spacing: 0.05em;">
                @lang('member::app.consignment.consignment_no'): <span style="color: #0f172a;">{{ $consignment->consignment_no ?? '-' }}</span>
            </h3>
        </div>

        <table style="width: 100%; border-collapse: collapse; font-size: 14px; text-align: left;">
            <tbody>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b; width: 35%;">@lang('member::app.consignment.name')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->name ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.email')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->email ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.phone-number')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->contact ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.nric')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->nric ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.brand')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->brand_label ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.model')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->model ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.material')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->material ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.color')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->color ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.hardware')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->hardware ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.stamp')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->stamp ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.condition')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->condition ?? '-' }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.price')</td>
                    <td style="padding: 10px 16px; font-weight: 600; color: #0f172a;">{{ $formattedPrice }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.comes_with')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $comesWithText }}</td>
                </tr>
                <tr style="border-bottom: 1px solid #f1f5f9; background-color: #fafafa;">
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b;">@lang('member::app.consignment.date')</td>
                    <td style="padding: 10px 16px; color: #0f172a;">{{ $consignment->consignment_date ?? '-' }}</td>
                </tr>
                <tr>
                    <td style="padding: 10px 16px; font-weight: 600; color: #64748b; vertical-align: top;">@lang('member::app.consignment.item_description')</td>
                    <td style="padding: 10px 16px; color: #0f172a; line-height: 1.5;">{{ $consignment->item_description ?? '-' }}</td>
                </tr>
            </tbody>
        </table>
    </div>
</div>
@endcomponent