.common-radio-group.common-radio-buttons {
    display: flex;
    flex-direction: row;

    .common-radio-choice {
        &:extend(.common-button);
        position: relative;

        padding: 0;
        background: var(--pxt-neutral-background2);
        color: var(--pxt-neutral-foreground2);
        border: 1px solid var(--pxt-neutral-stencil1);

        width: 2.5rem;
        height: 2.5rem;
        display: flex;
        align-items: center;

        i {
            width: 100%;
            margin: 0;
        }

        input {
            position: absolute;

            appearance: none;

            width: 100%;
            height: 100%;

            // Old versions of ios safari require the prefix AND manually
            // overriding the border
            -webkit-appearance: none;
            border: none;
        }
    }

    .common-radio-choice.selected {
        background: var(--pxt-neutral-background1);
        color: var(--pxt-primary-background);
    }
}
