/*
 * phaedo-cms -- a nav link drawn as images, one for each state the link can be
 * in, by cms_nav_label. Every state's image is in the page; these rules hide
 * all but the one for the state the link is in.
 *
 * The link is the parent of .cms-nav-image, and the conditions below are
 * written so that exactly one of them holds for it at any moment: pressed,
 * else hovered, else focused from the keyboard, else at rest. Each only hides,
 * so the image left showing keeps whatever display the site gives it.
 *
 * Unlayered and !important, so no rule of the site's can show every state at
 * once by accident -- a layered one, or an unlayered one from an id selector,
 * which would otherwise outrank these. The image left showing is untouched,
 * so the site styles it as it likes.
 */

:not(:hover, :focus-visible, :active)
  > .cms-nav-image:not(.cms-nav-image--current)
  > img:not([data-state="inactive"]),
:hover:not(:active)
  > .cms-nav-image:not(.cms-nav-image--current)
  > img:not([data-state="hover"]),
:focus-visible:not(:hover, :active)
  > .cms-nav-image:not(.cms-nav-image--current)
  > img:not([data-state="focus"]),
:active
  > .cms-nav-image:not(.cms-nav-image--current)
  > img:not([data-state="pressed"]) {
  display: none !important;
}