How to apply multiple pseudo class in CSS

Suppose we have a checkbox , I want to apply style only when the checkbox is checked as well as it is focused.

What is the correct way to do that?

I have written this code, is there any better solution.

input[type:'checkbox']:focus:checked { }

Note: If we use a native checkbox with <input type="checkbox" /> , this behaviour is already provided on focus we get a blue outline around the checkbox.I want to achieve the same behaviour using CSS.