/* AMRMARKET AUTH — PAGE SCOPED */
/* Do not merge into global amr.css */

/* AMR_AUTH_ISOLATED_V1_BEGIN
   Single /auth/ visual source.
   Balanced composition + functional password eye.
*/

.amr-login-v1 {
    width: 100%;
    min-height: 530px;

    padding: 30px 20px;

    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: center;
}


/* CIRCLE */

.amr-login-v1 .login-form {
    position: relative;

    width: 470px;
    height: 470px;
    min-height: 470px;

    margin: 0 auto;
    padding: 0 60px;

    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 50%;

    background:
        radial-gradient(
            circle at 34% 24%,
            #ffffff 0%,
            #f9fbfd 37%,
            #f3f6f9 72%,
            #edf1f5 100%
        );

    box-shadow:
        -25px -23px 50px rgba(255,255,255,.98),
        23px 27px 50px rgba(87,105,125,.16),
        8px 12px 25px rgba(87,105,125,.07),
        inset 2px 2px 3px rgba(255,255,255,.94),
        inset -2px -2px 5px rgba(133,148,164,.035);

    text-align: center;
}


/* TITLE */

.amr-login-v1 .title-link-block {
    width: 350px;

    margin: 0 auto 34px !important;
    padding: 0;

    display: flex;
    align-items: flex-end;
    justify-content: center;

    gap: 34px;

    box-sizing: border-box;
}

.amr-login-v1 .title-link-block h1 {
    position: relative;

    margin: 0;
    padding: 0 0 12px;

    color: #172536;

    font-size: 24px;
    font-weight: 700;
    line-height: 1;

    text-align: center;
}

.amr-login-v1 .title-link-block h1::after {
    content: "";

    position: absolute;
    left: 50%;
    bottom: 0;

    width: 66px;
    height: 4px;

    border-radius: 8px;

    background: #ff4e0a;

    transform: translateX(-50%);

    box-shadow:
        0 2px 5px rgba(255,78,10,.18);
}

.amr-login-v1 .title-link-block .registr-link {
    margin: 0;
    padding: 0 0 12px;

    color: #929daa;

    font-size: 14px;
    line-height: 1;

    text-decoration: none;
}

.amr-login-v1 .title-link-block .registr-link:hover {
    color: #ff4e0a;
}


/* FIELD */

.amr-login-v1 .amr-login-field {
    position: relative;

    width: 350px;
    height: 58px;

    margin: 0 auto 18px;

    box-sizing: border-box;
}

.amr-login-v1 .amr-login-field input {
    -webkit-appearance: none;
    appearance: none;

    display: block;

    width: 100%;
    height: 58px;

    margin: 0;

    padding:
        0
        60px
        0
        60px;

    box-sizing: border-box;

    border: 0 !important;
    border-radius: 31px !important;

    outline: none !important;

    background: #f3f6fa !important;

    color: #26384a;

    font-size: 14px;
    line-height: 58px;

    text-align: left;

    box-shadow:
        inset 7px 7px 14px rgba(112,130,150,.12),
        inset -8px -8px 16px rgba(255,255,255,.97),
        0 2px 4px rgba(99,117,136,.025);
}

.amr-login-v1 .amr-login-field input:focus {
    background: #f5f8fb !important;

    box-shadow:
        inset 6px 6px 13px rgba(112,130,150,.11),
        inset -8px -8px 16px rgba(255,255,255,.98),
        0 0 0 2px rgba(255,79,10,.045);
}

.amr-login-v1 .amr-login-field input::placeholder {
    color: #8996a4;
    opacity: 1;
}

.amr-login-v1 .amr-login-field input:-webkit-autofill,
.amr-login-v1 .amr-login-field input:-webkit-autofill:hover,
.amr-login-v1 .amr-login-field input:-webkit-autofill:focus {
    -webkit-text-fill-color: #26384a;

    -webkit-box-shadow:
        0 0 0 1000px #f3f6fa inset,
        inset 7px 7px 14px rgba(112,130,150,.12),
        inset -8px -8px 16px rgba(255,255,255,.97);

    caret-color: #26384a;
}

.amr-login-v1 .input-placeholder {
    display: none !important;
}


/* LEFT ICONS */

.amr-login-v1 .amr-login-field__icon {
    top: 0;
    bottom: 0;

    margin: auto 0;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: translateY(14px);

    line-height: 0;
    position: absolute;

    z-index: 3;
    left: 22px;

    width: 22px;
    height: 22px;

    color: #7d8997;

    pointer-events: none;
}

.amr-login-v1 .amr-login-field__icon svg,
.amr-login-v1 .amr-login-eye svg {
    display: block;

    width: 100%;
    height: 100%;

    fill: none;

    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}


/* PASSWORD EYE */

