{% extends "base.html" %} {% block title %}zero2prod{% endblock %} {% block
content %}
<div class="min-h-[60vh] flex items-center justify-center">
  <div class="max-w-md w-full space-y-8">
    <div class="text-center">
      <div
        class="mx-auto flex items-center justify-center h-16 w-16 rounded-full bg-green-100 mb-6"
      >
        <svg
          class="h-8 w-8 text-green-600"
          fill="none"
          stroke="currentColor"
          viewBox="0 0 24 24"
        >
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            d="M5 13l4 4L19 7"
          ></path>
        </svg>
      </div>

      <h1 class="text-3xl font-bold text-gray-900 mb-4">
        Subscription confirmed!
      </h1>
      <p class="text-lg text-gray-600 mb-8">
        Your email has been confirmed. You're all set to receive our newsletter
        updates.
      </p>
    </div>

    <div class="bg-white rounded-lg shadow-md p-6 border border-gray-200">
      <div class="bg-green-50 border border-green-200 rounded-md p-4 mb-6">
        <div class="flex">
          <svg
            class="h-5 w-5 text-green-400 mt-0.5"
            fill="currentColor"
            viewBox="0 0 20 20"
          >
            <path
              fill-rule="evenodd"
              d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
              clip-rule="evenodd"
            />
          </svg>
          <div class="ml-3">
            <p class="text-sm font-medium text-green-800">
              Welcome to our newsletter! You'll receive quality content about
              Rust backend development straight to your inbox.
            </p>
          </div>
        </div>
      </div>

      <div class="text-center">
        <a
          href="/"
          class="text-sm text-blue-600 hover:text-blue-500 transition-colors"
        >
          ← Back to homepage
        </a>
      </div>
    </div>
  </div>
  {% endblock %}
</div>