@import "variables";
.cargo {

  &--inline {
    display: inline-block;
    margin-right: 33px;
  }

  &--info {
    label {
      background: url(/static/img/svg/Info3.svg) right bottom 45% no-repeat;
      background-size: 20px;
      padding-right: 26px;

      @media (max-width: $screen-xs-max) {
        padding-right: 20px;
      }
    }
  }

  input {
    width: 0;
    height: 0;
    display: none;

    &:checked {
      + label::before {
        background-color: var(--brand-primary);
        border-color: var(--brand-primary);
      }
    }

    &:disabled {
      + label {
        color: var(--brand-grey3);
        cursor: not-allowed;
      }
    }
  }

  &__label {
    display: flex;
    align-items: center;
    justify-content: left;
    margin-bottom: 0;

    &:before {
      content: '';
      display: inline-block;
      width: 26px;
      height: 26px;
      flex-shrink: 0;
      flex-grow: 0;
      border: var(--base-border);
      border-radius: var(--base-border-radius);
      margin-right: 10px;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: 50% 50%;
      background-color: white;
    }
  }
}