.amr-login-v1 .amr-login-eye {
    top: 0;
    bottom: 0;

    margin: auto 0;

    display: flex;
    align-items: center;
    justify-content: center;

    transform: translateY(16px);

    line-height: 0;
    -webkit-appearance: none;
    appearance: none;

    position: absolute;

    z-index: 5;
    right: 20px;

    width: 26px;
    height: 26px;
    padding: 2px;

    border: 0;
    border-radius: 50%;

    outline: none;

    background: transparent;

    color: #84919f;

    cursor: pointer;

    pointer-events: auto;

    transition:
        color .15s ease,
        background .15s ease,
        transform .15s ease;
}

.amr-login-v1 .amr-login-eye:hover {
    color: #5f6e7d;

    background: rgba(128,145,162,.08);
}

.amr-login-v1 .amr-login-eye:active {
    transform: translateY(16px) scale(.94);
}

.amr-login-v1
.amr-login-eye.is-password-visible
.amr-login-eye__slash {
    opacity: 0;
}


/* VALIDATION */

.amr-login-v1 .amr-login-field .error-text {
    position: absolute;

    left: 24px;
    top: 61px;

    margin: 0;

    font-size: 11px;
}


/* FORGOT */

.amr-login-v1 .link-wr {
    width: 350px;

    margin: -1px auto 18px !important;
    padding: 0 7px 0 0 !important;

    box-sizing: border-box;

    display: flex;
    align-items: center;
    justify-content: flex-end;

    text-align: right !important;
}

.amr-login-v1 .link-wr .lost-password {
    display: inline-block;

    margin: 0;
    padding: 0;

    border: 0 !important;

    color: #8995a3 !important;

    font-size: 12px;
    line-height: 1.2;

    text-decoration: none;
}


/* BUTTON */

.amr-login-v1 .btn-login {
    -webkit-appearance: none;
    appearance: none;

    display: block;

    width: 350px !important;
    height: 54px;

    margin: 0 auto !important;
    padding: 0;

    box-sizing: border-box;

    border: 0 !important;
    border-radius: 29px !important;

    background:
        linear-gradient(
            180deg,
            #ff651f 0%,
            #ff500b 55%,
            #ff4705 100%
        ) !important;

    color: #ffffff !important;

    font-size: 14px;
    font-weight: 700;
    line-height: 54px;

    text-align: center;

    box-shadow:
        0 13px 25px rgba(255,76,6,.28),
        0 5px 10px rgba(255,76,6,.15),
        inset 0 2px 1px rgba(255,255,255,.25),
        inset 0 -2px 3px rgba(203,51,0,.10);

    cursor: pointer;
}


/* MESSAGES */

.amr-login-v1 .error-message,
.amr-login-v1 .success-message {
    width: 350px;

    margin:
        -16px
        auto
        16px;

    box-sizing: border-box;
}


/* HIDE OLD MOBILE LINKS */

.amr-login-v1 .mobile-hidden {
    display: none !important;
}


/* LAPTOP */

@media (min-width: 601px) and (max-width: 1366px) {

    .amr-login-v1 {
        min-height: 490px;

        padding-top: 28px;
        padding-bottom: 28px;
    }

    .amr-login-v1 .login-form {
        width: 430px;
        height: 430px;
        min-height: 430px;

        padding: 0 48px;
    }

    .amr-login-v1 .title-link-block,
    .amr-login-v1 .amr-login-field,
    .amr-login-v1 .link-wr,
    .amr-login-v1 .btn-login,
    .amr-login-v1 .error-message,
    .amr-login-v1 .success-message {
        width: 334px;
    }

    .amr-login-v1 .title-link-block {
        margin-bottom: 30px !important;
    }

    .amr-login-v1 .amr-login-field {
        height: 56px;

        margin-bottom: 16px;
    }

    .amr-login-v1 .amr-login-field input {
        height: 56px;

        line-height: 56px;
    }

    .amr-login-v1 .link-wr {
        margin-bottom: 16px !important;
    }

    .amr-login-v1 .btn-login {
        height: 52px;

        line-height: 52px;
    }
}


/* MOBILE */

@media (max-width: 600px) {

    .amr-login-v1 {
        min-height: 0;

        padding: 28px 16px 38px;
    }

    .amr-login-v1 .login-form {
        width: 100%;
        max-width: 420px;

        height: auto;
        min-height: 0;

        padding: 42px 24px 38px;

        border-radius: 34px;

        box-shadow:
            -10px -10px 26px rgba(255,255,255,.95),
            14px 16px 30px rgba(75,94,116,.13);
    }

    .amr-login-v1 .title-link-block,
    .amr-login-v1 .amr-login-field,
    .amr-login-v1 .link-wr,
    .amr-login-v1 .btn-login,
    .amr-login-v1 .error-message,
    .amr-login-v1 .success-message {
        width: 100%;
    }

    .amr-login-v1 .title-link-block {
        gap: 26px;

        margin-bottom: 30px !important;
    }

    .amr-login-v1 .link-wr {
        justify-content: flex-end;

        padding-right: 4px !important;
    }
}

/* AMR_AUTH_ISOLATED_V1_END */
