/* Dialog */
.a11y--dialog {
  /* padding: 30px; */
  padding: 0px;
  border: none;
  border-radius: 20px;
  box-shadow: 3px 5px 15px 3px rgba(0, 0, 0, 0.1);
  overscroll-behavior: none;
}

.a11y--dialog::backdrop {
  background-color: #afafaf4d;
}

.a11y--header {
  position: relative;
  margin: 0 30px;
  margin-top: 30px;
  padding-bottom: 25px;
  /* padding: 30px;
  padding-bottom: 0px; */
  /* margin-bottom: 10px; */
}
.a11y--header::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  border-radius: 50px;
  background-color: var(--color-9);
}
.a11y--content {
  position: relative;
  padding: 25px 30px;
  padding-right: calc(30px - 16px);
  /* padding-top: 25px; */
  max-height: 55dvh;
  overflow: auto;
  overscroll-behavior: none;
  scrollbar-gutter: stable;
}
.a11y--content::-webkit-scrollbar {
  width: 16px;
  height: 16px;
}
.a11y--content::-webkit-scrollbar-thumb {
  background-color: #DBDCE0;
  border: 4px solid transparent;
  border-radius: 10px;
  background-clip: padding-box;
}

.a11y--footer {
  position: relative;
  margin: 0 30px;
  margin-bottom: 30px;
  padding-top: 25px;
  /* padding: 30px;
  padding-top: 0px; */
}
.a11y--footer::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 2px;
  border-radius: 50px;
  background-color: var(--color-9);
}

#a11y-close {
  position: absolute;
  top: 11px;
  right: 12px;
  color: var(--color-4);
  background-color: var(--color-9);
}
#a11y-close svg {
  width: 28px;
  height: 28px;
}

/* .a11y--hr {
  margin: 25px 0;
} */

.a11y--title {
  position: relative;
  /* padding-bottom: 25px; */
  /* font-size: 2em; */
}

.a11y-toggle {
  width: clamp(48px,4.1vw,58px);
  height: clamp(48px,4.1vw,58px);
}

.a11y--help {
  display: block;
  margin: 0 auto;
  width: fit-content;
  font-size: .75em;
}



/* Taille de police */
body.font-large > * {
  --font-scale: 1.3;
  font-size: 130%;
}

/* Contrastes */
body.contrast-high {
  --color-primary: #000000;
  --color-secondary: #ffffff;
  --color-tertiary: #d0ff00;
  --color-4: #4E0DB8;
  --color-5: #6A1BFF;
  --color-6: #ffea00;
  --color-7: #00dfab;
  --color-8: #C2A3FF;
  --color-9: #f1efef;
  --color-10: #ff4c4c;
}
/* body.contrast-high > * {
  filter: contrast(1.2);
} */
body.contrast-high *:focus-visible {
  outline-color: #ff00aa;
}

body.contrast-high img,
body.contrast-high video {
  filter: contrast(1.1);
}

body.contrast-invert {
  --color-primary: #e9e900;
  --color-secondary: #000080;
  --color-tertiary: #000080;
  --color-4: #e9e900;
  --color-5: #e9e900;
  --color-6: #000080;
  --color-7: #000080;
  --color-8: #000080;
  --color-9: #000080;
  --color-10: #e9e900;
}
body.contrast-invert .site-main {
  background-color: var(--color-secondary);
}
body.contrast-invert *:focus-visible {
  outline-color: var(--color-primary);
}
/* body.contrast-invert *:not(svg, h1, h2, h3, h4, h5, h6, p, strong, em, span, img) {
  background-color: var(--color-secondary);
} */
/* body.contrast-invert *:not(svg) {
  color: var(--color-primary);
} */
body.contrast-invert *::before,
body.contrast-invert *::after {
  background-color: var(--color-primary);
  color: var(--color-secondary);
}
body.contrast-invert .btn.is-active {
  background-color: var(--color-primary);
  color: var(--color-secondary);
}
/* body.contrast-invert *:not(svg, h1, h2, h3, h4, h5, h6, p, strong, em, span) {
  background-color: #000080 !important;
}
body.contrast-invert *:not(svg) {
  color: #e9e900 !important;
}
body.contrast-invert *::before,
body.contrast-invert *::after {
  background-color: #e9e900;
  color: #000080;
}
body.contrast-invert hr {
  background-color: #e9e900 !important;
}
body.contrast-invert .btn {
  border-color: #e9e900 !important;
  box-shadow: 3px 4px 0 #e9e900 !important;
}
body.contrast-invert .btn.btn--flat,
body.contrast-invert .btn.btn--flat * {
  background-color: #e9e900 !important;
  color: #000080 !important;
  box-shadow: none !important;
}
body.contrast-invert .btn:hover,
body.contrast-invert .btn:focus-visible,
body.contrast-invert .btn.is-active {
  box-shadow: 0px 0px 0 #e9e900 !important;
}
body.contrast-invert .btn.is-active {
  background-color: #e9e900 !important;
  color: #000080 !important;
} */

/* Typographie OpenDyslexic */
@font-face {
  font-family: 'OpenDyslexic';
  src: url('../fonts/OpenDyslexic-Regular.otf'), url('../fonts/OpenDyslexic-Regular.woff'), url('../fonts/OpenDyslexic-Regular.woff2');
}

body.font-opendyslexic * {
  font-family: 'OpenDyslexic', Arial, sans-serif !important;
  --font-scale: .75;
}


/* Animations off */
body.animations-off *,
body.animations-off *::before,
body.animations-off *::after,
body.animations-off details::details-content {
  animation: none !important;
  transition: none !important;
  scroll-behavior: auto !important;
}