TextInput should have more prominent disabled styles + required validation error still shows up

Describe the bug
TextInput disabled styles are almost indistinguishable from the normal styles (except for the cursor on hover). I believe it should have more of a visual difference (cc @laurelterlesky) as at least I can't tell that they are disabled.

Secondly and perhaps more importantly, if the TextInput is required, gets validated and later on disabled, the error message still shows up but it should be cleaned up.

To Reproduce
Steps to reproduce the behavior:

1. Mount the TextInput with the required prop and make the disabled prop be a ref somewhere else that can be toggled (more on the video below)
2. Click on the TextInput and click away (hence triggering the empty validation)
3. Click on the another component (a checkbox for example) that flips the disabled prop to true
4. See that the error message is still shown

Expected behavior
The error message should be cleared and one should be able to visually distinguish disabled / enabled TextInputs.

https://github.com/user-attachments/assets/811d53a1-4470-4c47-9fd7-051d25d6e150