import { Link } from "react-router-dom";
import { motion } from "framer-motion";

export default function NotFound() {
  return (
    <motion.div
      className="admin-empty-state"
      style={{ minHeight: "60vh", justifyContent: "center" }}
      initial={{ opacity: 0, y: 12 }}
      animate={{ opacity: 1, y: 0 }}
      transition={{ duration: 0.25 }}
    >
      <div
        className="admin-empty-icon"
        style={{ width: 80, height: 80, marginBottom: "1.5rem" }}
      >
        <svg
          width="36"
          height="36"
          viewBox="0 0 24 24"
          fill="none"
          stroke="currentColor"
          strokeWidth="1.5"
          strokeLinecap="round"
          strokeLinejoin="round"
        >
          <circle cx="12" cy="12" r="10" />
          <path d="M16 16s-1.5-2-4-2-4 2-4 2" />
          <line x1="9" y1="9" x2="9.01" y2="9" />
          <line x1="15" y1="9" x2="15.01" y2="9" />
        </svg>
      </div>
      <h2
        style={{
          fontSize: "1.5rem",
          fontWeight: 600,
          marginBottom: "0.5rem",
          color: "var(--text-primary)",
        }}
      >
        404
      </h2>
      <p>Stránka nebyla nalezena.</p>
      <Link
        to="/"
        className="admin-btn admin-btn-primary"
        style={{ marginTop: "0.5rem" }}
      >
        Zpět na Dashboard
      </Link>
    </motion.div>
  );
}