/*
 * Accessibility bar modes. /a11y/a11y.js sets the a11y-* classes on <html> and remembers them.
 * The bar itself lives in a Shadow DOM inside <livetop-a11y id="a11y-host">, so these rules
 * exclude it and the theme's CSS can't reach it.
 */

/* Always on: a clear focus ring for keyboard users, and a skip link that appears on focus. */
:focus-visible {
  outline: 3px solid #ffbf00 !important;
  outline-offset: 2px !important;
}
.a11y-skip {
  position: fixed;
  top: 8px;
  right: 8px;
  z-index: 2147483001;
  padding: 10px 16px;
  border-radius: 4px;
  background: #0b3d91;
  color: #fff !important;
  font: 700 16px/1.2 Arial, Tahoma, sans-serif;
  text-decoration: none;
  transform: translateY(-200%);
}
.a11y-skip:focus {
  transform: none;
}

/* Colour modes (only one at a time). A filter on <html> keeps position:fixed working. */
html.a11y-grayscale {
  filter: grayscale(1);
}
html.a11y-invert {
  filter: invert(1) hue-rotate(180deg);
  background: #fff;
}
html.a11y-invert img,
html.a11y-invert video,
html.a11y-invert iframe,
html.a11y-invert #a11y-host {
  filter: invert(1) hue-rotate(180deg);
}
html.a11y-contrast body,
html.a11y-contrast body *:not(#a11y-host) {
  background-color: #000 !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #fff !important;
  text-shadow: none !important;
  box-shadow: none !important;
}
/* Inline text stays transparent over its black block: a background on each line fragment would
   paint over the previous line's Arabic dots and descenders. The :not(#a11y-host) on these
   overrides matches the rule above's specificity, which beats the theme's !important classes. */
html.a11y-contrast body :is(span, a, strong, b, em, i, u, small, sub, sup, mark, abbr, label, font, code, q, cite):not(#a11y-host) {
  background-color: transparent !important;
}
html.a11y-contrast body a:not(#a11y-host),
html.a11y-contrast body a *:not(#a11y-host) {
  color: #ffeb3b !important;
}

/* Readable font: everything except the theme's icon fonts. */
html.a11y-font body *:not(#a11y-host):not(.et-pb-icon):not(.et_pb_menu__icon):not([class*="custon_icon"]) {
  font-family: Arial, Tahoma, "Segoe UI", sans-serif !important;
}

html.a11y-links body a:not(#a11y-host) {
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
  text-underline-offset: 3px !important;
  outline: 2px dashed currentColor;
  outline-offset: 2px;
}

/* Stop animations; Divi's entrance-animated blocks are shown in their final state. */
html.a11y-noanim *,
html.a11y-noanim *::before,
html.a11y-noanim *::after {
  animation-duration: 0s !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0s !important;
  transition-delay: 0s !important;
  scroll-behavior: auto !important;
}
html.a11y-noanim .et_animated,
html.a11y-noanim .et-waypoint {
  opacity: 1 !important;
  animation: none !important;
  transform: none !important;
}

html.a11y-cursor,
html.a11y-cursor * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='44' viewBox='0 0 44 44'%3E%3Cpath d='M5 3v31l8-7 6 13 6-3-6-12h11z' fill='%23000' stroke='%23fff' stroke-width='2.5' stroke-linejoin='round'/%3E%3C/svg%3E") 5 3, auto !important;
}

@media print {
  #a11y-host,
  .a11y-skip {
    display: none !important;
  }
}
