.o-inputbox {
    $_this: &;
    &__box {
        top: 2px;
        /* crit */
        #{$_this}--radio & {
            border-radius: 50%;
            /* crit */
        }
        &:before {
            @include absolute-center;
            line-height: 24px;
            color: #fff;
            opacity: 0;
            /* crit */
            #{$_this}--radio & {
                content: '';
                background-color: theme('colors.primary');
                width: 14px;
                height: 14px;
                border-radius: 50%;
                /* crit */
            }
        }
        input:checked~&,
        .is-selected & {
            &:before {
                opacity: 1;
            }
            input:disabled~& {
                opacity: .4;
                /* crit */
            }
        }
        input[type=checkbox]:checked ~ & {
			background-color: theme('colors.primary');
			border-color: theme('colors.primary');
			#{$_this}__tick {
				opacity: 1;
			}
		}

        input[type=radio]:checked~& {
            border-color: transparent;
            &:after {
                content: '';
                position: absolute 0;
                box-shadow: 0 0 0 2px $primary;
                border-radius: 50%;
            }
        }
        input:focus~& {
            box-shadow: 0 0 10px 0 rgba($secondary, 0.25);
        }
        input:disabled~& {
			background-color: theme('colors.grey.01');
			border-color: theme('colors.grey.02');
			/* crit */

			&:before {
				content: none;
			}
			&:after {
				content: none;
			}
        }
    }
    &__text {
    }
}
