feat(ui): restyle textarea field to match v4 design (#16427)

## Summary
Restyles the Textarea field component to match the v4 design.

## Changes
- Updated `packages/ui/src/fields/Textarea/index.css`:
  - Added hover state: border becomes visible on hover
  - Updated focus state: blue border (`--border-selected-strong`)
- Fixed read-only styling: white background + gray border (was using
disabled colors)
- Added flex + gap to `.field-type__wrap` for proper spacing between
input and description
  
- Updated `test/v4/collections/Textarea/index.ts`:
- Added proper field variants for testing: default, required, readOnly,
disabled
- Added defaultValues to readOnly/disabled fields so content is visible
for testing
  
## Reference

https://app.asana.com/1/10497086658021/project/1213409914712008/task/1214061555627404?focus=true

---------

Co-authored-by: Patrik Kozak <35232443+PatrikKozak@users.noreply.github.com>

Author: JarrodMFlesch

packages/ui/src/fields/Textarea/index.css

@@ -5,23 +5,38 @@
     flex-direction: column;
     gap: var(--spacer-2);
 
+    .field-type__wrap {
+      display: flex;
+      flex-direction: column;
+      gap: var(--spacer-2);
+    }
+
     textarea {
       overflow-y: auto;
       resize: vertical;
       min-height: 3.75rem;
       height: auto;
       display: flex;
       field-sizing: content;
+
+      &:hover:not(:focus):not(:disabled) {
+        border-color: var(--border-default-default);
+      }
+
+      &:focus {
+        border-color: var(--border-selected);
+      }
     }
 
     textarea:not(:empty) {
       min-height: calc(var(--rows) * var(--base) + 1rem + 0.125rem);
     }
 
     &.read-only {
-      .textarea-outer {
-        background: var(--bg-disabled-default);
-        color: var(--text-disabled-default);
+      textarea {
+        background: var(--bg-default-default);
+        border-color: var(--border-default-default);
+        color: var(--text-default);
       }
     }
 

test/v4/collections/Textarea/index.ts

@@ -16,19 +16,32 @@ const TextareaFields: CollectionConfig = {
     {
       name: 'contentRequired',
       type: 'textarea',
-      label: 'Content',
+      label: 'Content Required',
       required: true,
       admin: {
-        description: 'The main body content for this entry',
+        description: 'This field is required',
       },
     },
     {
-      name: 'contentDisabled',
+      name: 'contentReadOnly',
       type: 'textarea',
-      label: 'Content',
+      label: 'Content Read Only',
+      defaultValue:
+        'Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers.',
       admin: {
         readOnly: true,
-        description: 'The main body content for this entry',
+        description: 'This field is read-only',
+      },
+    },
+    {
+      name: 'contentDisabled',
+      type: 'textarea',
+      label: 'Content Disabled',
+      defaultValue:
+        'Payload is the open-source, fullstack Next.js framework, giving you instant backend superpowers.',
+      admin: {
+        disabled: true,
+        description: 'This field is disabled',
       },
     },
   ],