$control-size: rem(16px);

// Need to push the control down just a little to have it appear
// vertically centered with the label.
$control-vertical-adjustment: 2px;

.Biblio-Choice {
  display: inline-flex;
  justify-content: flex-start;
  padding: spacing(extra-tight) 0;
}

.Biblio-Choice--labelHidden {
  padding: 0;

  > .Biblio-Choice__Label {
    @include visually-hidden;
  }

  .Biblio-Choice__Control {
    margin-top: 0;
    margin-right: 0;
  }
}

.Biblio-Choice--disabled {
  > .Biblio-Choice__Label {
    color: color('ink', 'lightest');

    @media (-ms-high-contrast: active) {
      color: ms-high-contrast-color('disabled-text');
    }
  }
}

.Biblio-Choice__Control {
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  width: $control-size;
  height: $control-size;
  margin-top: $control-vertical-adjustment;
  margin-right: spacing(tight);

  > * {
    width: 100%;
  }
}

.Biblio-Choice__Label {
  @include text-style-body;
  -webkit-tap-highlight-color: transparent;
}

.Biblio-Choice__Descriptions {
  padding-left: spacing(tight) + $control-size;
}

.Biblio-Choice__HelpText {
  @include text-style-body;
  @include text-emphasis-subdued;
  margin-bottom: spacing(extra-tight);
}