/* CodeKids public accessibility toolbar */
html.cka-reduce-motion *,
html.cka-reduce-motion *::before,
html.cka-reduce-motion *::after {
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  scroll-behavior: auto !important;
  transition-duration: .001ms !important;
}

html.cka-highlight-links body a {
  background: #ffeb3b !important;
  color: #000 !important;
  outline: 3px solid #000 !important;
  outline-offset: 2px !important;
  text-decoration: underline !important;
}

html.cka-highlight-headings body :is(h1,h2,h3,h4,h5,h6) {
  background: #fff36b !important;
  color: #000 !important;
  outline: 3px solid #000 !important;
  outline-offset: 3px !important;
}

html.cka-readable-font body,
html.cka-readable-font body * {
  font-family: Arial, Helvetica, sans-serif !important;
  letter-spacing: normal !important;
}

html.cka-monochrome body { filter: grayscale(1) !important; }
html.cka-sepia body { filter: sepia(1) !important; }
html.cka-invert body { filter: invert(1) hue-rotate(180deg) !important; }
html.cka-high-contrast body { filter: contrast(1.85) saturate(1.15) !important; }

html.cka-black-yellow body,
html.cka-black-yellow body *:not(img):not(video):not(canvas):not(svg):not(path) {
  background-color: #000 !important;
  background-image: none !important;
  border-color: #ffeb00 !important;
  color: #ffeb00 !important;
  text-shadow: none !important;
}

html.cka-black-yellow body a,
html.cka-black-yellow body button,
html.cka-black-yellow body input,
html.cka-black-yellow body select,
html.cka-black-yellow body textarea {
  outline-color: #ffeb00 !important;
}

html.cka-keyboard-nav body :focus-visible {
  outline: 4px solid #ff8a00 !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 7px #fff !important;
}

html.cka-big-cursor body,
html.cka-big-cursor body * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 48 48'%3E%3Cpath d='M5 3v35l10-9 7 15 7-4-7-14h14z' fill='white' stroke='black' stroke-width='3'/%3E%3C/svg%3E") 5 3, auto !important;
}

html.cka-black-cursor body,
html.cka-black-cursor body * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M3 2v24l7-6 5 10 5-3-5-10h10z' fill='black' stroke='white' stroke-width='1.5'/%3E%3C/svg%3E") 3 2, auto !important;
}

.cka-fixed-description {
  display: block !important;
  margin: 5px 0 12px !important;
  padding: 7px 10px !important;
  border: 2px solid #111 !important;
  border-radius: 6px !important;
  background: #fff !important;
  color: #111 !important;
  font: 700 15px/1.4 Arial, sans-serif !important;
  text-align: center !important;
}

#cka-description-bubble {
  position: fixed !important;
  z-index: 2147483646 !important;
  max-width: min(360px, calc(100vw - 24px)) !important;
  padding: 9px 12px !important;
  border: 2px solid #fff !important;
  border-radius: 7px !important;
  background: #111 !important;
  color: #fff !important;
  box-shadow: 0 4px 18px rgba(0,0,0,.38) !important;
  font: 700 15px/1.35 Arial, sans-serif !important;
  pointer-events: none !important;
  direction: rtl !important;
}

#cka-live-region {
  position: fixed !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
}
