From 7f68d235664bd4e2c3d1b65caa80f8f06808c88d Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Tue, 11 Aug 2026 17:21:51 -0700
Subject: [PATCH] fix non sortable styling

---
 .../Components/inputs/forms/FormMultiSelectField.tsx  | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/client/src/Components/inputs/forms/FormMultiSelectField.tsx b/client/src/Components/inputs/forms/FormMultiSelectField.tsx
index 808809318..60552c6f2 100644
--- a/client/src/Components/inputs/forms/FormMultiSelectField.tsx
+++ b/client/src/Components/inputs/forms/FormMultiSelectField.tsx
@@ -8,7 +8,6 @@ import {
 import Stack from "@mui/material/Stack";
 import Typography from "@mui/material/Typography";
 import IconButton from "@mui/material/IconButton";
-import Divider from "@mui/material/Divider";
 import { useTheme } from "@mui/material/styles";
 import { Trash2, GripVertical } from "lucide-react";
 import { DragDropContext, Droppable, Draggable } from "@hello-pangea/dnd";
@@ -164,16 +163,20 @@ export const FormMultiSelectField = <T extends FieldValues, O extends MultiSelec
 										</Droppable>
 									</DragDropContext>
 								)
-							: selected.map((option, index) => (
+							: selected.map((option) => (
 									<Stack
+										key={option.id}
 										direction="row"
 										alignItems="center"
-										key={option.id}
+										spacing={theme.spacing(LAYOUT.XS)}
+										padding={theme.spacing(LAYOUT.XS)}
+										marginTop={theme.spacing(SPACING.LG)}
+										borderRadius={1}
+										border={`1px solid ${theme.palette.divider}`}
 										width="100%"
 									>
 										{rowContent(option)}
 										{removeButton(option)}
-										{index < selected.length - 1 && <Divider />}
 									</Stack>
 								))}
 					</Stack>