Address Copilot review comments for Modal migration

This commit addresses all three issues raised by Copilot's automated review:

1. Add link styling to modal card (.modal-card a)
   - Mirrors bodyCopyRegularStyle link behavior with underline and hover states
   - Uses link color constants from Typography (linkColor, linkHover)
   - Binds link colors as CSS variables in Card component

2. Fix CloseModalIcon size for pixel-perfect parity
   - Changed from 2.5rem to 2rem (height and width)
   - Matches the final size from legacy styled-components implementation

3. Ensure type="button" cannot be overridden in CloseModalIcon
   - Moved type="button" after {...props} spread
   - Prevents consumer-provided type from overriding (e.g., submit in forms)
   - Maintains previous behavior as a non-submitting close button

All changes verified with successful build.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

snaps

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
Co-Authored-By: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Author: 3 people

src/app/components/Modal/Modal.css

@@ -36,6 +36,17 @@
   color: var(--text-color, #424242);
 }
 
+/* Link styling inside modal card - mirrors bodyCopyRegularStyle link behavior */
+.modal-card a {
+  color: var(--link-color, #027EB5);
+  cursor: pointer;
+  text-decoration: underline;
+}
+
+.modal-card a:hover {
+  color: var(--link-hover-color, #0064A0);
+}
+
 /* Modal header */
 .modal-header {
   display: flex;
@@ -123,9 +134,9 @@
 
 /* Close modal icon button */
 .modal-close-icon {
-  /* toolbarIconStyles - height/width from textRegularLineHeight (2.5rem) */
-  height: 2.5rem;
-  width: 2.5rem;
+  /* Final legacy CloseModalIcon size: 2rem x 2rem */
+  height: 2rem;
+  width: 2rem;
   padding: 0.4rem;
   /* Base button styles */
   cursor: pointer;

src/app/components/Modal/Modal.tsx

@@ -9,6 +9,7 @@ import './Modal.css';
 import theme from '../../theme';
 import Times from '../Times';
 import { toolbarIconColor } from '../../content/components/constants';
+import { linkColor, linkHover } from '../Typography/Links.constants';
 
 export const modalPadding = 3.0;
 
@@ -39,6 +40,8 @@ export function Card({ className, style, ...props }: React.HTMLAttributes<HTMLDi
       className={classNames('modal-card', className)}
       style={{
         '--text-color': theme.color.text.default,
+        '--link-color': linkColor,
+        '--link-hover-color': linkHover,
         ...style,
       } as React.CSSProperties}
     />
@@ -117,8 +120,8 @@ export const CloseModalIcon = React.forwardRef<HTMLButtonElement, React.ButtonHT
     return (
       <button
         ref={ref}
-        type="button"
         {...props}
+        type="button"
         className={classNames('modal-close-icon', className)}
         style={{
           '--icon-color-lighter': toolbarIconColor.lighter,

src/app/components/Modal/__snapshots__/Modal.spec.tsx.snap

@@ -16,6 +16,8 @@ exports[`Modal matches snapshot 1`] = `
       className="modal-card"
       style={
         Object {
+          "--link-color": "#027EB5",
+          "--link-hover-color": "#0064A0",
           "--text-color": "#424242",
         }
       }
@@ -104,6 +106,8 @@ exports[`Modal matches snapshot with children 1`] = `
       className="modal-card"
       style={
         Object {
+          "--link-color": "#027EB5",
+          "--link-hover-color": "#0064A0",
           "--text-color": "#424242",
         }
       }

src/app/content/highlights/components/__snapshots__/ConfirmationModal.spec.tsx.snap

@@ -106,6 +106,8 @@ exports[`ConfirmationModal matches snapshot 1`] = `
       className="modal-card"
       style={
         Object {
+          "--link-color": "#027EB5",
+          "--link-hover-color": "#0064A0",
           "--text-color": "#424242",
         }
       }

src/app/errors/components/__snapshots__/ErrorModal.spec.tsx.snap

@@ -65,6 +65,8 @@ exports[`ErrorModal matches snapshot 1`] = `
       className="modal-card"
       style={
         Object {
+          "--link-color": "#027EB5",
+          "--link-hover-color": "#0064A0",
           "--text-color": "#424242",
         }
       }
@@ -249,6 +251,8 @@ exports[`ErrorModal matches snapshots with recorded error ids 1`] = `
       className="modal-card"
       style={
         Object {
+          "--link-color": "#027EB5",
+          "--link-hover-color": "#0064A0",
           "--text-color": "#424242",
         }
       }