:disabled is a state, not just a gray color

Useful to know

:disabled selects items that are in actual off state. It means that the user cannot activate or edit them in the usual way; they do not get the standard focus. [1]

Example: button:disabled { opacity: 0.6; }. Only class .disabled and pale color do not create this behavior. In native form controls, use disabled, when this is the desired semantics. Explain why the action is inaccessible if the reason is not obvious. Hiding the possibility through CSS does not replace the permission check when processing the request.