.uni-checkbox {
  @include checkbox();
  will-change: border;

  & + label {
    @include align-items-center();
    width: auto;
    height: auto;
    min-height: 32px;
    white-space: initial;
    line-height: 1;
    padding-left: 48px;

    &:before {
      position: absolute;
      top: 50%;
      transform: translate3d(0, -50%, 0);
      left: 0;
    }

    svg {
      left: 8px;
    }

    .icon {
      width: 28px;
      height: 28px;
      margin-right: 8px;

      svg {
        display: block;
        left: unset;
        top: unset;
        width: inherit;
        height: inherit;
      }
    }

    @include breakpoint(small) {
      width: 100%;
      min-height: 60px;
      padding: 14px 14px 14px 62px;

      &:before {
        left: 14px;
      }

      svg {
        left: 22px;
      }
    }
  }
}