
:root {
    --mdc-radio-theme-secondary: #0066c1;
    --mdc-radio-theme-label-color: rgba(0,0,0,0.87);
    --mdc-radio-theme-border-color: rgba(0,0,0,0.54);
    --mdc-radio-theme-disabled-border-color: rgba(0,0,0,0.38);
}

.darkTheme {
    --mdc-radio-theme-secondary: #7199F4;
    --mdc-radio-theme-label-color: #fff;
    --mdc-radio-theme-border-color: rgba(255,255,255,0.54);
    --mdc-radio-theme-disabled-border-color: rgba(255,255,255,0.38);
}


.mdc-radio-label {
    font-size: 14px;
    color: var(--mdc-radio-theme-label-color);
    cursor: pointer;
    vertical-align: middle;
    display: table-cell;
}

.mdc-touch-target-wrapper {
    display: inline;
}

.mdc-radio {
    padding: 10px;
    display: inline-block;
    position: relative;
    flex: 0 0 auto;
    box-sizing: content-box;
    width: 20px;
    height: 20px;
    cursor: pointer;
    /* @alternate */
    will-change: opacity, transform, border-color, color;
}

    .mdc-radio .mdc-radio__native-control:enabled:not(:checked) + .mdc-radio__background .mdc-radio__outer-circle {
        border-color: var(--mdc-radio-theme-border-color);
    }

    .mdc-radio .mdc-radio__native-control:enabled:checked + .mdc-radio__background .mdc-radio__outer-circle {
        border-color: #018786;
        /* @alternate */
        border-color: var(--mdc-radio-theme-secondary, #018786);
    }

    .mdc-radio .mdc-radio__native-control:enabled + .mdc-radio__background .mdc-radio__inner-circle {
        border-color: #018786;
        /* @alternate */
        border-color: var(--mdc-radio-theme-secondary, #018786);
    }

    .mdc-radio [aria-disabled=true] .mdc-radio__native-control:not(:checked) + .mdc-radio__background .mdc-radio__outer-circle,
    .mdc-radio .mdc-radio__native-control:disabled:not(:checked) + .mdc-radio__background .mdc-radio__outer-circle {
        border-color: var(--mdc-radio-theme-disabled-border-color);
    }

    .mdc-radio [aria-disabled=true] .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__outer-circle,
    .mdc-radio .mdc-radio__native-control:disabled:checked + .mdc-radio__background .mdc-radio__outer-circle {
        border-color: var(--mdc-radio-theme-disabled-border-color);
    }

    .mdc-radio [aria-disabled=true] .mdc-radio__native-control + .mdc-radio__background .mdc-radio__inner-circle,
    .mdc-radio .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle {
        border-color: var(--mdc-radio-theme-disabled-border-color);
    }

    .mdc-radio .mdc-radio__background::before {
        background-color: #018786;
        /* @alternate */
        background-color: var(--mdc-radio-theme-secondary, #018786);
    }

    .mdc-radio .mdc-radio__background::before {
        top: -10px;
        left: -10px;
        width: 40px;
        height: 40px;
    }

    .mdc-radio .mdc-radio__native-control {
        top: 0px;
        right: 0px;
        left: 0px;
        width: 40px;
        height: 40px;
    }

.mdc-radio__background {
    display: inline-block;
    position: relative;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
}

    .mdc-radio__background::before {
        position: absolute;
        -webkit-transform: scale(0, 0);
        transform: scale(0, 0);
        border-radius: 50%;
        opacity: 0;
        pointer-events: none;
        content: "";
        transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
        transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
        transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
    }

.mdc-radio__outer-circle {
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border-width: 2px;
    border-style: solid;
    border-radius: 50%;
    transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
}

.mdc-radio__inner-circle {
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
    transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
    transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
    transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1);
}

.mdc-radio__native-control {
    position: absolute;
    margin: 0;
    padding: 0;
    opacity: 0;
    cursor: inherit;
    z-index: 1;
}

.mdc-radio--touch {
    margin-top: 4px;
    margin-bottom: 4px;
    margin-right: 4px;
    margin-left: 4px;
}

    .mdc-radio--touch .mdc-radio__native-control {
        top: -4px;
        right: -4px;
        left: -4px;
        width: 48px;
        height: 48px;
    }

.mdc-radio__native-control:checked + .mdc-radio__background,
.mdc-radio__native-control:disabled + .mdc-radio__background {
    transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
}

    .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__outer-circle,
    .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__outer-circle {
        transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    }

    .mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__inner-circle,
    .mdc-radio__native-control:disabled + .mdc-radio__background .mdc-radio__inner-circle {
        transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
        transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
        transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    }

.mdc-radio--disabled {
    cursor: default;
    pointer-events: none;
}

    .mdc-radio--disabled + .mdc-radio-label {
        opacity: 0.38;
    }

.mdc-radio__native-control:checked + .mdc-radio__background .mdc-radio__inner-circle {
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
}

.mdc-radio__native-control:disabled + .mdc-radio__background,
[aria-disabled=true] .mdc-radio__native-control + .mdc-radio__background {
    cursor: default;
}

.mdc-radio__native-control:focus + .mdc-radio__background::before {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 0.12;
    transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
    transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1);
}

@-webkit-keyframes mdc-ripple-fg-radius-in {
    from {
        -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
        transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
    }

    to {
        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
        transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
    }
}

@keyframes mdc-ripple-fg-radius-in {
    from {
        -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
        transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1);
    }

    to {
        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
        transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
    }
}

