style: add styling to SDK internal error component

src/components/Common/InternalError/InternalError.module.scss

@@ -0,0 +1,27 @@
+h1 {
+  font-size: toRem(21) !important;
+}
+
+.internalErrorCard {
+  background-color: #fff;
+  border-right: 1px solid #eaeaea;
+  border-bottom: 1px solid #eaeaea;
+  border-left: 1px solid #eaeaea;
+  box-shadow:
+    0px 1px 18px rgba(0, 0, 0, 0.08),
+    inset 0 4px 0 #d5351f;
+  padding: toRem(20);
+  display: flex;
+  flex-direction: column;
+  gap: toRem(8);
+  max-width: toRem(600);
+  margin: 0 auto;
+}
+
+.errorMessage {
+  font-size: toRem(14);
+  font-weight: 500;
+  color: #d5351f;
+  line-height: normal;
+  margin-top: toRem(6);
+}

src/components/Common/InternalError/InternalError.tsx

@@ -1,6 +1,7 @@
 import { FallbackProps } from 'react-error-boundary'
 import { Trans, useTranslation } from 'react-i18next'
 import { Button } from '../Button/Button'
+import styles from './InternalError.module.scss'
 
 export const InternalError = ({ error, resetErrorBoundary }: FallbackProps) => {
   //TODO: Need to integrate useQueryErrorResetBoundary from tanstac to reset query cach on "try again" - GWS-3926
@@ -13,14 +14,23 @@ export const InternalError = ({ error, resetErrorBoundary }: FallbackProps) => {
         : t('errors.unknownError')
 
   return (
-    <section role="alert">
-      <Trans
-        t={t}
-        i18nKey="errors.globalReactError"
-        values={{ error: errorMessage }}
-        shouldUnescape={true}
-      />
-      <Button onPress={resetErrorBoundary}>{t('errors.resetGlobalError')}</Button>
-    </section>
+    <div className={styles.internalErrorCard}>
+      <div>
+        <h1 className={styles.internalErrorCardTitle}>Error</h1>
+        <p className={styles.errorMessage}>
+          <Trans
+            t={t}
+            i18nKey="errors.globalReactError"
+            values={{ error: errorMessage }}
+            shouldUnescape={true}
+          />
+        </p>
+      </div>
+      <div>
+        <Button onPress={resetErrorBoundary} variant="secondary">
+          {t('errors.resetGlobalError')}
+        </Button>
+      </div>
+    </div>
   )
 }