@MY_z - I think clearing up a few concepts may be helpful
Breakpoints - Screen sizes run on breakpoints, that is what you see at the top of the screen (desktop, tablet, phone) you can set different styles at different breakpoints, so lets say you want the button orange on tablet and blue on phone, you can do that by adjusting the style at each breakpoint. Otherwise as I previously stated the breakpoints cascade down, meaning that if you set a style on desktop it will apply to all smaller screen sizes unless you specify otherwise at another breakpoint.
States - What you showed in your last post was an element state. Elements can exist in different states, think of a link for example, it can be in one of four states: normal, hover, visited, active and you can apply styles to each of these states across different breakpoints. Not that you would, but you could apply a different hover color for links on every breakpoint (purple on desktop, blue on tablet, etc…)
To wrap up, I would recommend outlining what you want to have happen, if it’s one background color on all devices for all states, you would just set that on desktop (or tablet in this case since the element doesn’t become visible until that breakpoint) and that will cascade down to each breakpoint. So check all of your breakpoints for any overriding styles, by clicking through each breakpoint one by one and checking the bg color. You can do the same for states, if you want one bg color on all states, just set it in it’s normal state and it will apply to all (in most cases this is true, but browsers have some default styles for common elements like links that you may have to override).
Does that makes sense / help?