Lastly, I wanted to share the CSS styles that I’m seeing applied to the payment element fields. These are the styles that are causing the input field color and background color to be black. If possible, perhaps you could find these styles in the theme stylesheets or another plugin’s stylesheets. If you can find these styles in the theme or another plugin, then I would assume they would most likely be the cause of the issue.
.Input, .p-FauxInput {
padding: var(–p-spacing3);
background-color: rgb(0, 0, 0);
border-radius: var(–borderRadius);
transition: background 0.15s ease, border 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
border: 1px solid var(–p-colorBackgroundDeemphasize10);
box-shadow: none;
border-bottom-color: rgb(0, 0, 0);
border-bottom-left-radius: 0px;
border-bottom-right-radius: 0px;
border-bottom-style: solid;
border-bottom-width: 1.73536px;
border-left-color: rgb(0, 0, 0);
border-left-style: solid;
border-left-width: 1.73536px;
border-right-color: rgb(0, 0, 0);
border-right-style: solid;
border-right-width: 1.73536px;
border-top-color: rgb(0, 0, 0);
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-top-style: solid;
border-top-width: 1.73536px;
color: rgb(0, 0, 0);
font-family: Lato, Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: 400;
letter-spacing: normal;
line-height: 22.4px;
outline-offset: 0px;
padding-bottom: 0px;
padding-left: 15px;
padding-right: 15px;
padding-top: 0px;
text-decoration: none solid rgb(0, 0, 0);
text-shadow: none;
text-transform: none;
outline: 0px none rgb(0, 0, 0);
}
.
