.gform-theme--framework .gfield--type-choice > .ginput_container > .gfield_checkbox,
.gform-theme--framework .gfield--type-choice > .ginput_container > .gfield_radio {
    flex-wrap: wrap;
    flex-direction: row;
    gap: var(--gf-field-choice-gap);
}

.gfield_radio .gfield-choice-input,
.gfield_checkbox .gfield-choice-input {
    clip-path: inset(100%);
    height: 0;
    overflow: hidden;
    position: absolute;
    width: 0;
}

.gfield > .ginput_container > .gfield_radio > .gchoice,
.gfield > .ginput_container > .gfield_checkbox > .gchoice {
    display: flex;
    text-align: center;
    width: 100%;
}

.gfield_radio .gform-field-label,
.gfield_checkbox .gform-field-label {
    --gf-local-font-weight: 500 !important;
    --gf-local-line-height: 1.25 !important;
    --gf-label-space-x-secondary: 0;

    background-color: var(--wp--preset--color--base);
    border: 1px solid var(--wp--preset--color--grey-light);
    border-radius: var(--wp--preset--border-radius--x-small);
    cursor: default;
    padding: var(--wp--preset--spacing--40);
    transition: all 0.125s ease-out;
    transition-property: background-color, border-color, color;
    width: 100%;
}

.gfield_radio .gfield-choice-input:focus + .gform-field-label,
.gfield_radio .gfield-choice-input + .gform-field-label:hover,
.gfield_checkbox .gfield-choice-input:focus + .gform-field-label,
.gfield_checkbox .gfield-choice-input + .gform-field-label:hover {
    border-color: var(--wp--preset--color--grey);
}

.gfield_radio .gfield-choice-input + .gform-field-label:active,
.gfield_checkbox .gfield-choice-input + .gform-field-label:active {
    background-color: var(--wp--preset--color--grey-lighter);
}

.gfield_radio .gfield-choice-input:checked + .gform-field-label,
.gfield_checkbox .gfield-choice-input:checked + .gform-field-label {
    --gf-local-color: var(--wp--preset--color--base);

    background-color: var(--wp--preset--color--grey-darkest);
}

.gfield_radio .gfield-choice-input:checked + .gform-field-label:active,
.gfield_checkbox .gfield-choice-input:checked + .gform-field-label:active {
    background-color: var(--wp--preset--color--grey-darker);
}

@media screen and (min-width: 600px) {
    .gfield_radio > .gchoice,
    .gfield_checkbox > .gchoice {
        max-width: calc((100% - var(--gf-field-choice-gap)) / 2);
    }
}

@media screen and (min-width: 1024px) {
    .gfield_radio > .gchoice,
    .gfield_checkbox > .gchoice {
        max-width: calc((100% - (2 * var(--gf-field-choice-gap))) / 3);
    }

    .gfield_radio > .gchoice {
        max-width: calc((100% - (3 * var(--gf-field-choice-gap))) / 4);
    }
}