/* ============================================================
   focus.css — the visible focus ring for controls carrying the house
   button pattern (role="button").

   Two-tone on purpose. The ink ring is the site's own #1b1a18, and the
   white halo beneath it keeps the ring legible where a control sits on a
   dark or photographic ground (the image workspace, the cart panel).

   :focus-visible only, so a mouse click never draws it — same rule the
   header add-to-cart cell already follows.
   ============================================================ */

[role="button"]:focus-visible {
    outline: 2px solid #1b1a18;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.95);
}

/* The workspace image controls sit on the photo itself; give the halo a
   little more body there so the ring survives a light image too. */
.image_controls_btn[role="button"]:focus-visible {
    box-shadow: 0 0 0 4px rgba(255, 255, 255, 0.98), 0 0 0 6px rgba(0, 0, 0, 0.35);
}