@extends('emails.layout')
@section('title', 'Login Verification Code')
@section('header_subtitle', 'Security')

@section('content')

<h2 style="margin:0 0 6px;font-size:20px;font-weight:700;color:#292B64">Login Verification</h2>
<p style="margin:0 0 24px;color:#6b7280;font-size:14px">Hello {{ $customerName }}, use the code below to complete your sign-in.</p>

{{-- Code box --}}
<div style="background:#f9f8ff;border:2px dashed #7c3aed;border-radius:10px;padding:28px;text-align:center;margin-bottom:20px">
    <p style="margin:0 0 8px;font-size:12px;font-weight:700;color:#7c3aed;text-transform:uppercase;letter-spacing:.08em">Your verification code</p>
    <p style="margin:0;font-size:42px;font-weight:800;letter-spacing:14px;color:#292B64;font-family:monospace">{{ $code }}</p>
    <p style="margin:10px 0 0;font-size:12px;color:#9ca3af">Expires in <strong style="color:#7c3aed">{{ $expiresInMinutes }} minutes</strong></p>
</div>

{{-- Warning --}}
<div style="background:#fffbeb;border-left:4px solid #f59e0b;border-radius:0 8px 8px 0;padding:14px 18px;margin-bottom:20px">
    <p style="margin:0;font-size:13px;color:#92400e"><strong>Security notice:</strong> If you did not attempt to log in, ignore this email and consider changing your password immediately. Never share this code with anyone.</p>
</div>

<p style="margin:0;font-size:13px;color:#6b7280">This code can only be used once and will expire after {{ $expiresInMinutes }} minutes.</p>

@endsection