feat: Update event modal UI with header icons and improved actions layout

- Add expand and close icons to ResponsiveDialog header in normal mode
- Change 'Show More' button to 'More options' with Add icon
- Hide Cancel button in normal mode, show only in extended mode
- Add showHeaderActions prop to ResponsiveDialog for UI control
- Preserve EventDisplayPreview modal with old UI (no header icons)
- Update all affected test cases to match new UI behavior

src/features/Events/EventDisplayPreview.tsx

@@ -115,6 +115,7 @@ export default function EventPreviewModal({
       <ResponsiveDialog
         open={open && !hidePreview}
         onClose={() => onClose({}, "backdropClick")}
+        showHeaderActions={false}
         style={{ overflow: "auto" }}
         title={
           event.title && (

src/features/Events/EventModal.tsx

@@ -1,7 +1,5 @@
 import { CalendarApi, DateSelectArg } from "@fullcalendar/core";
 import {
-  Box,
-  Button,
   Checkbox,
   FormControl,
   FormControlLabel,
@@ -23,6 +21,8 @@ import {
   ContentCopy as CopyIcon,
   Close as DeleteIcon,
 } from "@mui/icons-material";
+import { Box, Button } from "@mui/material";
+import AddIcon from "@mui/icons-material/Add";
 import React, {
   useEffect,
   useState,
@@ -409,12 +409,16 @@ function EventPopover({
   const dialogActions = (
     <Box display="flex" justifyContent="space-between" width="100%" px={2}>
       {!showMore && (
-        <Button onClick={() => setShowMore(!showMore)}>Show More</Button>
+        <Button startIcon={<AddIcon />} onClick={() => setShowMore(!showMore)}>
+          More options
+        </Button>
       )}
       <Box display="flex" gap={1} ml={showMore ? "auto" : 0}>
-        <Button variant="outlined" onClick={handleClose}>
-          Cancel
-        </Button>
+        {showMore && (
+          <Button variant="outlined" onClick={handleClose}>
+            Cancel
+          </Button>
+        )}
         <Button variant="contained" onClick={handleSave} disabled={!title}>
           Save
         </Button>

src/features/Events/EventUpdateModal.tsx

@@ -1,4 +1,5 @@
 import { Box, Button } from "@mui/material";
+import AddIcon from "@mui/icons-material/Add";
 import React, {
   useEffect,
   useState,
@@ -658,12 +659,16 @@ function EventUpdateModal({
   const dialogActions = (
     <Box display="flex" justifyContent="space-between" width="100%" px={2}>
       {!showMore && (
-        <Button onClick={() => setShowMore(!showMore)}>Show More</Button>
+        <Button startIcon={<AddIcon />} onClick={() => setShowMore(!showMore)}>
+          More options
+        </Button>
       )}
       <Box display="flex" gap={1} ml={showMore ? "auto" : 0}>
-        <Button variant="outlined" onClick={handleClose}>
-          Cancel
-        </Button>
+        {showMore && (
+          <Button variant="outlined" onClick={handleClose}>
+            Cancel
+          </Button>
+        )}
         <Button variant="contained" onClick={handleSave} disabled={!title}>
           Save
         </Button>