{{define "content"}}
<section class="auth-card">
    <div class="resend-verification">
        <div class="resend-icon">
            <svg width="48" height="48" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8M3 3v5h5M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16M21 21v-5h-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
            </svg>
        </div>
        
        <h1 class="resend-title">Resend Verification Email</h1>
        <p class="resend-message">Enter your email address and we'll send you a new verification link.</p>
        
        {{if .Flash}}
            <div class="alert alert-success">
                {{.Flash}}
            </div>
        {{end}}
        
        {{if .Errors}}
            <div class="alert alert-error">
                {{range .Errors}}
                    <div>{{.}}</div>
                {{end}}
            </div>
        {{end}}
        
        <form class="resend-form" method="post" action="/resend-verification" autocomplete="email">
            <input type="hidden" name="csrf_token" value="{{.CSRFToken}}" />
            
            <label for="resend-email">Email address</label>
            <input
                id="resend-email"
                type="email"
                name="email"
                value="{{index .FormValues "email"}}"
                required
                placeholder="you@example.com"
                autofocus
            />
            
            <button type="submit" class="button button-primary">
                <svg class="svg-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M3 8l7.89 4.26a2 2 0 0 0 2.22 0L21 8M5 19h14a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v10a2 2 0 0 0 2 2z" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                </svg>
                Send Verification Email
            </button>
        </form>
        
        <div class="resend-help">
            <h3>Need help?</h3>
            <ul>
                <li>Check your spam/junk folder for the verification email</li>
                <li>Make sure you're using the email address you registered with</li>
                <li>Wait a few minutes for the email to arrive</li>
                <li>Contact support if you continue having issues</li>
            </ul>
        </div>
        
        <div class="resend-actions">
            <a class="button button-secondary" href="/login">
                <svg class="svg-icon" width="16" height="16" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path d="M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4M10 17l5-5-5-5M21 12H9" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                </svg>
                Back to Sign In
            </a>
        </div>
    </div>
</section>
{{end}}
