﻿.mfp-oauth {
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
    width: 700px;
    aspect-ratio: 5 / 3;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: whitesmoke;
}

.mfp-oauth h1,
.mfp-oauth h3,
.mfp-oauth p,
.mfp-oauth span {
    font-family: 'Mynerve', Arial, Helvetica, sans-serif; 
}

.mfp-oauth-email-successful p,
.mfp-oauth-email-unverified p,
.mfp-oauth-verification-requested p,
.mfp-oauth-reset-password-requested p {
    line-height: 24px;
}

.mfp-oauth .bm-content,
.mfp-oauth-container {
    height: 100%;
}

.mfp-oauth-title {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    height: 50px;
    border-bottom: 1px solid rgba(255, 0, 0, 0.4);
}

.mfp-oauth-body {
    position: relative;
    height: calc(100% - 96px);
    overflow-y: hidden;
}

.mfp-oauth-content {
    z-index: 100;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 100%;
    display: flex;
    pointer-events: auto;
}

.mfp-oauth-email-successful,
.mfp-oauth-email-unverified,
.mfp-oauth-verification-requested,
.mfp-oauth-reset-password-requested {
    width: 100%;
    padding: 20px;
    font-size: large;
    position: relative;
    bottom: -14px;
}

.mfp-oauth-provider,
.mfp-oauth-divider,
.mfp-oauth-email {
    height: 100%;
    justify-items: center;
    align-content: center;
}

.mfp-oauth-provider,
.mfp-oauth-email {
    width: calc((100% - 20px) / 2);
}

.mfp-oauth-provider {
    position: relative;
    text-align: center;
}

.mfp-oauth-divider {
    width: 20px;
    height: 100%;
    padding: 10px 0px;
    text-align: center;
}

.mfp-oauth-divider-line {
    width: 1px;
    background-color: grey;
    height: 48%;
}

.mfp-oauth-email {
    position: relative;
    height: 100%;
    justify-content: center;
}

.mfp-oauth-provider-warning,
.mfp-oauth-email-warning {
    width: 250px;
    position: absolute;
    bottom: 0px;
    text-align: left;
    font-size: medium;
}

.mfp-oauth table {
    width: 100%;
    margin-top: 0.5rem !important;
    table-layout: fixed;
    border-collapse: collapse;
    font-family: 'Mynerve', Arial, Arial, Helvetica, sans-serif;
    font-size: 16px;
}

.mfp-oauth table td,
.mfp-oauth table th {
    position: relative;
    top: 3px;
    height: 24px;
    padding: 0px;
    line-height: 20px;
    overflow: visible;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-bottom: 1px solid lightblue;
}

.oauth-btn,
.login-btn {
    display: flex;
    height: 36px;
    width: 250px;
    padding: 10px 16px;
    gap: 10px;
    border-radius: 4px;
    border: 2px solid whitesmoke;
    align-items: center;
    justify-content: center;
    font-family: 'Mynerve', 'Roboto', sans-serif;
    font-size: 16px;
    font-weight: 500;
    transition: background-color 0.2s, box-shadow 0.2s;
    cursor: pointer;
}

.login-btn {
    background-image: url('/images/white-paper.jpg');
    background-size: cover;
    width: 250px;
    border: 2px solid lightgrey;
    font-size: 16px;
}

.login-btn:hover,
.oauth-btn:hover {
    background-color: #f7f8f8;
    box-shadow: 0 1px 1px rgba(0,0,0,0.1);
}

.login-btn img,
.login-btn i,
.oauth-btn img,
.oauth-btn i {
    height: 20px;
    width: 20px;
}

.login-btn span,
.oauth-btn span {
    position: relative;
    top: 1px;
}

.mfp-oauth-footer {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
}





.mfp-registration {
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-bottom: 0px !important;
    width: 700px;
    aspect-ratio: 5 / 3;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    background-color: whitesmoke;
}

.mfp-registration span,
.mfp-registration label {
    font-size: 18px;
}

.mfp-registration label {
    font-weight: 400;
}

.mfp-registration .bm-content,
.mfp-registration-content-container,

.mfp-profile .bm-content,
.mfp-profile-content-container {
    height: 100%;
}

.mfp-registration table,
.mfp-profile table {
    width: 100%;
    margin-top: 0.5rem !important;
    table-layout: fixed;
    border-collapse: collapse;
    font-family: 'Mynerve', Arial, Arial, Helvetica, sans-serif;
    font-size: 16px;
}

.mfp-registration table td,
.mfp-registration table th,
.mfp-profile table td,
.mfp-profile table th {
    position: relative;
    top: 3px;
    height: 24px;
    padding: 0px;
    line-height: 20px;
    overflow: visible;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-bottom: 1px solid lightblue;
}

.mfp-registration table .mfp-registration-standard-table tr > :first-child,
.mfp-profile table tr > :first-child {
    width: 160px;
}

.mfp-registration table tr > :first-child,
.mfp-profile table tr > :first-child {
    padding-left: 1.5rem !important;
    text-align: left;
}

.mfp-registration table tr > :last-child {
    padding-right: 1.5rem !important;
}

.mfp-registration-step-title,
.mfp-profile-title {
    padding-left: 1.5rem !important;
    padding-right: 1.5rem !important;
    height: 50px;
    border-bottom: 1px solid rgba(255, 0, 0, 0.4);
}

.mfp-registration-subtitle {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    font-size: 22px !important;
}

.mfp-registration-step-body {
    position: relative;
}

.mfp-registration-oauth-options {
    z-index: 100;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    pointer-events: auto;
}

.mfp-registration-step-body,
.mfp-profile-step-body {
    height: calc(100% - 50px - 40px);
    overflow-y: hidden;
}

