@extends('layouts.app')

@section('title','Email Detail')
@section('page_title','Email Detail')

@section('content')

@if(session('success'))
    <div style="background:#dcfce7;color:#166534;padding:10px;margin-bottom:15px;border-radius:6px;">
        {{ session('success') }}
    </div>
@endif

<div style="background:#fff;padding:24px;border-radius:10px;box-shadow:0 1px 3px rgba(0,0,0,0.08);">

    <div style="display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:20px;">

    <div>
        <h3 style="font-size:20px;font-weight:bold;margin-bottom:15px;">
            Email Details
        </h3>

        <p style="margin-bottom:8px;">
            <b>To:</b> {{ $history->to_email ?? '-' }}
        </p>

        <p style="margin-bottom:8px;">
            <b>Subject:</b> {{ $history->subject ?? '-' }}
        </p>

        <p style="margin-bottom:8px;">
            <b>Sent At:</b> {{ $history->sent_at }}
        </p>

        @if($history->project)
            <p style="margin-bottom:8px;">
                <b>Project:</b> {{ $history->project->project_name }}
            </p>
        @endif

        @if($history->payment)
            <p style="margin-bottom:8px;">
                <b>Payment:</b> {{ $history->payment->payment_title }}
            </p>
        @endif
    </div>

        <div>
            <p>
            @if($history->is_opened)
                <span style="background:#dbeafe;color:#1d4ed8;padding:4px 8px;border-radius:4px;">
                    Opened
                </span>
            @elseif($history->reminder_type == 'email_failed')
                <span style="background:#fee2e2;color:#991b1b;padding:4px 8px;border-radius:4px;">
                    Failed
                </span>
            @else
                <span style="background:#dcfce7;color:#166534;padding:4px 8px;border-radius:4px;">
                    Sent
                </span>
            @endif
            </p>
            <p>
                <span>Opened At:</b> {{ $history->opened_at ?? '-' }}</span>
            </p>
        </div>

    </div>

    <hr style="margin:20px 0;">

    <h3 style="font-size:18px;font-weight:bold;margin-bottom:12px;">
        Email Body
    </h3>

    <div style="
        background:#f9fafb;
        border:1px solid #e5e7eb;
        padding:22px;
        border-radius:8px;
        line-height:1.6;
        min-height:180px;
    ">
        {!! $history->message !!}
    </div>

    <hr style="margin:25px 0;">

<h3 style="font-size:18px;font-weight:bold;margin-bottom:12px;">
    Click History
</h3>

@if($history->clicks->count() > 0)

    <table style="width:100%;border-collapse:collapse;background:#fff;">
        <thead>
            <tr style="background:#e5e7eb;">
                <th style="padding:10px;text-align:left;">Clicked URL</th>
                <th style="padding:10px;text-align:left;">IP Address</th>
                <th style="padding:10px;text-align:left;">Clicked At</th>
            </tr>
        </thead>

        <tbody>
            @foreach($history->clicks as $click)
                <tr style="border-bottom:1px solid #ddd;">
                    <td style="padding:10px;">
                        <a href="{{ $click->clicked_url }}" target="_blank">
                            {{ $click->clicked_url }}
                        </a>
                    </td>

                    <td style="padding:10px;">
                        {{ $click->ip_address ?? '-' }}
                    </td>

                    <td style="padding:10px;">
                        {{ $click->created_at }}
                    </td>
                </tr>
            @endforeach
        </tbody>
    </table>

@else

    <p style="color:#6b7280;">
        No link clicks recorded yet.
    </p>

@endif

    <div style="display:flex;gap:10px;flex-wrap:wrap;margin-bottom:20px;margin-top:20px;">

        <a href="{{ route('email.history.copy',$history->id) }}"
           style="background:#2563eb;color:#fff;padding:10px 15px;border-radius:6px;text-decoration:none;">
            Copy as New Email
        </a>

        <form method="POST"
              action="{{ route('email.history.resend',$history->id) }}"
              style="display:inline;"
              onsubmit="return confirm('Resend this email?')">
            @csrf

            <button type="submit"
                    style="background:#16a34a;color:#fff;padding:10px 15px;border:0;border-radius:6px;cursor:pointer;">
                Resend Email
            </button>
        </form>

        <a href="{{ route('email.history') }}"
           style="background:#6b7280;color:#fff;padding:10px 15px;border-radius:6px;text-decoration:none;">
            Back
        </a>

    </div>

</div>

@endsection