Adds Monsters and Locations

src/components/documents/treasure/TreasureForm.tsx

@@ -43,16 +43,21 @@ export const TreasureForm = ({
   }
 
   return (
-    <form className="flex items-center gap-2 mt-4" onSubmit={handleSubmit}>
-      <input
-        type="text"
-        className="flex-1 px-3 py-2 rounded bg-slate-800 text-slate-100 border border-slate-700 focus:outline-none focus:ring-2 focus:ring-violet-500"
-        placeholder="Add a new treasure..."
-        value={newTreasure}
-        onChange={(e) => setNewTreasure(e.target.value)}
-        disabled={adding}
-        aria-label="Add new treasure"
-      />
+    <form
+      className="flex flex-col items-center gap-2 mt-4 w-full"
+      onSubmit={handleSubmit}
+    >
+      <div>
+        <input
+          type="text"
+          className="flex-1 px-3 py-2 rounded bg-slate-800 text-slate-100 border border-slate-700 focus:outline-none focus:ring-2 focus:ring-violet-500"
+          placeholder="Add a new treasure..."
+          value={newTreasure}
+          onChange={(e) => setNewTreasure(e.target.value)}
+          disabled={adding}
+          aria-label="Add new treasure"
+        />
+      </div>
       {error && <div className="text-red-400 mt-2 text-sm">{error}</div>}
       <button
         type="submit"