html.a11y-contrast {

  --color-white: #fff;
  --color-black: #000;

  --color-petrol: #000;

  --color-petrol-light: #5f5f5f;

  --color-blue-light: var(--color-blue-ice);

  --color-sea-green: #fff;

  --color-yellow-light: #fff;

  --color-yellow: #cdcdcd;

  --color-green: var(--color-blue-ice);

  --color-lightgrey: #cdcdcd;
  --color-darkgrey: #5f5f5f;

  background-color: #fff;
  color: #000;

}

html.a11y-contrast .button,
html.a11y-contrast .button.button-bordered,
html.a11y-contrast .button-petrol {
  background-color: #000 !important;
  border-color: #000 !important;
  color: #fff !important;
}

html.a11y-contrast .button:hover,
html.a11y-contrast .button.button-bordered:hover,
html.a11y-contrast .button-petrol:hover {
  background-color: #5f5f5f !important;
  border-color: #5f5f5f !important;
  color: #fff !important;
}

html.a11y-contrast .bg-petrol .button,
html.a11y-contrast .bg-petrol .button.button-bordered,
html.a11y-contrast .bg-petrol .button-petrol,
html.a11y-contrast section.bg-green .button,
html.a11y-contrast section.bg-green .button.button-bordered,
html.a11y-contrast section.bg-green .button-petrol {
  background-color: #fff !important;
  border-color: #fff !important;
  color: #000 !important;
}

html.a11y-contrast .bg-petrol .button:hover,
html.a11y-contrast .bg-petrol .button.button-bordered:hover,
html.a11y-contrast .bg-petrol .button-petrol:hover,
html.a11y-contrast section.bg-green .button:hover,
html.a11y-contrast section.bg-green .button.button-bordered:hover,
html.a11y-contrast section.bg-green .button-petrol:hover {
  background-color: var(--color-blue-ice) !important;
  border-color: var(--color-blue-ice) !important;
  color: #000 !important;
}

html.a11y-contrast [aria-controls="site-menu"] {
  background-color: #ffdc00;
  outline: 2px solid #000;
  outline-offset: -2px;
}

html.a11y-contrast [aria-controls="site-menu"] .menuOpener {
  color: #000;
}

html.a11y-contrast [aria-controls="site-menu"] .menuOpener:hover {
  background-color: #000;
  color: #fff;
}

html.a11y-contrast [aria-controls="site-menu"] > a {
  background-color: #000;
}

html.a11y-contrast [aria-controls="site-menu"] > a svg path {
  fill: #fff;
}

html.a11y-contrast [aria-controls="site-menu"] > a:hover {
  background-color: var(--color-blue-ice);
}

html.a11y-contrast [aria-controls="site-menu"] > a:hover svg path {
  fill: #000;
}

html.a11y-contrast .menuContainer {
  background-image: url("../img/menu-hart-contrast.svg");
}

html.a11y-contrast .menuCloser > div:first-child {
  background-color: #000;
}

html.a11y-contrast .menuCloser svg path {
  fill: #fff;
  stroke: #fff;
}

html.a11y-contrast .bg-green:has(.ticker) {
  background-color: #5f5f5f;
  color: #fff;
}

html.a11y-contrast :focus-visible {
  outline: 3px solid #000;
  outline-offset: 3px;
}

html.a11y-contrast footer :focus-visible,
html.a11y-contrast .bg-petrol :focus-visible,
html.a11y-contrast section.bg-green :focus-visible,
html.a11y-contrast .bg-green:has(.ticker) :focus-visible,
html.a11y-contrast .docenten-panel :focus-visible {
  outline-color: #fff;
}

html.a11y-contrast .text-yellow,
html.a11y-contrast .text-green,
html.a11y-contrast .hover\:text-yellow:hover {
  color: #000;
}

html.a11y-contrast footer .text-yellow,
html.a11y-contrast .bg-petrol .text-yellow,
html.a11y-contrast .bg-petrol .text-green {
  color: #fff;
}

