title: How to change checkbox background color in simple HTML
body: <p>I can not change checkbox background color. Any my attempt was unsuccessful, please see - <a href="https://jsfiddle.net/o4rnd1q7/1/" rel="nofollow noreferrer">https://jsfiddle.net/o4rnd1q7/1/</a></p>
  <pre><code>    input[type=&quot;checkbox&quot;] {
          background-color: #002B4E !important;
          color: white;
      }
  
      input[type=&quot;checkbox&quot;]:enabled:checked {
          background-color: #002B4E !important;
          color: white;
      }
  
     input[type=&quot;checkbox&quot;]:before {
          background-color: #002B4E !important;
          color: white;
      }
  
      input[type=&quot;checkbox&quot;]::before {
          background-color: #002B4E !important;
          color: white;
      }
  
      .dark-checkbox input[type=&quot;checkbox&quot;]:checked {
          background-color: #002B4E !important;
          color: white;
      }
  </code></pre>
  <p>Checkbox still has light blue color instead needed dark blue color.</p>
  <p><a href="https://i.stack.imgur.com/vM2fA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/vM2fA.png" alt="enter image description here" /></a></p>