{% extends "framework_modern.html" %}
{% load static %}
{% block content %}
  <div class="flex min-h-[60vh] flex-col items-center justify-center p-8">
    <div class="w-full max-w-2xl">
      <div class="alert alert-info mb-6 shadow-lg">
        <svg
          xmlns="http://www.w3.org/2000/svg"
          class="h-8 w-8 shrink-0 stroke-current"
          fill="none"
          viewBox="0 0 24 24"
        >
          <path
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
          />
        </svg>
        <div class="flex flex-col">
          <h3 class="text-lg font-bold">Page Not Found</h3>
          <p class="text-sm">The page you're looking for doesn't exist.</p>
        </div>
      </div>

      <div class="card bg-base-100 shadow-xl">
        <div class="card-body">
          <h2 class="card-title mb-4 text-2xl">404 Error</h2>
          <p class="text-base-content/70 mb-4">
            The page or resource you requested could not be found. It may have
            been moved, deleted, or the URL might be incorrect.
          </p>
          <div class="card-actions mt-6 justify-end">
            <a href="/" class="btn btn-primary">
              <svg
                xmlns="http://www.w3.org/2000/svg"
                class="mr-2 h-5 w-5"
                fill="none"
                viewBox="0 0 24 24"
                stroke="currentColor"
              >
                <path
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  stroke-width="2"
                  d="M3 12l2-2m0 0l7-7 7 7M5 10v10a1 1 0 001 1h3m10-11l2 2m-2-2v10a1 1 0 01-1 1h-3m-6 0a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1m-6 0h6"
                />
              </svg>
              Go Home
            </a>
            <a
              href="https://wiki.envipath.org/index.php/packages"
              target="_blank"
              class="btn btn-outline"
            >
              Learn More
              <svg
                xmlns="http://www.w3.org/2000/svg"
                class="ml-2 h-5 w-5"
                fill="none"
                viewBox="0 0 24 24"
                stroke="currentColor"
              >
                <path
                  stroke-linecap="round"
                  stroke-linejoin="round"
                  stroke-width="2"
                  d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
                />
              </svg>
            </a>
          </div>
        </div>
      </div>
    </div>
  </div>
{% endblock content %}