.register {
    .wrong-type-link {
        font-size: small;
        font-style: italic;
    }

    dl.preexisting-accounts {
        ul {
            padding-inline-start: 0;
            list-style: none;
        }
    }

    dd {
        position: relative;
    }

    button {
        position: absolute;
        right: 0;
        height: 2.0rem;
        width: 2.5rem;
        max-width: 2rem;
        margin: 0;
    }

    optgroup {
        text-align: left;
    }

    option {
        padding-left: 1rem;

        &.preferred {

        }

        &.enter-new {
            font-style: italic;
            padding-left: 0;
        }
    }

    .action-button-container {
        position: relative;
        width: 100%;
        height: 3rem;
        display: grid;
        justify-items: right;
        align-content: center;
        grid-template-columns: auto auto;

        p {
            padding-right: 3rem;
        }
    }

    .method-container {
        width: 100%;
        display: grid;
        grid-auto-columns: 3fr;
        grid-auto-rows: 1fr;
        grid-template-columns: 1fr 1fr 1fr;
        grid-template-rows: 1fr 1fr;
        gap: 5px 5px;
        grid-template-areas:
            "icon1 icon2 button1"
            "radio1 radio2 button1";
        justify-items: center;

        label {
            text-align: center;
        }

        input {
            max-height: 2ch;
        }

        label.icon1 {
            grid-area: icon1;
        }

        label.icon2 {
            grid-area: icon2;
        }

        input.radio1 {
            grid-area: radio1;
        }

        input.radio2 {
            grid-area: radio2;
        }

        button.button1 {
            grid-area: button1;
            position: relative;
            max-width: unset;
            width: unset;
            height: unset;
        }
    }

    .error-box {
        display: none;
        rgb(50% 0 0 / 1);
    }

    .error-box.show {
        display: block;
    }
}

datalist option.preferred {
    font-weight: bold;
}

#pw-rules {
    padding-inline-start: 1rem;

    .accepted {
        color: green;
    }

    .rejected {
        color: red;
    }
}