.eControls .eRadioGroup {

    & .k-radio-list-item {
        display: flex;
        align-items: var(--eRadioButtonAlIt, start);
        flex-direction: var(--eCheckBoxDirection, row);
        gap: var(--eCheckBoxGap, 8px);
        border: var(--eRadioGroupBorder, 1px solid var(--gray-300));
        border-radius: var(--radius-xl);
        padding: var(--eRadioGroupP, var(--spacing-xl));
    }

    & .k-list-vertical > .k-radio-list-item:not(:last-child) {
        margin-bottom: var(--eRadioGroupM, var(--spacing-3xl));
    }

    & .k-radio-list-item:has( .k-radio:checked:focus, .k-radio:checked ) {
        border: var(--eRadioGroupBorderCheck, 1px solid var(--brand-600));
    }

    & label {
        display: flex;
        flex-direction: column;
        gap: 2px;
        cursor: pointer;
    }

    & .k-radio {
        border: 1px solid var(--gray-300);
        background-color: transparent;
        margin-top: var(--eRadioGroupElMT, 4px);
    }

        & .k-radio:checked {
            background-color: var(--brand-600) !important;
            border: 1px solid rgba(255, 255, 255, 0.12) !important;
        }

            & .k-radio:checked:focus,
            & .k-radio:focus {
                box-shadow: 0 1px 2px 0 rgba(10, 13, 18, 0.05), 0 -2px 0 0 rgba(10, 13, 18, 0.05) !important;
            }

    & .eRadioWrapper {
        display: flex;
        gap: 4px;
        align-items: center;
        height: 38px;
        margin: 0 8px;
    }
}

.eControls[data-accent="dark"] .eRadioGroup {
    & .rb-title {
        color: var(--gray-700) !important;
    }

    & .rb-sub {
        color: var(--gray-600) !important;
    }
}