@extends('emails.base')

@section('header', 'Transaction Updated')

@section('slot')

@if($transaction->type == 'investment')
{{-- Investment Transaction Update --}}
<div style="text-align: center; margin: 0 0 32px 0;">
    @if($transaction->status == \App\Enums\StatusEnum::APPROVED)
    <div style="background: linear-gradient(135deg, #10b981 0%, #059669 100%); border-radius: 50%; width: 80px; height: 80px; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);">
        <img src="{{ asset('icons/success.gif') }}" alt="" style="width: 100%; aspect-ratio:1; border-radius:100%">
    </div>
    <h1 style="font-size: 28px; color: #111827; margin: 0 0 8px 0; font-weight: 700;">Investment Approved! 🎉</h1>
    <p style="font-size: 18px; color: #6b7280; margin: 0;">Your robots are now actively working</p>
    @else
    <div style="background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); border-radius: 50%; width: 80px; height: 80px; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(59, 130, 246, 0.3);">
        <img src="{{ asset('icons/update.gif') }}" alt="" style="width: 100%; aspect-ratio:1; border-radius:100%">
    </div>
    <h1 style="font-size: 28px; color: #111827; margin: 0 0 8px 0; font-weight: 700;">Investment Updated</h1>
    <p style="font-size: 18px; color: #6b7280; margin: 0;">Status: {{ ucfirst($transaction->status) }}</p>
    @endif
</div>

<div style="background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%); padding: 32px; border-radius: 16px; text-align: center; margin: 24px 0; border: 3px solid #3b82f6; box-shadow: 0 4px 16px rgba(59, 130, 246, 0.15);">
    <div style="font-size: 48px; font-weight: 800; color: #1e40af; margin: 0 0 12px 0;">
        ${{ rtrim(rtrim(number_format($transaction->amount_usd, 2, '.', ''), '0'), '.') }}
    </div>
    <p style="margin: 0 0 16px 0; color: #1e40af; font-size: 18px; font-weight: 600;">
        {{ $transaction->investment->scheme->scheme_name }}
    </p>
    <div style="display: flex; justify-content: center; gap: 24px; flex-wrap: wrap; margin-top: 16px;">
        <div style="text-align: center;">
            <p style="margin: 0; color: #1e3a8a; font-size: 24px; font-weight: 700;">{{ $transaction->investment->scheme->interest_rate }}%</p>
            <p style="margin: 4px 0 0 0; color: #3b82f6; font-size: 13px;">Weekly Returns</p>
        </div>
        <div style="text-align: center;">
            <p style="margin: 0; color: #1e3a8a; font-size: 24px; font-weight: 700;">{{ $transaction->investment->scheme->risk_exposure_percentage }}%</p>
            <p style="margin: 4px 0 0 0; color: #3b82f6; font-size: 13px;">Risk Level</p>
        </div>
    </div>

    @if($transaction->status == \App\Enums\StatusEnum::APPROVED)
    <div style="background: rgba(255, 255, 255, 0.6); padding: 16px; border-radius: 8px; margin-top: 16px; text-align: left;">
        <p style="margin: 0 0 8px 0; color: #1e40af; font-size: 13px; font-weight: 600;">
            📅 Important Dates:
        </p>
        <p style="margin: 4px 0; color: #1e3a8a; font-size: 14px;">
            <strong>Next Payout:</strong> {{ \Carbon\Carbon::parse($transaction->investment->next_payout_time)->format('M d, Y') }}
        </p>
        <p style="margin: 4px 0; color: #1e3a8a; font-size: 14px;">
            <strong>Investment Ends:</strong> {{ \Carbon\Carbon::parse($transaction->investment->investment_end_date)->format('M d, Y') }}
        </p>
    </div>
    @endif
</div>

<div style="background: rgba(249, 250, 251, 0.8); padding: 20px; border-radius: 12px; margin: 20px 0;">
    <p style="margin: 0 0 12px 0; color: #374151; font-size: 15px; line-height: 1.6;">
        {{ $transaction->investment->scheme->description }}
    </p>
    <p style="margin: 0; color: #6b7280; font-size: 13px;">
        <strong>Plan:</strong> {{ $transaction->investment->interest_plan }}
    </p>
</div>

@elseif($transaction->type == 'bonus')
{{-- Bonus Transaction Update --}}
<div style="text-align: center; margin: 0 0 32px 0;">
    <div style="background: linear-gradient(135deg, #8b5cf6 0%, #7c3aed 100%); border-radius: 50%; width: 80px; height: 80px; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(139, 92, 246, 0.3);">
        <img src="{{ asset('icons/update.gif') }}" alt="" style="width: 100%; aspect-ratio:1; border-radius:100%">
    </div>
    <h1 style="font-size: 28px; color: #111827; margin: 0 0 8px 0; font-weight: 700;">Bonus Updated</h1>
    <p style="font-size: 18px; color: #6b7280; margin: 0;">Status: {{ ucfirst($transaction->status) }}</p>
</div>

