{% extends "base.html" %}
{% block content %}
<div class="max-w-md mx-auto my-12">
  <div class="bg-white p-8 rounded-lg shadow-md text-center">
    <div class="mb-6">
      <div class="inline-block p-4 rounded-full bg-green-100">
        <i class="fas fa-check-circle text-irish-green text-5xl"></i>
      </div>
    </div>
    
    <h1 class="text-2xl font-bold text-irish-green mb-4">Registration Successful!</h1>
    <p class="text-gray-600 mb-6">Your account has been created and you're now logged in.</p>
    
    <div class="space-y-4">
      <a href="/dashboard" class="block w-full bg-irish-green hover:bg-opacity-90 text-white font-medium py-2 px-4 rounded-md transition">
        Go to Dashboard
      </a>
      <a href="/teams/" class="block w-full bg-cream-white border border-irish-green text-irish-green hover:bg-irish-green hover:text-white font-medium py-2 px-4 rounded-md transition">
        Join a Team
      </a>
    </div>
    
    <div class="mt-8 pt-6 border-t border-gray-200">
      <h2 class="font-semibold mb-2">What's Next?</h2>
      <ul class="text-left text-sm space-y-2">
        <li><i class="fas fa-check-circle text-irish-green mr-2"></i> Explore the pub quiz leaderboards</li>
        <li><i class="fas fa-check-circle text-irish-green mr-2"></i> Join an existing team or create your own</li>
        <li><i class="fas fa-check-circle text-irish-green mr-2"></i> Scan QR codes at quiz events to earn points</li>
        <li><i class="fas fa-check-circle text-irish-green mr-2"></i> Complete your profile information</li>
      </ul>
    </div>
  </div>
</div>
{% endblock %}