Test instructions copy icon color should match the text color to ensure it matches the theme colors.

[brettshumaker]

Description

When the test instructions include a copyable test card number, there's a copy icon beside the number. Currently, this is an SVG as the background image of an HTML element and is a static color (black). When the user clicks to copy the number and that's successful, the icon changes to a green checkmark. Ideally, both icons will match the text color based on the WooPayments computed styles for the theme so they don't blend in with the background.

Acceptance criteria

• The "copy" icon matches the text color and is determined by the styles computed by WooPayments.
• The "check" icon matches the text color and is determined by the styles computed by WooPayments.

Dev notes

I realize we can't directly affect the fill color of the SVG since it's being output as a background-image, but I think we can effectively achieve the same thing using masks. We'd need to ensure browser compatibility with all of the properties, but it could look something like this:

.icon-selector {
    mask-image: url('path/to/svg/copy.svg');
    mask-size: contain;
    mask-repeat: no-repeat;
    mask-position: center;
    background-color: var(--text-color-from-computed-styles);
}

Additional Context

This was mentioned in #9488 so I split it out into its own issue.