refactor(style): apply new design

src/shared/components/Table.js

@@ -5,9 +5,9 @@ import Badge from './Badge';
 import { TorriGateIcon } from '../Icons';
 
 const ROW_SIZE = {
-    sm: { cell: 'px-4 py-3', header: 'px-6 py-4', mobile: 'p-4' },
-    md: { cell: 'px-6 py-4', header: 'px-6 py-4', mobile: 'p-6' },
-    lg: { cell: 'px-6 py-5', header: 'px-6 py-5', mobile: 'p-8' },
+    sm: { cell: 'px-4 py-[11px]', header: 'px-4 py-[9px]', mobile: 'p-4' },
+    md: { cell: 'px-4 py-[14px]', header: 'px-4 py-[12px]', mobile: 'p-5' },
+    lg: { cell: 'px-4 py-[18px]', header: 'px-4 py-[14px]', mobile: 'p-6' },
 };
 
 const Table = ({
@@ -21,7 +21,7 @@ const Table = ({
     getRowProps,
     emptyMessage = 'Aucune donnée',
     emptyDescription = 'Aucun élément à afficher',
-    size = 'md',
+    size = 'sm',
     className = '',
     ...props
 }) => {
@@ -172,7 +172,7 @@ const Table = ({
                             {columns.map((column) => (
                                 <th
                                     key={column.key}
-                                    className={`${sizeClasses.header} ${column.headerAlign === 'right' ? 'text-right' : 'text-left'} text-xs font-medium text-neutral-600 dark:text-neutral-300 uppercase tracking-wider ${
+                                    className={`${sizeClasses.header} ${column.headerAlign === 'right' ? 'text-right' : 'text-left'} text-[11px] font-medium text-neutral-500 dark:text-neutral-400 uppercase tracking-[0.04em] ${
                                         column.sortable ? 'cursor-pointer hover:text-neutral-900 dark:hover:text-white transition-colors' : ''
                                     }`}
                                     onClick={column.sortable && onSort ? () => onSort(column.key) : undefined}
@@ -185,7 +185,7 @@ const Table = ({
                             ))}
                         </tr>
                     </thead>
-                    <tbody className="divide-y divide-neutral-200 dark:divide-neutral-700/30">
+                    <tbody className="divide-y divide-neutral-200 dark:divide-neutral-700/30 text-[13px]">
                         {loading ? (
                             Array.from({ length: 5 }).map((_, index) => (
                                 <SkeletonRow key={index} />