@import "@primer/css/support/variables/layout.scss";

$bodyPadding: 0 16px 0px 16px;
$mutedTextColor: var(--fgColor-muted, var(--color-fg-muted, #656d76));

.container {
  max-width: 100%;
  width: 100%;
}

.disclaimerText {
  display: block;
  font-size: small !important;
  font-weight: var(--base-text-weight-normal, 400) !important;
  color: $mutedTextColor;
  margin: 8px 0px 18px 0px;
  padding: $bodyPadding;

  a {
    color: $mutedTextColor;
    text-decoration: underline;
  }
}

.markdownBodyOverrides {
  font-size: small;
  margin-top: 4px;
  margin-bottom: 16px;
  padding: $bodyPadding;
  ul {
    list-style-type: disc !important;
    padding-inline-start: 2em !important;
    margin-bottom: 16px;
  }
  ol {
    list-style-type: decimal !important;
    padding-inline-start: 2em !important;
    margin-bottom: 16px;
  }
}

.referencesTitle {
  margin: 0;
  padding-left: 0 !important;
}

.referencesList {
  margin-top: 12px !important;
}

.loadingContainer {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  height: 200px;
}

.displayForScreenReader {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.postAnswerWidgets {
  display: flex;
  flex-direction: row;
  padding-left: 12px !important;
}

.thumbsUpButton {
  border: none;
  background-color: unset;
  box-shadow: unset;

  &.selected {
    border: 1px solid var(--color-btn-text);
    color: var(--fgColor-accent) !important;
  }
}

.thumbsDownButton {
  border: none;
  background-color: unset;
  box-shadow: unset;

  &.selected {
    border: 1px solid var(--color-btn-text);
    color: var(--fgColor-accent) !important;
  }
}

.shareButton {
  border: none;
  background-color: unset;
  box-shadow: unset;

  &.copied {
    color: var(--fgColor-accent) !important;
  }
}