@extends('emails.layout')
@section('title', 'Your Login Credentials')

@section('content')
  <h2 style="margin:0 0 8px;color:#0f172a;font-size:22px;font-weight:700;">Your Account Credentials</h2>
  <p style="margin:0 0 24px;color:#64748b;font-size:14px;">Here are your login details for PROKRES.</p>

  <p style="margin:0 0 20px;color:#334155;font-size:15px;line-height:1.6;">
    Hi <strong>{{ $name ?? 'there' }}</strong>, your account is ready. Below are your login credentials:
  </p>

  <table width="100%" cellpadding="0" cellspacing="0" style="background-color:#f8fafc;border-radius:8px;padding:20px;margin:0 0 24px;">
    <tr>
      <td style="padding:10px 16px;">
        <p style="margin:0 0 4px;color:#94a3b8;font-size:12px;text-transform:uppercase;letter-spacing:0.05em;">Email</p>
        <p style="margin:0;color:#0f172a;font-size:16px;font-weight:600;">{{ $email }}</p>
      </td>
    </tr>
    <tr>
      <td style="padding:10px 16px;border-top:1px solid #e2e8f0;">
        <p style="margin:0 0 4px;color:#94a3b8;font-size:12px;text-transform:uppercase;letter-spacing:0.05em;">Temporary Password</p>
        <p style="margin:0;color:#0f172a;font-size:16px;font-weight:600;letter-spacing:0.05em;">{{ $password }}</p>
      </td>
    </tr>
  </table>

  <p style="margin:0 0 16px;color:#475569;font-size:14px;line-height:1.6;">
    For security, please log in and change your password immediately.
  </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 expect this email, please contact our support team immediately.
  </p>
@endsection