/*woocommerce errors - auth pages*/

.raven-form-response {
    margin-top: 0.7rem;
    color: #d9534f;
    font-size: 14px;
    line-height: 1.4;
}

.raven-form-response div {
    margin-bottom: 4px;
}

/*success msg*/
.raven-form-response.success {
    margin-top: .7rem;
    color: #28c76f;
    font-size: 14px;
}





/*errors end*/







/* RESET */
#login-section {
    height: 100vh;
    overflow: hidden;
    font-family: "Inter", sans-serif;
}

/* LEFT SECTION */
.left-section {
    position: relative;
    background: linear-gradient(135deg, #00b34a 0%, #00f07c 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50%;
}

/* SLIDER */
#login-slider {
    width: 90%;
    z-index: 3;
}

#login-slider img {
    max-width: 100%;
}

/* SLIDER DOTS */
.carousel-indicators {
    bottom: -40px;
}

.carousel-indicators [data-bs-target] {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.5);
}

.carousel-indicators .active {
    background-color: #fff;
}

/* TEXT */
.left-custom-text {
    position: absolute;
    bottom: 145px;
    left: 50%;
    transform: translateX(-50%);
    width: 80%;
    text-align: center;
    color: #fff;
    /* font-size: 14px;
    line-height: 22px; */
    z-index: 4;
}

/* ELLIPSES */
.ellipse-1,
.ellipse-2,
.ellipse-3 {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.08);
    z-index: 1;
}

.ellipse-1 {
    width: 600px;
    height: 600px;
    left: -200px;
    top: 100px;
}

.ellipse-2 {
    width: 500px;
    height: 500px;
    right: -200px;
    top: 200px;
}

.ellipse-3 {
    width: 300px;
    height: 300px;
    left: 100px;
    bottom: 150px;
}

/* RIGHT SECTION */
.right-section {
    height: 100%;
    padding: 80px 70px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.right-section .logo-img {
    max-width: 180px;
    margin-bottom: 40px;
}

.right-section .heading {
    text-align: center;
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 30px;
    color: #474747;
    line-height: 1;
}

/* FORM */
.woocommerce-form input {
    height: 48px;
    border-radius: 6px;
    border: 1px solid #ddd;
    padding: 0 15px;
}

.woocommerce-form button {
    background: #28c76f;
    border-radius: 6px;
    height: 48px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    font-family: "Roboto", Sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 18.94px;
    width: 100%;
    margin: 0px 0px 0px 0px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #0CB852;
    border-radius: 5px 5px 5px 5px;
}

.woocommerce-form button:hover {
    opacity: 0.9;
}

/* REMEMBER + FORGOT */
.login-tools {
    display: flex;
    justify-content: space-between;
    font-size: 14px;
}

.login-tools a {
    color: #28c76f;
    text-decoration: none;
}



/*additional*/

/*form fields*/

.woocommerce-auth-forms form p.form-row.form-row-wide {
    display: flex;
    flex-direction: column;
    margin-bottom: 7px;
}

/*form labels*/

.woocommerce-auth-forms form label {
    color: #474747;
    font-family: "Roboto", Sans-serif;
    font-size: 14px;
    font-weight: 600;
    line-height: 19.77px;
    margin-bottom: .5rem;
}

.woocommerce-auth-forms label.remember-me-class {
    font-weight: 400 !important;
    cursor: pointer;
}

.woocommerce-auth-forms form label::after {
    position: relative;
    left: 1px;
    color: #d9534f;
    content: "*";
}

/*link*/

.woocommerce-auth-forms form a {
    color: #0CB852;
    font-size: 14px;
    text-decoration: none;
}

.woocommerce-auth-forms form input {
    outline: none;
    color: #55595c;
    background-color: #FAFAFA;
}

.links_for_auth_redirect a {
    color: #212529;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}

/*remember me*/

.remember-me-class {
    display: flex;
}


.remember-me-input-class {
    height: 17px !important;
    margin-right: 4px;
    border: 1px solid #ddd !important;
    border-radius: 65% !important;
}

/*lost password page*/
.forgot-password-btn-custom {
    color: #fff;
    background: #007f42;
    border: none;
    padding: 16px 7px;
    border-radius: 7px;
    font-weight: 600;
    width: 65% !important;
}

.lost_reset_password p.form-row.form-row-wide {
    display: flex;
    flex-direction: column;
}

.lost_reset_password input {
    height: 45px;
    background-color: #FAFAFA;
    border-style: solid;
    border-color: #E4E3E3;
    border-radius: 5px 5px 5px 5px;
    width: 75%;
    margin-top: 0.5rem;
    padding: 0 15px;
    color: #55595c;
}

/*additional css - bug fixes*/

/*uplift the right section*/
.right-section {
    position: relative;
    z-index: 10;
}


/*forgot password plugin field designing*/

/*heading*/
.right-section legend {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 30px;
    color: #474747;
    line-height: 1;
}

/*text*/

.right-section #lostpasswordform .no-margin label,
.right-section .somfrp-lost-pass-form-text p {
    margin-bottom: 0.5rem;
    font-size: 1rem;
    color: #212529;
    line-height: 1.5;
}

/*new and re-new password field labels*/
.right-section label[for="som_new_user_pass"],
.right-section label[for="som_new_user_pass_again"] {
    margin-bottom: 0.5rem;
    font-size: 1rem;
    color: #212529;
    line-height: 1.5;
}

/*input while entering username*/
.right-section .no-margin input#somfrp_user_info {
    height: 45px;
    background-color: #FAFAFA;
    border-style: solid;
    border-color: #E4E3E3;
    border-radius: 5px 5px 5px 5px;
    width: 100%;
    padding-left: 10px;
    color: #55595c;
    outline: none;
    max-width: 200px;
}

/*submit btn*/

.right-section  .lostpassword-submit button#reset-pass-submit {
    background: #007f42;
    color: #fff;
    border: none;
    /* padding: 10px 27px; */
    padding: 10px 41px;
    border-radius: 7px;
    font-weight: 600;
}

