/* Common styles for the auth template views */
.errorMessage {
    text-align: center;
    color: var(--red) !important;
}

.auth-button {
    background-color: var(--mid-red);
    width: 150px;
    border-radius: var(--radius-xlarge);
    border: none;
    height: 40px;
    margin: 1rem 0 0.5rem 0;
    box-shadow: var(--elevation-auth-button);
    cursor: pointer;
}

.auth-button span {
    color: var(--white);
    font-weight: 700;
    font-size: 1.1em;
}

.auth-button:disabled span {
    color: var(--mid-grey);
}

.auth-button:hover {
    background-color: var(--mid-red-light);
    box-shadow: var(--elevation-1);
}

.sub-text,
label {
    color: var(--active-grey);
}

.sub-text {
    align-items: center;
}

.sub-text > span {
    color: var(--white);
    font-size: 1rem;
}