title: CSS box-shadow for solid button:focus without knowing background color?
body: <p>I'm working on <a href="https://codepen.io/ryanve/pen/OjRmaM" rel="nofollow noreferrer">some button styles on codepen</a> and am using double box-shadow to produce this effect for use as a <code>:focus</code> state.</p>
  
  <pre><code>box-shadow: 0 0 0 3px currentColor, 0 0 0 5px var(--background);
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/WRYLA.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/WRYLA.png" alt="focused button with double box-shadow"></a></p>
  
  <p>Is there a way to produce box-shadow like this without knowledge of the background color? Like to somehow inset the box-shadow? I'd like to produce this effect without needing to know the background color.</p>