.right-section  .lostpassword-submit button#reset-pass-submit:hover {
    background: #28a745;
}

.right-section input#som_new_user_pass,
.right-section input#som_new_user_pass_again {
    height: 45px;
    background-color: #FAFAFA;
    border-style: solid;
    border-color: #E4E3E3;
    border-radius: 5px 5px 5px 5px;
    padding-left: 10px;
    color: #55595c;
    outline: none;
}

/*full eye*/
.right-section .somfrp-password-wrapper .somfrp-eye-toggle {
    padding-right: 6px;
}

/*error wrapper*/

.right-section #password-lost-form-wrap .som-password-sent-message.som-password-error-message {
    background-color: #28c76f;
    border-color: #28c76f;
}


/*targeting div which has password fields*/

.right-section form.som-pass-strength-form > fieldset > div{
    display: flex;
    gap: 15px;
}

@media (min-width: 500px) {
    /*error wrapper*/

    .right-section #password-lost-form-wrap .som-password-sent-message.som-password-error-message {
        /* width: 50%; */
    }

}

/*plugin field designing end*/


/*login pages - left template fix - below 993px*/

@media (min-width: 1200px){
    .right-section{
        max-width: 500px !important;
        margin: auto;
        padding: 20px;
    }

    #login-section .row > .col-md-7.col-lg-5 {
        width: 50% !important;
    }
}

@media (max-width: 993px){
    #login-section .row > .col-md-7.col-lg-5 {
        width: 50% !important;
        /* max-width: 500px;
        margin-left: auto;
        margin-right: auto; */
    }
}

@media (max-width: 768px){
    #login-section .row > .col-md-7.col-lg-5 {
        max-width: 500px !important;
        margin-left: auto;
        margin-right: auto;
        width: 100% !important;
    }

    .left-section {
        width: 100% !important;
    }

    /*dots*/
    .carousel-indicators {
        bottom: 0;
    }
}

@media (max-width: 600px){
    .right-section {
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 0;
        padding-bottom: 0;
    }
}


/*afterwards css*/
.signup_form_labels{
    font-weight: 400 !important;
    font-size: 1rem !important;
}