@import url("../index.scss");

.digit-radio-wrap {
  @apply my-sm block leading-10 mb-lg;

  div {
    @apply block mb-md;
  }

  .digit-radio-btn-wrap {
    @apply block float-left relative;
    &:hover {
      .digit-radio-btn-checkmark {
        @apply border-primary-main;
      }
    }
  }

  .digit-radio-btn {
    @apply opacity-0 absolute cursor-pointer h-10 w-10;
  }

  .digit-radio-btn-checkmark {
    @extend .light-input-border;
    @apply h-10 w-10 border border-input-border border-solid rounded-full block;
  }

  label {
    @extend .light-text-color-primary;
    @apply text-text-primary text-form-field ml-md;
  }

  .digit-radio-btn-checkmark:after {
    content: "";
  }

  .digit-radio-btn-wrap input:checked ~ .digit-radio-btn-checkmark {
    /* @extend .light-input-border; */
    @apply border-2 border-primary-main;
  }

  .digit-radio-btn-wrap input:checked ~ .digit-radio-btn-checkmark:after {
    /* @extend .light-background; */
    @apply block bg-primary-main h-5 w-5 rounded-full absolute top-10 left-10;
  }
}
.digit-reverse-radio-selection-wrapper {
  div {
    @apply flex flex-row-reverse place-content-between items-center;
  }
}