@extends('emails.layout')

@section('content')
    <h1>Verify Your Email Address</h1>

    <p>Hi {{ $user->firstname }},</p>

    <p>Thank you for registering with {{ $associationName ?? 'Guild360' }}. To complete your registration and access your account, please verify your email address by clicking the button below:</p>

    <div style="text-align: center; margin: 32px 0;">
        <a href="{{ $verificationUrl }}" class="btn" style="background: {{ $primaryColor ?? 'linear-gradient(135deg, #2563eb, #1d4ed8)' }};">
            Verify Email Address
        </a>
    </div>

    <p>This verification link will expire in <strong>24 hours</strong>.</p>

    <div class="divider"></div>

    <p style="font-size: 13px; color: #6b7280;">
        If the button above doesn't work, copy and paste this link into your browser:
    </p>
    <p style="word-break: break-all; font-size: 13px; color: #3b82f6;">
        {{ $verificationUrl }}
    </p>

    <div class="divider"></div>

    <p style="font-size: 13px; color: #9ca3af;">
        If you didn't create an account, you can safely ignore this email.
    </p>
@endsection