html.a11y-contrast footer .hover\:text-yellow:hover,
html.a11y-contrast .bg-petrol .hover\:text-yellow:hover {
  color: var(--color-blue-ice);
}

html.a11y-contrast #mce-success-response {
  border-color: #000 !important;
}

html.a11y-contrast section.bg-blue-light,
html.a11y-contrast section.bg-blue-ice {
  background-color: #fff;
}

html.a11y-contrast section.bg-green {
  background-color: #000;
  color: #fff;
}

html.a11y-contrast section.bg-blue-light + section::before,
html.a11y-contrast section.bg-blue-ice + section::before,
html.a11y-contrast section.bg-blue-light + .fold-group .fold-group__inner > :first-child::before,
html.a11y-contrast section.bg-blue-ice + .fold-group .fold-group__inner > :first-child::before {
  background-color: #fff;
}

html.a11y-contrast [role="dialog"]:not(.cookiemonster-dialog-wrapper) > div {
  background-color: #fff;
}

html.a11y-contrast [role="dialog"]:not(.cookiemonster-dialog-wrapper) > div,
html.a11y-contrast [role="dialog"]:not(.cookiemonster-dialog-wrapper) > div * {
  color: #000 !important;
}

@media (min-width: 1024px) {
  html.a11y-contrast .lg\:bg-petrol .button,
  html.a11y-contrast .lg\:bg-petrol .button.button-bordered,
  html.a11y-contrast .lg\:bg-petrol .button-petrol {
    background-color: #ffdc00 !important;
    border-color: #ffdc00 !important;
    color: #000 !important;
  }

  html.a11y-contrast .lg\:bg-petrol .button:hover,
  html.a11y-contrast .lg\:bg-petrol .button.button-bordered:hover,
  html.a11y-contrast .lg\:bg-petrol .button-petrol:hover {
    background-color: #fff !important;
    border-color: #fff !important;
    color: #000 !important;
  }
}

html.a11y-contrast main .bg-white:not(section, input, textarea, select, .filter-bar, .page-submenu) {
  background-color: var(--color-blue-ice);
}

html.a11y-contrast .ruimte-card {
  background-color: var(--color-blue-ice);
}

html.a11y-contrast .ruimte-sidebar {
  background-color: var(--color-blue-ice);
}

html.a11y-contrast .highlight-rond {
  background-color: #cdcdcd;
}

html.a11y-contrast .cover--home,
html.a11y-contrast .menuContainer {
  background-color: var(--color-blue-ice);
}

html.a11y-contrast .docenten-panel {
  background-color: #5f5f5f;
  color: #fff;
}

html.a11y-contrast .sidebar--docenten::after {
  background-color: #5f5f5f;
}

html.a11y-contrast .filter-sea-green .facetwp-facet .facetwp-radio:not(.checked),
html.a11y-contrast .filter-sea-green .facetwp-facet .facetwp-checkbox:not(.checked) {
  background-color: #000;
  color: #fff;
}

html.a11y-contrast .filter-yellow .facetwp-facet .facetwp-radio:not(.checked),
html.a11y-contrast .filter-yellow .facetwp-facet .facetwp-checkbox:not(.checked),
html.a11y-contrast .facetwp-type-date_range,
html.a11y-contrast .facetwp-type-dropdown {
  background-color: #cdcdcd;
  color: #000;
}

html.a11y-contrast .facetwp-search {
  background-color: #fff;
  border-color: #000;
}

html.a11y-contrast ::placeholder {
  color: #000;
  opacity: 0.7;
}

html.a11y-contrast .ec-wrap {
  --ec-red: #000;
  --ec-red-mid: #000;
  --ec-red-light: var(--color-blue-ice);
  --ec-event: var(--color-blue-ice);
  --ec-blue: #000;
  --ec-text: #000;
  --ec-muted: #5f5f5f;
  --ec-border: rgba(0, 0, 0, 0.35);
  background: #fff;
}

html.a11y-contrast .ec-btn-today {
  background: #cdcdcd;
  color: #000;
}