From 4dddd576a8f0a4178c7964101a9f878fc8d73af0 Mon Sep 17 00:00:00 2001
From: estifanos <estifanos.tria@gmail.com>
Date: Fri, 31 Jul 2026 06:55:38 +0000
Subject: [PATCH] UI

---
 .../features/profile/pages/ProfilePage.module.css    | 12 ++++++------
 .../src/app/features/profile/pages/ProfilePage.tsx   |  2 +-
 2 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/apps/portal/src/app/features/profile/pages/ProfilePage.module.css b/apps/portal/src/app/features/profile/pages/ProfilePage.module.css
index 3c37f92a1..1c24dccd3 100644
--- a/apps/portal/src/app/features/profile/pages/ProfilePage.module.css
+++ b/apps/portal/src/app/features/profile/pages/ProfilePage.module.css
@@ -3,7 +3,7 @@
   display: inline-flex;
   gap: 6px;
   padding: 5px;
-  background: var(--mantine-color-gray-1);
+  background: var(--mantine-color-gray-light);
   border-radius: var(--mantine-radius-md);
   border: none;
   flex-wrap: wrap;
@@ -14,7 +14,7 @@
   border-radius: 10px;
   padding: 9px 18px;
   font-weight: 500;
-  color: var(--mantine-color-gray-7);
+  color: var(--mantine-color-dimmed);
   background: transparent;
   transition:
     background-color 120ms ease,
@@ -24,7 +24,7 @@
 
 .tab:hover {
   background: transparent;
-  color: var(--mantine-color-gray-9);
+  color: var(--mantine-color-text);
 }
 
 .tab[data-active],
@@ -37,7 +37,7 @@
 
 /* Selectable option card (language + appearance). */
 .choice {
-  border: 1px solid var(--mantine-color-gray-3);
+  border: 1px solid var(--mantine-color-default-border);
   border-radius: var(--mantine-radius-md);
   background: var(--mantine-color-body);
   transition:
@@ -46,11 +46,11 @@
 }
 
 .choice:hover {
-  border-color: var(--mantine-color-gray-4);
+  border-color: var(--mantine-color-gray-5);
 }
 
 .choiceActive,
 .choiceActive:hover {
   border-color: var(--mantine-color-emaPrimary-6);
-  background: var(--mantine-color-emaPrimary-0);
+  background: var(--mantine-color-emaPrimary-light);
 }
diff --git a/apps/portal/src/app/features/profile/pages/ProfilePage.tsx b/apps/portal/src/app/features/profile/pages/ProfilePage.tsx
index 2c9c673ed..460d73c69 100644
--- a/apps/portal/src/app/features/profile/pages/ProfilePage.tsx
+++ b/apps/portal/src/app/features/profile/pages/ProfilePage.tsx
@@ -688,7 +688,7 @@ export function ProfilePage() {
                                 backgroundColor:
                                   i <= score
                                     ? `var(--mantine-color-${strengthColors[score]}-6)`
-                                    : 'var(--mantine-color-gray-2)',
+                                    : 'var(--mantine-color-gray-light)',
                               }}
                             />
                           ))}