@extends('emails.layout')
@section('title', 'Verify Your Email')

@section('content')
  <h2 style="margin:0 0 8px;color:#0f172a;font-size:22px;font-weight:700;">Confirm Your Email Address</h2>
  <p style="margin:0 0 24px;color:#64748b;font-size:14px;">One last step before you get started.</p>

  <p style="margin:0 0 16px;color:#334155;font-size:15px;line-height:1.6;">
    Thank you for registering with <strong>PROKRES</strong>. Please verify your email address by clicking the button below.
  </p>

  <table cellpadding="0" cellspacing="0" style="margin:28px 0;">
    <tr>
      <td align="center" bgcolor="#0f172a" style="border-radius:6px;">
        <a href="{{ $verificationUrl }}"
           style="display:inline-block;padding:14px 32px;color:#ffffff;font-size:15px;font-weight:600;text-decoration:none;border-radius:6px;">
          Verify Email Address
        </a>
      </td>
    </tr>
  </table>

  <p style="margin:0 0 12px;color:#475569;font-size:14px;line-height:1.6;">
    If the button doesn't work, copy and paste the link below into your browser:
  </p>
  <p style="margin:0 0 24px;word-break:break-all;">
    <a href="{{ $verificationUrl }}" style="color:#3b82f6;font-size:13px;">{{ $verificationUrl }}</a>
  </p>

  <hr style="border:none;border-top:1px solid #e2e8f0;margin:24px 0;" />

  <p style="margin:0;color:#94a3b8;font-size:13px;line-height:1.6;">
    If you did not create an account, no action is needed — you can safely ignore this email.
  </p>
@endsection