Add styles to error icon in nav bar

frontend/src/components/NavItem/NavItem.module.css

@@ -30,6 +30,8 @@
 
 .nav-item {
   display: flex;
+  align-items: center;
+  gap: var(--cpd-space-1x);
 
   padding: var(--cpd-space-1x) var(--cpd-space-2x);
   color: var(--cpd-color-text-secondary);

frontend/src/routes/_account.module.css

@@ -0,0 +1,12 @@
+/* Copyright 2026 Element Creations Ltd.
+ *
+ * SPDX-License-Identifier: AGPL-3.0-only OR LicenseRef-Element-Commercial
+ * Please see LICENSE files in the repository root for full details.
+ */
+
+
+.nav-bar-error-icon {
+  display: inline-block;
+
+  color: var(--cpd-color-icon-critical-primary);
+}

frontend/src/routes/_account.tsx

@@ -16,6 +16,8 @@ import UserGreeting from "../components/UserGreeting";
 import { graphql } from "../gql";
 import { graphqlRequest } from "../graphql";
 
+import styles from "./_account.module.css";
+
 const QUERY = graphql(/* GraphQL */ `
   query CurrentUserGreeting {
     viewer {
@@ -66,7 +68,7 @@ function Account(): React.ReactElement {
 
           <NavBar>
             <NavItem to="/">{t("frontend.nav.settings")}</NavItem>
-            <NavItem to="/sessions">{t("frontend.nav.devices")} <IconErrorSolid /></NavItem>
+            <NavItem to="/sessions">{t("frontend.nav.devices")} <IconErrorSolid className={styles.navBarErrorIcon} /></NavItem>
             {planManagementIframeUri && (
               <NavItem to="/plan">{t("frontend.nav.plan")}</NavItem>
             )}