@extends('emails.layout')

@section('title', 'Payment Received')

@section('content')
    <h2 class="greeting">Payment Confirmed! 💳</h2>
    
    <p class="message">
        Hello {{ $payment->customer->name }}, we've successfully received your payment. Thank you for choosing AFINET!
    </p>
    
    <div class="success-box">
        <strong>✅ Payment Successful!</strong><br>
        Transaction Reference: <strong>{{ $payment->transaction_reference }}</strong><br>
        Payment Date: {{ $payment->created_at->format('F j, Y \a\t g:i A') }}
    </div>
    
    <h3 style="color: #111827; font-size: 18px; margin: 32px 0 16px 0;">Payment Details</h3>
    
    <table class="details-table">
        <tr>
            <td>Amount Paid</td>
            <td style="color: #22c55e; font-size: 20px;">${{ number_format($payment->amount, 2) }}</td>
        </tr>
        <tr>
            <td>Payment Method</td>
            <td style="text-transform: capitalize;">{{ $payment->payment_method }}</td>
        </tr>
        <tr>
            <td>Currency</td>
            <td>{{ $payment->currency }}</td>
        </tr>
        <tr>
            <td>Status</td>
            <td><span style="background: #dcfce7; color: #166534; padding: 4px 12px; border-radius: 6px; font-size: 13px; font-weight: 600;">COMPLETED</span></td>
        </tr>
    </table>
    
    @if($payment->salesOrder)
    <h3 style="color: #111827; font-size: 18px; margin: 32px 0 16px 0;">Order Information</h3>
    
    <table class="details-table">
        <tr>
            <td>Order Number</td>
            <td>{{ $payment->salesOrder->order_number }}</td>
        </tr>
        <tr>
            <td>Package</td>
            <td>{{ $payment->salesOrder->package->name }}</td>
        </tr>
        <tr>
            <td>Monthly Subscription</td>
            <td>${{ number_format($payment->salesOrder->monthly_subscription, 2) }}/month</td>
        </tr>
    </table>
    @endif
    
    <div style="text-align: center; margin: 40px 0;">
        <a href="{{ config('app.url') }}/payments" class="btn-secondary">
            View Payment History
        </a>
    </div>
    
    <div class="info-box">
        <strong>📧 Receipt:</strong> A detailed receipt has been attached to this email for your records. Please keep it for future reference.
    </div>
    
    <p class="message">
        Your order is now being processed. You'll receive updates on the installation schedule soon.
    </p>
    
    <div class="divider"></div>
    
    <p style="color: #6b7280; font-size: 13px; text-align: center;">
        If you have any questions about this payment, please contact our billing department at <span class="accent">billing@afinet.com</span>
    </p>
@endsection