Make hover underline purple (#9985)

Uses a purple color for the hover underline. Also, sets it to be
transparent when not-hovered, so that you get a nice fade in effect.

Focus (top) and hover (bottom) now have the same visual style, but
different ways to get to that state (expansion vs fade-in):
<img width="979" alt="image"
src="https://github.com/user-attachments/assets/e342ea4e-4821-4e4c-bb5d-6b9d3a672e26"
/>

frontend/src/component/feature/FeatureStrategy/FeatureStrategyConstraints/EditableConstraint.tsx

@@ -85,6 +85,11 @@ const StyledSelect = styled(GeneralSelect)(({ theme }) => ({
     },
     '&::before': {
         border: 'none',
+        // make it transparent so that it fades in
+        borderColor: `${theme.palette.primary.main}00`,
+    },
+    '&&:hover::before': {
+        borderColor: theme.palette.primary.main,
     },
 }));