/*
 * This is some CSS for accessibility.
 */

/* Red outline around focused elements */
*:focus-visible {
  outline: 2px solid #ff2d16 !important;
  outline-offset: 2px;

  .layout-red-background:not(:hover) & {
    outline: 2px solid white !important;
  }
}

/* Screenreader only style */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border-width: 0;
}

/* Open desktop sub-menu on focus */
@media only screen and (min-width: 768px) {

  ul.nav li a.has-focus ~ ul {
    display: block;
  }
}

/* Make mobile menu scrollable */
.taptap-main-inner {
  max-height: 100vh;
  overflow: auto;
}