// #############################################################################
// CSS for the AXE/AXS output in debug mode
//
// NOTE: this is used if the axs reporter uses the visible reporter mode which
// is set by a run-time config _or_ if the browser does not support
// concole.table.
// #############################################################################

.wc_a11y {
  border: 1px solid $wc-debug-color-border;
  margin: 1rem;

  > a {
    margin: 0 .25rem;
  }

  // I have never seen a warning level issue in WComponents which has NOT been
  // a false negative.
  &.warning {
    border-color: $wc-debug-color-warning;

    &::before {
      background-color: $wc-debug-color-warning;
      content: 'A11Y: WARNING';
    }
  }

  &.severe {
    border-color: $wc-debug-color-error;

    &::before {
      background-color: $wc-debug-color-error;
      content: 'A11Y: SEVERE';
    }
  }

  &.warning,
  &.severe {
    &::before {
      box-sizing: border-box;
      color: $wc-debug-color-fg;
      display: block;
      font-weight: bold;
      margin-bottom: .5rem;
      padding: .25rem;
      text-align: center;
      width: 100%;
    }
  }
}