.mfp-registration-step-body-input,
.mfp-profile-step-body-input {
    width: 300px;
    font-size: 20px;
}

.mfp-registration-warning {
    font-size: 12px;
    color: red;
}

.mfp-password-visibility-icon {
    align-self: center !important;
    padding-top: 4px;
    width: 20px;
    height: 22px;
    line-height: 22px;
    font-size: 16px;
    text-align: right;
    cursor: pointer;
}

.mfp-registration-height-sizing {
    padding: 0px;
    height: 22px;
    font-size: 18px;
}

.mfp-registration-subscription-plan {
    font-size: 20px;
}

.mfp-registration-subscription-plan th,
.mfp-registration-subscription-plan td {
    text-align: center;
}

.mfp-registration-datepicker-label {
    height: 20px;
    color: darkgrey;
}

.mfp-registration-subscription-button {
    width: 60px;
    height: 21px;
    font-size: 18px;
}

.mfp-registration-lifetime-cell {
    border-left: 1px solid dimgrey;
}

.mfp-registration .rz-textbox,
.mfp-registration .rz-textbox:focus,
.mfp-registration .rz-textbox:active,
.mfp-registration .rz-textbox:hover,
.mfp-registration .rz-textbox:focus-visible,
.mfp-registration .rz-dropdown,
.mfp-registration .rz-dropdown .rz-dropdown-label,
.mfp-registration .rz-dropdown:focus,
.mfp-registration .rz-dropdown.rz-state-focus,
.mfp-registration .rz-dropdown:active,
.mfp-registration .rz-calendar,
.mfp-registration .rz-calendar input,
.mfp-registration .rz-inputtext,
.mfp-registration .rz-calendar:hover,
.mfp-registration .rz-calendar:focus-within {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
    outline: none !important;
    overflow: visible;
}

.mfp-login {
    position: relative;
    width: 400px;
    height: 400px;
    background-color: #fdf088;
}

.mfp-login h1,
.mfp-login h3,
.mfp-login span {
    margin: 0px;
    font-family: 'Mynerve';
}

.mfp-login input {
    font-size: 18px;
}

.mfp-login-header,
.mfp-change-password-header,
.mfp-change-email-header {
    background-color: #F6E87A;
    height: 60px;
    padding: 20px 30px 0px 30px;
}

.mfp-login-content,
.mfp-change-password-content,
.mfp-change-email-content {
    padding: 0px 30px 20px 30px;
}

.mfp-login-content .rz-form-field-content,
.mfp-change-password-content .rz-form-field-content {
    margin-top: 0px;
}

.mfp-login-content input,
.mfp-login-content input:focus,
.mfp-login-content input:active,
.mfp-login-content input:hover,
.mfp-login-content input:focus-visible,

.mfp-login-content .rz-textbox,
.mfp-login-content .rz-textbox:focus,
.mfp-login-content .rz-textbox:active,
.mfp-login-content .rz-textbox:hover,
.mfp-login-content .rz-textbox:focus-visible,
.mfp-login-content .rz-textbox:not(:disabled):not(.rz-state-disabled):hover,
.mfp-login-content .rz-textbox:not(:disabled):not(.rz-state-disabled):focus,

.mfp-change-password-content .rz-textbox,
.mfp-change-password-content .rz-textbox:focus,
.mfp-change-password-content .rz-textbox:active,
.mfp-change-password-content .rz-textbox:hover,
.mfp-change-password-content .rz-textbox:focus-visible,
.mfp-change-password-content .rz-textbox:not(:disabled):not(.rz-state-disabled):hover,
.mfp-change-password-content .rz-textbox:not(:disabled):not(.rz-state-disabled):focus,

.mfp-change-email-content .rz-textbox,
.mfp-change-email-content .rz-textbox:focus,
.mfp-change-email-content .rz-textbox:active,
.mfp-change-email-content .rz-textbox:hover,
.mfp-change-email-content .rz-textbox:focus-visible,
.mfp-change-email-content .rz-textbox:not(:disabled):not(.rz-state-disabled):hover,
.mfp-change-email-content .rz-textbox:not(:disabled):not(.rz-state-disabled):focus,

/*.mfp-login-content .rz-form-field-content, 
.mfp-login-content .rz-form-field-content:focus, 
.mfp-login-content .rz-form-field-content:active, 
.mfp-login-content .rz-form-field-content:hover, 
.mfp-login-content .rz-form-field-content:focus-visible*/
.mfp-reset-password-input {
    border: none !important;
    box-shadow: none !important;
    background-color: transparent !important;
    outline: none !important;
    font-family: "Mynerve", Arial, Helvetica, sans-serif;
}

.mfp-profile-updated,
.mfp-scheduler-ticket-stamped {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-20deg);

    pointer-events: none;
    opacity: 0;
    transition: opacity 1s ease-out;
}

.mfp-profile-updated {
    top: 50%;
}

.mfp-scheduler-ticket-stamped {
    z-index: 10;
    width: 300px;
    height: 110px;
    top: 55%;
    text-align: center;
    align-content: center;
}

.mfp-profile-updated.update-success,
.mfp-scheduler-ticket-stamped.show-stamp {
    opacity: 1;
    transition: none;
}

.mfp-profile-updated span {
    font-size: 120px;
}

.mfp-scheduler-ticket-stamped span {
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.75);
    font-size: 40px;
    color: whitesmoke;
}

.mfp-profile-change-email,
.mfp-profile-change-password {
    position: absolute;
    bottom: 3px;
    border: 1px solid dimgrey;
    padding: 0px 5px;
    font-size: 12px !important;
    cursor: pointer;
}