body, html {overflow: auto !important;}

.authorization {min-height: 100vh; width: 100%; display: flex; position: relative; color: var(--mt-color-gray-800)}

.authorization .flexbox {display: flex; justify-content: space-between; margin-bottom: 18px; align-items: center;}

.authorization .content {position: relative;}

.authorization .wallpaper {position: relative; flex: 1;}
.authorization .content_wrapper {position: relative; padding: 32px; min-width: 520px; min-height: 100%; flex: 1; max-width: 787px;}


.authorization .logo_wrapper {max-width: 120px; height: 60px; line-height: 60px;}
.authorization .logo_wrapper img {display: inline-block; max-width: 100%; max-height: 60px; vertical-align: middle;}
.authorization .logo_wrapper img[src*='.svg'] {width: 100%; height: 100%; object-fit: contain;}

.authorization .language_switcher  {position: relative}
.authorization .language_switcher .button {background: #fff; border: 1px solid var(--mt-color-gray-300) !important; border-radius: 4px;}
.authorization .language_switcher .mini_modal  {left: -515px;}
.authorization .language_switcher .mini_modal:before {left: 10%;}

.authorization .content {width: 380px; margin: auto; min-height: 66vh; display: flex; align-items: center;}
.authorization .content form {width: 100%;}

.authorization h1 {font-family: 'Inter', sans-serif; font-style: normal; font-weight: bold; font-size: 24px; line-height: 28px; margin-bottom: 20px;}
.authorization h4 {font-size: 16px; font-weight: 400; line-height: 22px;}
.authorization h5 {font-family: 'Inter', sans-serif;  font-size: 13px; font-weight: 500; line-height: 18px;}
.authorization h5 + h5 {margin-top: 8px;}
.authorization p {font-size: 18px; line-height: 27px;}
.authorization p a {text-decoration: underline; color: inherit;}
.authorization p a:hover {text-decoration: none;}

.authorization a:not(.authorization_button) {text-decoration: none; cursor: pointer; color: var(--mt-color-primary-500);}
.authorization a:hover {opacity: 0.8;}
.authorization .label,
.authorization_label {margin: 10px 0;}
.authorization .label div.error {display: none;}
.authorization h1 + .label {margin-top: 40px; transition: margin 0.2s; }
.authorization input[type="text"],
.authorization_label input[type="text"],
.authorization input[type="password"],
.authorization_label input[type="password"] {padding: 13px 12px; border-radius: 6px; color: var(--mt-color-gray-800); border-color: var(--mt-color-gray-400) !important;}
.authorization .input-group input[type="password"],
.authorization_label .input-group input[type="password"] {padding-right: 30px;}

.authorization .input-group .visibility,
.authorization_label .input-group .visibility {left: auto; right: 10px; top: 12px; cursor: pointer; z-index:1; }
.authorization .input-group .visibility svg:nth-child(1),
.authorization_label .input-group .visibility svg:nth-child(1) {display: none;}
.authorization .input-group .visibility svg path,
.authorization_label .input-group .visibility svg path {transition: fill 0.2s;}
.authorization .input-group .visibility:hover svg path,
.authorization_label .input-group .visibility:hover svg path {fill: var(--mt-color-gray-500);}
.authorization .input-group .visibility.active svg:nth-child(2),
.authorization_label .input-group .visibility.active svg:nth-child(2) {display: none;}
.authorization .input-group .visibility.active svg:nth-child(1),
.authorization_label .input-group .visibility.active svg:nth-child(1) {display: block;}

.authorization .checkbox {margin: 0; font-size: 14px; line-height: 20px; color: var(--mt-color-gray-800); max-width: 320px;}
.authorization .checkbox div:not([class]) {border-width: 2px; width: 18px; height: 18px;}
.authorization .checkbox div:before {font-size: 14px; height: 16px; line-height: 14px;}
.authorization .checkbox:not(.active) div:not([class]) {background: #fff;}
.authorization .checkbox input[type="checkbox"] { margin-left: 20px;} 
.authorization .form-group.required .label_header:after {display: none;}
.authorization ::placeholder {color: var(--mt-color-gray-500);}
.authorization .checkbox span a {color: inherit; border-bottom: 1px solid var(--mt-color-gray-400)}
.authorization .checkbox span a:hover {border-color: transparent; }
.authorization .preloader {background: rgba(255,255,255,0.6); left: 0; right: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; top: 0;}


.authorization .password_restore {color: var(--mt-color-primary-500);}
.authorization .password_restore:hover {color: var(--mt-color-primary-400);}
.authorization label.checkbox:hover div {border-color: var(--mt-color-primary-500) !important;}
.authorization label.checkbox div:not([class]):hover {border-color: var(--mt-color-primary-500) !important;}
.authorization label.checkbox div:not([class]):not(.active) {background: transparent;}
.authorization label.checkbox.active div {background: var(--mt-color-primary-500) !important; border-color: var(--mt-color-primary-500) !important;}

.authorization .button.authorization_button {display: block; width: 100%; font-family: 'robotomedium'; font-weight: 500; letter-spacing: 0.1px;font-size: 16px;line-height: 20px; border-radius: 6px; text-align: center; background: var(--auth_button);}
.authorization .button.authorization_button:hover {background: var(--auth_button_hover);}
.authorization .button.authorization_button:active {background: var(--auth_button_active);}
.authorization .button.authorization_button .inlay {padding: 14px 20px;}
.authorization .button.authorization_button.disabled {opacity: 1; background: var(--mt-color-gray-400);}

.auth_navigation {display: inline-block; margin-bottom: 100px; font-size: 16px; line-height: 19px;}
.auth_navigation .i {vertical-align: middle; font-size: 18px; margin-right: 4px; margin-top: -2px; margin-left: -2px; display: inline-block;}

.authorization .stores {display: flex; gap: 10px;}

.authorization_footer {width: 380px; margin: auto;  display: flex; align-items: center; justify-content: center; flex-wrap: wrap; padding: 30px 0 0 0;}
.authorization_footer .feedback_text {color: var(--mt-color-gray-500); font-family: 'robotomedium'; font-size: 13px; font-weight: 500;}
.authorization_footer .feedback_text a {text-decoration: underline; color: inherit;}
.authorization_footer .feedback_text a:hover {text-decoration: none;}

.grecaptcha-badge { visibility: hidden; }

.authorization form.disabled .input-group {pointer-events: none; filter: grayscale(1); opacity: 0.5;}

.authorization .verification_code_fields {display: flex; gap: 16px;}
.authorization .verification_code_fields .limiter_counter {display: none;}
.authorization .verification_code_fields label {margin: 0; min-width: 0;}
.authorization .verification_code_fields label:after {content: ''; display: block; position: absolute; bottom: 0; left:0; width: 100%; height: 2px; border-radius: 4px; background: var(--mt-color-primary-500);}
.authorization .verification_code_fields label.active:after {background: var(--mt-color-gray-400)}
.authorization input.verification_code_field {border: none; height: 57px; font-family: 'Inter', sans-serif; font-size: 28px; font-style: normal; font-weight: 700; line-height: 34px; min-width: 0; color: var(--mt-color-black); text-align: center; padding: 12px 0; max-width: 100%;}
.authorization input.verification_code_field::-webkit-inner-spin-button,
.authorization input.verification_code_field::-webkit-outer-spin-button {-webkit-appearance: none !important; margin: 0 !important;}
.authorization input.verification_code_field {-moz-appearance:textfield !important;}

.oauth_authorization {font-size: 16px; font-weight: 400; line-height: 22px; color: var(--mt-color-black); text-align: center; margin-top: 24px; position: relative}
.oauth_authorization_separator {display: inline-block; position: relative; padding: 0 20px; height: 22px; background: #fff;}
.oauth_authorization_line {content: '';display: block; position: absolute; left: 0; top: 11px; height: 1px; width: 100%; background: var(--mt-color-gray-300);}
.button.oauth_authorization_button {margin-top: 24px; display: block; font-size: inherit; font-weight: 500; letter-spacing: 0.1px; line-height: 20px; font-family: 'robotomedium'; color: var(--mt-color-gray-800) !important; border-radius: 6px; border: 1px solid var(--mt-color-gray-300); background: rgba(0,0,0,0);}
.button.oauth_authorization_button .inlay {padding: 14px 20px; display: flex; align-items: center; justify-content: center; gap: 8px;}
.button.oauth_authorization_button:hover {opacity: 1; background: var(--mt-color-gray-100); border-color: var(--mt-color-gray-100);}
.button.oauth_authorization_button:active {opacity: 1; background: var(--mt-color-gray-300); border-color: var(--mt-color-gray-300);}

@media (max-height: 700px) and (min-width: 901px) {
    .authorization .content_wrapper {padding: 20px 32px;}
    .authorization_footer {padding-top: 15px;}
    .authorization h1 + .label {margin-top: 15px;}
    .authorization .form-group + .form-group,
    .authorization_label + .authorization_label {margin-top: 10px;}
}


@media (max-height: 780px) {
    .authorization .content {min-height: 62vh; padding-top: 10px;}
    .authorization h1 + .label {margin-top: 20px;}
}

@media (max-width: 900px) {
    .authorization {grid-template-columns: 1fr;}
    .authorization .wallpaper {display: none;}
    .authorization .content_wrapper {min-width: 100%;}
    .authorization .content {min-height: 62vh;}
    .authorization .content, .authorization_footer {width: 310px;}

    .authorization .button.authorization_button,
    .button.oauth_authorization_button {font-size: 14px}

    .oauth_authorization,
    .button.oauth_authorization_button {margin-top: 16px;}
}