_nb-radio-buttons.scss

// Makes the readio buttons on NationBuilder’s donation, calendar, moneybomb, etc. pages appear as buttons on small screens

@import
  "global",
  "buttons";



  .radio-inline input[type="radio"], .radio-inline input[type="checkbox"], .checkbox-inline input[type="radio"], .checkbox-inline input[type="checkbox"] {
    display: none;

    &+label {
      @include button-base;
      @include button-size;
      @include button-style;
      width: 49%;

      @include single-transition(background-color);

      &.secondary { @include button-style($bg:$secondary-color); }
      &.success   { @include button-style($bg:$success-color); }
      &.alert     { @include button-style($bg:$alert-color); }

      &.large  { @include button-size($padding:$button-lrg); }
      &.small  { @include button-size($padding:$button-sml); }
      &.tiny   { @include button-size($padding:$button-tny); }
      &.expand { @include button-size($padding:null,$full-width:true); }

      &.left-align  { text-align: left; text-indent: rem-calc(12); }
      &.right-align { text-align: right; padding-right: rem-calc(12); }

      &.radius { @include button-style($bg:false, $radius:true); }
      &.round  { @include button-style($bg:false, $radius:$button-round); }

      &.disabled, &[disabled] { @include button-style($bg:$button-bg, $disabled:true);
        &.secondary { @include button-style($bg:$secondary-color, $disabled:true); }
        &.success { @include button-style($bg:$success-color, $disabled:true); }
        &.alert { @include button-style($bg:$alert-color, $disabled:true); }
      }
    }
    &:checked+label {
      background-color: $secondary-color;
    }
  }