<commit_before>@import "../../colors";
@import "../../frameless";

@include responsive-layout (".teacher-registration", ".slide");

html,
body {
    background-color: darken($ui-purple, 8%);
}

.teacher-registration {
    background-color: $ui-purple;

    .demographics-checkbox-is-robot {
        display: none;
    }

    .gender-input,
    .other-input {
        float: right;
        width: 90%;

        .row {
            margin-left: .5rem;
        }
    }

    .username-step,
    .name-step,
    .address-step,
    .email-step {
        .help-block {
            transform: translate(15.5rem, -4rem);
        }
    }

    .demographics-step {
        .gender-input {
            margin-top: -5.5rem;
        }

        .help-block {
            transform: translate(14rem, -4rem);
        }

        .radio {
            margin-right: 2.5rem;
            line-height: 3rem;

            input {
                margin-right: 1rem;
            }
        }
    }

    .phone-step {
        .form-group {
            margin-bottom: 2rem;
        }

        input {
            &[type=checkbox] {
                margin-bottom: 1.25rem;
            }
        }

        .help-block {
            margin-top: .7rem;
        }

        .checkbox-row {
            .help-block {
                margin-top: 0;
            }
        }
    }

    .organization-step {
        .help-block {
            transform: translate(16rem, -4rem);
        }

        .organization-type,
        .url-input {
            p {
                margin: .25rem 0;
                text-align: left;
                color: $ui-dark-gray;
            }
        }

        input {
            &[value="8"] {
                margin: 1rem 0;
            }
        }

        .other-input {
            margin-top: -5.75rem;
        }
    }

    .usescratch-step {
        .form {
            .form-group {
                margin-bottom: 0;

                &.has-error {
                    .textarea {
                        border: 1px solid $ui-orange;
                    }
                }
            }


        }

        .help-block {
            margin-top: .75rem;
        }

        p {
            &.char-count {
                margin-top: 0;
                margin-bottom: 1rem;
                text-align: right;
            }
        }
    }

    .last-step {
        &.slide {
            max-width: 38.75rem;
        }

        .card {
            margin: 1rem 0;
            padding: 1.5rem;
            width: initial;

            h4,
            p {
                text-align: left;
            }

            p {
                margin: 0;
            }
        }
    }
}

@media only screen and (max-width: $mobile - 1) {
    .teacher-registration {
        .demographics-step {
            .radio {
                width: 100%;
                text-align: left;
            }
        }

        .last-step {
            .card {
                margin: 0 auto;
                width: 18.75rem;
            }
        }
    }
}

@media only screen and (max-width: $desktop - 1) {
    .teacher-registration {
        .form {
            text-align: left;
        }

        .username-step,
        .demographics-step,
        .name-step {
            .help-block {
                transform: none;
            }
        }

        .phone-step {
            .checkbox,
            .help-block {
                text-align: left;<commit_msg>style error-step like last-step<commit_after>@import "../../colors";
@import "../../frameless";

@include responsive-layout (".teacher-registration", ".slide");

html,
body {
    background-color: darken($ui-purple, 8%);
}

.teacher-registration {
    background-color: $ui-purple;

    .demographics-checkbox-is-robot {
        display: none;
    }

    .gender-input,
    .other-input {
        float: right;
        width: 90%;

        .row {
            margin-left: .5rem;
        }
    }

    .username-step,
    .name-step,
    .address-step,
    .email-step {
        .help-block {
            transform: translate(15.5rem, -4rem);
        }
    }

    .demographics-step {
        .gender-input {
            margin-top: -5.5rem;
        }

        .help-block {
            transform: translate(14rem, -4rem);
        }

        .radio {
            margin-right: 2.5rem;
            line-height: 3rem;

            input {
                margin-right: 1rem;
            }
        }
    }

    .phone-step {
        .form-group {
            margin-bottom: 2rem;
        }

        input {
            &[type=checkbox] {
                margin-bottom: 1.25rem;
            }
        }

        .help-block {
            margin-top: .7rem;
        }

        .checkbox-row {
            .help-block {
                margin-top: 0;
            }
        }
    }

    .organization-step {
        .help-block {
            transform: translate(16rem, -4rem);
        }

        .organization-type,
        .url-input {
            p {
                margin: .25rem 0;
                text-align: left;
                color: $ui-dark-gray;
            }
        }

        input {
            &[value="8"] {
                margin: 1rem 0;
            }
        }

        .other-input {
            margin-top: -5.75rem;
        }
    }

    .usescratch-step {
        .form {
            .form-group {
                margin-bottom: 0;

                &.has-error {
                    .textarea {
                        border: 1px solid $ui-orange;
                    }
                }
            }


        }

        .help-block {
            margin-top: .75rem;
        }

        p {
            &.char-count {
                margin-top: 0;
                margin-bottom: 1rem;
                text-align: right;
            }
        }
    }

    .last-step,
    .error-step {
        &.slide {
            max-width: 38.75rem;
        }

        .card {
            margin: 1rem 0;
            padding: 1.5rem;
            width: initial;

            h4,
            p {
                text-align: left;
            }

            p {
                margin: 0;
            }
        }
    }
}

@media only screen and (max-width: $mobile - 1) {
    .teacher-registration {
        .demographics-step {
            .radio {
                width: 100%;
                text-align: left;
            }
        }

        .last-step,
        .error-step {
            .card {
                margin: 0 auto;
                width: 18.75rem;
            }
        }
    }
}

@media only screen and (max-width: $desktop - 1) {
    .teacher-registration {
        .form {
            text-align: left;
        }

        .username-step,
        .demographics-step,
        .name-step {
            .help-block {
                transform: none;
            }
        }

        .phone-step {
            .checkbox,
            .help-block {
                text-align: left;
{'fraction_non_alphanumeric': 0.11840968020743302, 'fraction_numerical': 0.017574186113511955, 'mean_word_length': 0.8290305584826133, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3628478', 'n_tokens_mistral': 2204, 'n_tokens_neox': 1994, 'n_words': 352}