refactor: improve EventModal UI labels and visibility controls

- Rename 'Alarm' to 'Notification' for better clarity
- Rename 'Attendees' to 'Participants' with updated placeholder text
- Replace 'Visibility' dropdown with 'Visible to' toggle buttons (All/Participants)
- Remove CONFIDENTIAL option, keep only PUBLIC and PRIVATE
- Add icons (PublicIcon/LockIcon) with fixed sizing for toggle buttons
- Rename 'Show as' to 'Show me as'
- Fix ResponsiveDialog scroll bar positioning in expanded mode
- Update PeopleSearch placeholder to 'Start typing a name or email'

src/components/Dialog/ResponsiveDialog.tsx

@@ -122,6 +122,11 @@ function ResponsiveDialog({
   };
 
   const baseContentSx: SxProps<Theme> = {
+    width: "100%",
+    padding: isExpanded ? "16px" : undefined,
+  };
+
+  const contentWrapperSx: SxProps<Theme> = {
     maxWidth: isExpanded ? expandedContentMaxWidth : "100%",
     margin: isExpanded ? "0 auto" : "0",
     width: "100%",
@@ -160,7 +165,13 @@ function ResponsiveDialog({
         ]}
         {...dialogContentProps}
       >
-        <Stack spacing={currentSpacing}>{children}</Stack>
+        {isExpanded ? (
+          <Stack spacing={currentSpacing} sx={contentWrapperSx}>
+            {children}
+          </Stack>
+        ) : (
+          <Stack spacing={currentSpacing}>{children}</Stack>
+        )}
       </DialogContent>
       {actions && <DialogActions>{actions}</DialogActions>}
     </Dialog>