I managed to change the background of the text field using Inspect Element and managed to figure out which is the CSS that set the text field background color, and managed to change it to white background with black text, so I do consider it working for now.
However, I was hoping to set it to a black background with white text, but the CSS for the text was inherited and I could not figure out which was the CSS file that controlled the text color. Using Inspect Element to check the source CSS file I could only get the below string
<website url>/wp-admin/load-styles.php?c=0&dir=ltr&load%5Bchunk_0%5D=dashicons,admin-bar,buttons,media-views,editor-buttons,wp-components,wp-block-editor,wp-nux,wp-editor,wp-block-library,wp-block-&load%5Bchunk_1%5D=library-theme,wp-edit-blocks,wp-edit-post,wp-format-library,wp-block-directory,common,forms,admin-menu,dashboard,list-tables,edi&load%5Bchunk_2%5D=t,revisions,media,themes,about,nav-menus,wp-pointer,widgets,site-icon,l10n,wp-auth-check,wp-color-picker&ver=5.5.3
Based on this string I’m not really sure where to look for the parent CSS that is causing the inheritance. How do I prevent the CSS for this particular element from inheriting the parent CSS?