// app/components/Contact.tsx
"use client";

export default function Contact() {
  return (
    <section id="contact" className="p-10 bg-gray-100 dark:bg-gray-800">
      <h2 className="text-3xl font-bold text-center text-gray-800 dark:text-white">
        Contact Me
      </h2>
      <form className="mt-6 max-w-md mx-auto space-y-4">
        <input
          type="text"
          placeholder="Name"
          className="w-full p-2 border rounded dark:bg-gray-700 dark:border-gray-600 dark:text-white"
          required
        />
        <input
          type="email"
          placeholder="Email"
          className="w-full p-2 border rounded dark:bg-gray-700 dark:border-gray-600 dark:text-white"
          required
        />
        <textarea
          placeholder="Message"
          className="w-full p-2 border rounded dark:bg-gray-700 dark:border-gray-600 dark:text-white"
          rows={5}
          required
        ></textarea>
        <button
          type="submit"
          className="w-full p-2 bg-blue-500 text-white rounded hover:bg-blue-600 dark:bg-blue-700 dark:hover:bg-blue-800"
        >
          Send
        </button>
      </form>
    </section>
  );
}