@-webkit-keyframes mdc-ripple-fg-opacity-in {
    from {
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        opacity: 0;
    }

    to {
        opacity: var(--mdc-ripple-fg-opacity, 0);
    }
}

@keyframes mdc-ripple-fg-opacity-in {
    from {
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        opacity: 0;
    }

    to {
        opacity: var(--mdc-ripple-fg-opacity, 0);
    }
}

@-webkit-keyframes mdc-ripple-fg-opacity-out {
    from {
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        opacity: var(--mdc-ripple-fg-opacity, 0);
    }

    to {
        opacity: 0;
    }
}

@keyframes mdc-ripple-fg-opacity-out {
    from {
        -webkit-animation-timing-function: linear;
        animation-timing-function: linear;
        opacity: var(--mdc-ripple-fg-opacity, 0);
    }

    to {
        opacity: 0;
    }
}

.mdc-radio {
    --mdc-ripple-fg-size: 0;
    --mdc-ripple-left: 0;
    --mdc-ripple-top: 0;
    --mdc-ripple-fg-scale: 1;
    --mdc-ripple-fg-translate-end: 0;
    --mdc-ripple-fg-translate-start: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

    .mdc-radio .mdc-radio__ripple::before,
    .mdc-radio .mdc-radio__ripple::after {
        position: absolute;
        border-radius: 50%;
        opacity: 0;
        pointer-events: none;
        content: "";
    }

    .mdc-radio .mdc-radio__ripple::before {
        transition: opacity 15ms linear, background-color 15ms linear;
        z-index: 1;
    }

    .mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::before {
        -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1));
        transform: scale(var(--mdc-ripple-fg-scale, 1));
    }

    .mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::after {
        top: 0;
        /* @noflip */
        left: 0;
        -webkit-transform: scale(0);
        transform: scale(0);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }

    .mdc-radio.mdc-ripple-upgraded--unbounded .mdc-radio__ripple::after {
        top: var(--mdc-ripple-top, 0);
        /* @noflip */
        left: var(--mdc-ripple-left, 0);
    }

    .mdc-radio.mdc-ripple-upgraded--foreground-activation .mdc-radio__ripple::after {
        -webkit-animation: mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards;
        animation: mdc-ripple-fg-radius-in 225ms forwards, mdc-ripple-fg-opacity-in 75ms forwards;
    }

    .mdc-radio.mdc-ripple-upgraded--foreground-deactivation .mdc-radio__ripple::after {
        -webkit-animation: mdc-ripple-fg-opacity-out 150ms;
        animation: mdc-ripple-fg-opacity-out 150ms;
        -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
        transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1));
    }

    .mdc-radio .mdc-radio__ripple::before,
    .mdc-radio .mdc-radio__ripple::after {
        top: calc(50% - 50%);
        /* @noflip */
        left: calc(50% - 50%);
        width: 100%;
        height: 100%;
    }

    .mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::before,
    .mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::after {
        top: var(--mdc-ripple-top, calc(50% - 50%));
        /* @noflip */
        left: var(--mdc-ripple-left, calc(50% - 50%));
        width: var(--mdc-ripple-fg-size, 100%);
        height: var(--mdc-ripple-fg-size, 100%);
    }

    .mdc-radio.mdc-ripple-upgraded .mdc-radio__ripple::after {
        width: var(--mdc-ripple-fg-size, 100%);
        height: var(--mdc-ripple-fg-size, 100%);
    }

    .mdc-radio .mdc-radio__ripple::before, .mdc-radio .mdc-radio__ripple::after {
        background-color: #018786;
        /* @alternate */
        background-color: var(--mdc-radio-theme-secondary, #018786);
    }

    .mdc-radio:hover .mdc-radio__ripple::before {
        opacity: 0.04;
    }

    .mdc-radio.mdc-ripple-upgraded--background-focused .mdc-radio__ripple::before, .mdc-radio:not(.mdc-ripple-upgraded):focus .mdc-radio__ripple::before {
        transition-duration: 75ms;
        opacity: 0.12;
    }

    .mdc-radio:not(.mdc-ripple-upgraded) .mdc-radio__ripple::after {
        transition: opacity 150ms linear;
    }

    .mdc-radio:not(.mdc-ripple-upgraded):active .mdc-radio__ripple::after {
        transition-duration: 75ms;
        opacity: 0.12;
    }

    .mdc-radio.mdc-ripple-upgraded {
        --mdc-ripple-fg-opacity: 0.12;
    }

    .mdc-radio.mdc-ripple-upgraded--background-focused .mdc-radio__background::before {
        content: none;
    }

.mdc-radio__ripple {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