<div style="background: linear-gradient(135deg, #faf5ff 0%, #f3e8ff 100%); padding: 32px; border-radius: 16px; text-align: center; margin: 24px 0; border: 3px solid #8b5cf6; box-shadow: 0 4px 16px rgba(139, 92, 246, 0.15);">
    <div style="font-size: 48px; font-weight: 800; color: #6b21a8; margin: 0 0 8px 0;">
        ${{ rtrim(rtrim(number_format($transaction->amount_usd, 2, '.', ''), '0'), '.') }}
    </div>
    <p style="margin: 0; color: #7c3aed; font-size: 15px;">
        <strong>Status:</strong> {{ ucfirst($transaction->status) }}
    </p>
</div>

@elseif($transaction->type == 'withdrawal')
{{-- Withdrawal Transaction Update --}}
<div style="text-align: center; margin: 0 0 32px 0;">
    @if($transaction->status == \App\Enums\StatusEnum::APPROVED || $transaction->status == 'completed')
    <div style="background: linear-gradient(135deg, #10b981 0%, #059669 100%); border-radius: 50%; width: 80px; height: 80px; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(16, 185, 129, 0.3);">
        <img src="{{ asset('icons/success.gif') }}" alt="" style="width: 100%; aspect-ratio:1; border-radius:100%">
    </div>
    <h1 style="font-size: 28px; color: #111827; margin: 0 0 8px 0; font-weight: 700;">Withdrawal Completed! ✓</h1>
    <p style="font-size: 18px; color: #6b7280; margin: 0;">Your funds are on the way</p>
    @else
    <div style="background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); border-radius: 50%; width: 80px; height: 80px; margin: 0 auto 20px; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(245, 158, 11, 0.3);">
        <img src="{{ asset('icons/update.gif') }}" alt="" style="width: 100%; aspect-ratio:1; border-radius:100%">
    </div>
    <h1 style="font-size: 28px; color: #111827; margin: 0 0 8px 0; font-weight: 700;">Withdrawal Updated</h1>
    <p style="font-size: 18px; color: #6b7280; margin: 0;">Status: {{ ucfirst($transaction->status) }}</p>
    @endif
</div>

<div style="background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%); padding: 32px; border-radius: 16px; text-align: center; margin: 24px 0; border: 3px solid #f59e0b; box-shadow: 0 4px 16px rgba(245, 158, 11, 0.15);">
    <div style="font-size: 48px; font-weight: 800; color: #92400e; margin: 0 0 8px 0;">
        ${{ rtrim(rtrim(number_format($transaction->amount_usd, 2, '.', ''), '0'), '.') }}
    </div>
    <p style="margin: 0; color: #b45309; font-size: 15px;">
        <strong>Status:</strong> {{ ucfirst($transaction->status) }}
    </p>

    @if(isset($transaction->method_info['address']))
    <div style="background: rgba(255, 255, 255, 0.6); padding: 16px; border-radius: 8px; margin-top: 16px; text-align: left;">
        <p style="margin: 0 0 8px 0; color: #92400e; font-size: 13px; font-weight: 600;">
            📍 Destination:
        </p>
        <p style="margin: 0; color: #b45309; font-size: 13px; word-break: break-all; font-family: 'Courier New', monospace;">
            {{ $transaction->method_info['address'] }}
        </p>
        @if(isset($transaction->method_info['network']))
        <p style="margin: 8px 0 0 0; color: #d97706; font-size: 13px;">
            <strong>Network:</strong> {{ $transaction->method_info['network'] }}
        </p>
        @endif
    </div>
    @endif
</div>

@else
{{-- Generic Transaction Update --}}
<div style="text-align: center; margin: 0 0 24px 0;">
    <h1 style="font-size: 24px; color: #111827; margin: 0 0 8px 0; font-weight: 700;">Transaction Updated</h1>
    <p style="font-size: 16px; color: #6b7280; margin: 0;">Transaction ID: {{ $transaction->id }}</p>
</div>
@endif

@if(!empty($transaction->method_info['remark']))
<div style="background: #f3f4f6; padding: 16px; border-radius: 8px; margin: 20px 0;">
    <p style="margin: 0; color: #374151; font-size: 14px;">
        <strong>💬 Remark:</strong> {{ $transaction->method_info['remark'] }}
    </p>
</div>
@endif

<div style="text-align: center; margin: 32px 0;">
    <a href="{{ system_setting('site_url') }}/dashboard" style="display: inline-block; background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: white; padding: 16px 32px; text-decoration: none; border-radius: 12px; font-weight: 600; font-size: 16px; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);">
        📊 View Dashboard
    </a>
</div>

@if (empty($transaction->method_info['is_added_by_admin']))
<p style="font-size: 13px; color: #6b7280; text-align: center; margin: 24px 0 0 0;">
    Questions? <a href="mailto:{{ system_setting('support_email') }}" style="color: #3b82f6; text-decoration: none; font-weight: 600;">Contact Support</a>
</p>
@endif

@endsection