fix: Profile CSS Fix

Author: kartikpersistent

frontend/src/App.css

@@ -360,4 +360,11 @@
   height: calc(100vh - 58px);
   min-height: 200px;
   display: flex
+}
+.profile-container{
+  display:flex;
+  gap:4px;
+  align-items:center;
+  border: 1px solid rgb(var(--theme-palette-neutral-border-strong));
+  border-radius: 12px;
 }

frontend/src/components/User/Profile.tsx

@@ -30,11 +30,7 @@ export default function Profile() {
   }
   if (isAuthenticated) {
     return (
-      <div
-        className='hidden 
-    md:flex md:p-1.5 md:gap-2 md:h-12 md:items-center md:inline-block 
-    md:border md:border-[rgb(var(--theme-palette-neutral-border-strong))] md:rounded-xl'
-      >
+      <div className=' p-1.5 h-12 profile-container'>
         <>
           <Avatar
             className='md:flex hidden'

frontend/src/index.css

@@ -2,14 +2,6 @@
 
 @config '../tailwind.config.js';
 
-/*
-  The default border color has changed to `currentColor` in Tailwind CSS v4,
-  so we've added these compatibility styles to make sure everything still
-  looks the same as it did with Tailwind CSS v3.
-
-  If we ever want to remove these styles, we need to add an explicit border
-  color utility to any element that depends on these defaults.
-*/
 @layer base {
   *,
   ::after,