fix(ui): improve mobile responsiveness across admin components

- reduce app name font size from text-lg to text-sm in AdminTop mobile header
- make profile page cards full-width on mobile with sm:min-w-3/5 breakpoint
- stack photo upload layout vertically on mobile using flex-col sm:flex-row
- add flex-wrap to photo action buttons for small screens
- make TabNav horizontally scrollable with hidden scrollbar on mobile
- add shrink-0 and whitespace-nowrap to tab buttons to prevent wrapping

src/features/admin/pages/ProfilePage.client.js

@@ -239,7 +239,7 @@ const ProfilePage = ({ user: initialUser }) => {
                 {activeTab === 'informations' && (
                     <Card
                         title="Informations personnelles"
-                        className="min-w-3/5"
+                        className="w-full sm:min-w-3/5"
                         footer={
                             <div className="flex items-center justify-end gap-3">
                                 <Button
@@ -309,7 +309,7 @@ const ProfilePage = ({ user: initialUser }) => {
                 {activeTab === 'securite' && (
                     <Card
                         title="Changer le mot de passe"
-                        className="min-w-3/5"
+                        className="w-full sm:min-w-3/5"
                         footer={
                             <div className="flex items-center justify-end gap-3">
                                 <Button
@@ -377,7 +377,7 @@ const ProfilePage = ({ user: initialUser }) => {
                 {activeTab === 'sessions' && (
                     <Card
                         title="Sessions actives"
-                        className="min-w-3/5"
+                        className="w-full sm:min-w-3/5"
                         footer={
                             <div className="flex justify-end">
                                 <Button
@@ -443,11 +443,11 @@ const ProfilePage = ({ user: initialUser }) => {
                 )}
 
                 {activeTab === 'photo' && (
-                    <Card title="Photo de profil" className="min-w-3/5">
+                    <Card title="Photo de profil" className="w-full sm:min-w-3/5">
                         <p className="text-sm text-neutral-500 dark:text-neutral-400">
                             Téléchargez une nouvelle photo de profil. Taille max 5MB.
                         </p>
-                        <div className="flex items-center gap-6">
+                        <div className="flex flex-col sm:flex-row items-start sm:items-center gap-4 sm:gap-6">
                             <div className="relative shrink-0">
                                 <UserAvatar user={user} size="xl" />
                                 {uploadingImage && (
@@ -456,7 +456,7 @@ const ProfilePage = ({ user: initialUser }) => {
                                     </div>
                                 )}
                             </div>
-                            <div className="flex gap-2">
+                            <div className="flex flex-wrap gap-2">
                                 <input
                                     ref={fileInputRef}
                                     type="file"