refactor(website): Refactor ErrorBox anchor styling (#4144)

Resolves #3025

## Summary
- simplify ErrorBox by removing runtime link styling
- apply bold and underline styling to links in alerts via global CSS
- 
<img width="1072" alt="image"
src="https://github.com/user-attachments/assets/92d4f5b2-daac-45d3-b0ad-5d21aa4c9b53"
/>

🚀 Preview: Add `preview` label to enable

Author: theosanderson

website/src/components/common/ErrorBox.tsx

@@ -12,25 +12,13 @@ interface Props {
 const ErrorBox: React.FC<Props> = ({ title, children, level = 'error' }) => {
     const alertClass = `my-8 alert ${level === 'error' ? 'alert-error' : 'alert-warning'}`;
 
-    const ContentWithStyledLinks: React.FC<{ children: React.ReactNode }> = ({ children }) => {
-        return React.Children.map(children, (child) => {
-            if (React.isValidElement(child) && child.type === 'a') {
-                return React.cloneElement(child as React.ReactElement, {
-                    className:
-                        `font-bold underline ${((child.props as Record<string, unknown>).className as string | undefined) ?? ''}`.trim(),
-                });
-            }
-            return child;
-        });
-    };
-
     return (
         <div className={alertClass}>
             {level === 'error' && <DangerousTwoToneIcon />}
             {level === 'warning' && <WarningTwoToneIcon />}
             <div className='grid-flow-row'>
                 {title !== undefined && <p className='text-lg font-bold'>{title}</p>}
-                <ContentWithStyledLinks>{children}</ContentWithStyledLinks>
+                {children}
             </div>
         </div>
     );

website/src/styles/base.scss

@@ -12,6 +12,10 @@ a {
     }
 }
 
+.alert a {
+    @apply font-bold underline;
+}
+
 .fillColor {
     background-color: theme('colors.main');
 }