/* Shared accessibility additions. Keep visual theme rules in style.css unchanged. */
:where(
  a[href],
  area[href],
  button,
  input:not([type="hidden"]),
  select,
  textarea,
  summary,
  [tabindex]:not([tabindex="-1"])
):focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px #fff !important;
}

.a11y-icon-button,
.info-button {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
}

.a11y-icon-button {
  line-height: 1;
}

.a11y-icon-button.bi-info-lg {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  border-radius: 50%;
  background: transparent;
  border: 1px solid rgb(0, 112, 192);
  color: rgb(0, 112, 192);
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 800;
  text-align: center;
  vertical-align: middle;
}

#formHtml .bi-info-lg {
  background: rgb(0, 112, 192);
  border-color: rgb(0, 112, 192);
  color: #fff;
}

.a11y-icon-button.bi-info-lg:focus,
.a11y-icon-button.bi-info-lg:focus-visible {
  outline: 3px solid #1f2937 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 2px #fff !important;
  z-index: 2;
}

.info-button {
  color: inherit;
  vertical-align: middle;
}

.ag-checkbox-input:focus,
.ag-checkbox-input:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 2px #fff !important;
}

@media (forced-colors: active) {
  :where(
    a[href],
    area[href],
    button,
    input:not([type="hidden"]),
    select,
    textarea,
    summary,
    [tabindex]:not([tabindex="-1"])
  ):focus-visible {
    outline-color: CanvasText !important;
    box-shadow: none !important;
  }
}