fix(web): Smaller card titles in the user info page

Author: MohamedBassem

apps/web/components/settings/ChangePassword.tsx

@@ -65,7 +65,7 @@ export function ChangePassword() {
   return (
     <Card>
       <CardHeader>
-        <CardTitle className="flex items-center gap-2">
+        <CardTitle className="flex items-center gap-2 text-xl">
           <Lock className="h-5 w-5" />
           Security
         </CardTitle>

apps/web/components/settings/UserDetails.tsx

@@ -15,7 +15,7 @@ export default async function UserDetails() {
       <CardHeader>
         <div className="flex items-center space-x-4">
           <div className="space-y-1">
-            <CardTitle className="flex items-center gap-2">
+            <CardTitle className="flex items-center gap-2 text-xl">
               <User className="h-5 w-5" />
               {t("settings.info.basic_details")}
             </CardTitle>

apps/web/components/settings/UserOptions.tsx

@@ -106,7 +106,7 @@ export default function UserOptions() {
     <Form {...form}>
       <Card>
         <CardHeader>
-          <CardTitle className="flex items-center gap-2">
+          <CardTitle className="flex items-center gap-2  text-xl">
             <Globe className="h-5 w-5" />
             {t("settings.info.options")}
           </CardTitle>