feat: Add xSmall size and destructive variant to UiChip, refactor AttireItemCard to use these new chip features, and adjust body4r font size.

apps/mobile/packages/features/staff/profile_sections/onboarding/attire/lib/src/presentation/widgets/attire_item_card.dart

@@ -21,9 +21,6 @@ class AttireItemCard extends StatelessWidget {
     final bool hasPhoto = uploadedPhotoUrl != null;
 
     final String statusText = hasPhoto ? 'Pending' : 'Not Uploaded';
-    final Color statusColor = hasPhoto
-        ? UiColors.textWarning
-        : UiColors.textInactive;
 
     return GestureDetector(
       onTap: onTap,
@@ -33,13 +30,6 @@ class AttireItemCard extends StatelessWidget {
           color: UiColors.white,
           borderRadius: BorderRadius.circular(UiConstants.radiusBase),
           border: Border.all(color: UiColors.border),
-          boxShadow: const <BoxShadow>[
-            BoxShadow(
-              color: Color(0x19000000),
-              blurRadius: 4,
-              offset: Offset(0, 2),
-            ),
-          ],
         ),
         child: Row(
           crossAxisAlignment: CrossAxisAlignment.start,
@@ -68,7 +58,6 @@ class AttireItemCard extends StatelessWidget {
                 children: <Widget>[
                   Text(item.label, style: UiTypography.body1m.textPrimary),
                   if (item.description != null) ...<Widget>[
-                    const SizedBox(height: UiConstants.space1),
                     Text(
                       item.description!,
                       style: UiTypography.body2r.textSecondary,
@@ -80,19 +69,10 @@ class AttireItemCard extends StatelessWidget {
                   Row(
                     children: <Widget>[
                       if (item.isMandatory)
-                        Container(
-                          padding: const EdgeInsets.symmetric(
-                            horizontal: 8,
-                            vertical: 4,
-                          ),
-                          decoration: BoxDecoration(
-                            color: UiColors.error.withValues(alpha: 0.1),
-                            borderRadius: BorderRadius.circular(4),
-                          ),
-                          child: Text(
-                            'Required',
-                            style: UiTypography.footnote2m.textError,
-                          ),
+                        const UiChip(
+                          label: 'Required',
+                          size: UiChipSize.xSmall,
+                          variant: UiChipVariant.destructive,
                         ),
                       const Spacer(),
                       if (isUploading)
@@ -102,11 +82,10 @@ class AttireItemCard extends StatelessWidget {
                           child: CircularProgressIndicator(strokeWidth: 2),
                         )
                       else if (hasPhoto)
-                        Text(
-                          statusText,
-                          style: UiTypography.footnote2m.copyWith(
-                            color: statusColor,
-                          ),
+                        UiChip(
+                          label: statusText,
+                          size: UiChipSize.xSmall,
+                          variant: UiChipVariant.secondary,
                         ),
                     ],
                   ),