/* Custom Login Styles */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');

@font-face {
    font-family: 'NotoIKEALatin';
    src: url('fonts/NotoIKEALatin-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'NotoIKEALatinBold';
    src: url('fonts/NotoIKEALatin-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

body.login {
    background: #ffffff !important;
}
.login form .input, .login form input[type="checkbox"], .login input[type="text"] {
    border: 1px solid #000;
}

.login label {
    width: 100%;
}

.login input[type="text"],
.login input[type="password"],
.login .wp-pwd {
    max-width: 300px;
}

.login .button.wp-hide-pw {
    width: 35px;
    height: 2.5rem;
    min-width: 35px;
    min-height: 40px;
    padding: 0 !important;
}

/*
body.login:before {
    content: "";
    position: absolute;
    left: 0;
    background-color: var(--blue);
    top: 0;
    width: 10vw;
    height: 100vh;
    display: block;
}

body.login:after {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    z-index: 1;
    background-position: calc(100% + 250px);
    background-repeat: no-repeat;
    background-size: auto;
    background-image: url(images/img-login.jpg);
    top: 0;
}
*/

.language-switcher {
    display: none;
}

@media (max-width: 980px) {
    body.login:before {
        width: 10px;
    }
}

/* Fondo de la página */
#login_form{
    position: relative;
    display: flex;
    flex-direction: column;
    width: 54%;
    padding-top: 50px;
    margin-top: 30px;
    position: relative;
}

#login_form .pre-register {
    margin-top: 0;
    height: 100%;
}

.login-buttons{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin-bottom: 50px;
}
.login h1 a {
    display: none;
}
#login{
    display: none;
}
#login > h1 {
    margin: .5em 0;
    overflow: hidden;
    height: auto;
    font-size: 14px;
    line-height: 17px;
    text-align: left;
    font-weight: normal;
}

/*#login > h1:before {
    content: "";
    height: 61px;
    display: block;
    margin-bottom: 30px;
    background-image: url(images/ikea.svg) !important;
    background-size: contain;
    background-repeat: no-repeat;
}*/

#login_form:before{
    content: "Página solo para miembros. Entra con tus credenciales de usuario.";
    font-family: 'NotoIKEALatin', sans-serif;
    font-size: 21px;
    font-style: normal;
    font-weight: bold;
    line-height: 24px;
    margin-bottom: 20px;
    display: block;
}

.login #login_error,
.login .message,
.login .success:not(.patternlock) {
    border-left: 4px solid var(--blue);
    padding: 12px;
    margin-left: 0;
    margin-bottom: 20px;
    background-color: #fff;
    box-shadow: none;
}
.login .success.patternlock{
    border-left:none;
}

h1 a {
    background-image: url(images/embajadores-ikea.svg) !important;
    background-repeat: no-repeat !important;
    margin: 0 0 20px 0 !important;
    width: 275px !important;
    background-size: contain !important;
}

#login {
    position: relative;
    margin: 0;
    width: 100%;
    box-sizing: border-box;
}

.login h1 {
    margin: 0 auto;
}

.login h1 a {
    width: 375px !important;
    height: 115px !important;
}

.login form {
    margin-left: 0;
    padding: 0;
    font-weight: normal;
    border: 0;
}

.login label {
    color: var(--gris, #484848);
    font-family: 'NotoIKEALatin', sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: bold;
    line-height: 16px;
    margin-bottom: 7px;

}

.login form input[type="checkbox"] {
    width: 24px;
    height: 24px;
}

.login form input[type="checkbox"]:checked::before {
    margin: -.10rem 0 0 -.12rem;
    width: 24px;
    height: 24px;
}

/* Color de fondo de la barra superior */
.login p#backtoblog a:link,
.login p#backtoblog a:visited {
    color: #17272d;
}

/* Color de enlaces de la barra superior */
.login p#backtoblog a:hover,
.login p#backtoblog a:active {
    color: #17272d;
    text-decoration: underline;
}

/* Efectos de enlaces de la barra superior */
#nav,
#backtoblog {
    text-shadow: rgba(255, 255, 255, 1) 0 0px 0;
    color: #222 !important;
}

.login #nav a {
    color: var(--negro, #111);
    font-family: 'NotoIKEALatin', sans-serif;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 171.429% */
    text-decoration-line: underline;
}

.login #backtoblog a {
    color: #101010 !important;
    font-size: 16px;
    text-decoration: underline;
}

.login #nav,
.login #backtoblog {
    text-shadow: none !important;
    padding: 0 !important;
}
#login form .forgetmenot{
    display: block;
    width: 100%;
    margin-bottom: 50px !important;
}
#wp-submit{
    float: left;
    font-family: 'NotoIKEALatinBold', sans-serif;
}
.login .button {
    background: #f2ce57;
    color: #000000;
    box-shadow: none;
    border: 0;
    text-shadow: none;
    width: auto;
    margin-top: 20px;
    line-height: 45px !important;
    font-size: 16px;
    padding: 5px 50px !important;
    min-width: 300px;
}

.login .button:hover {
    opacity: 0.8;
    box-shadow: none;
    background: #f2ce57 !important;
    color: #000000 !important;
}

a.privacy-policy-link {
    display: none;
}

#backtoblog {
    display: none;
}

div#contenedor-login {
    display: flex;
    flex-direction: initial;
    width: 100%;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
}

.login-form-reg {
    width: 80%;
    padding-top: 1em;
}

.login-form-reg .button {
    color: #fff;
    text-align: center;
    background-color: #000;
}

.login-form-reg .button:hover{
    color: #fff;
    background-color: #333;
}

.button {
    border-radius: 0px !important;
}

.wp-core-ui .button-primary.focus,
.wp-core-ui .button-primary.hover,
.wp-core-ui .button-primary:focus,
.wp-core-ui .button-primary:hover{
    background: var(--yellow);
    border-color: var(--yellow);
    box-shadow: none;
    color: var(--blue);
}

@media (max-width: 1440px) {
    .login-form-img{
        padding: 0 10px 0 70px !important;
    }
    div#contenedor-login {
        padding:0 !important;
    }
}
@media (max-width: 1500px) and (min-width: 1024px) {
    div#contenedor-login {
        padding: 0 !important;
    }
}

@media (max-width: 980px) {
    #login {
        margin: auto;
    }

    body.login:after {
        content: "";
        width: 280px;
        height: 280px;
        top: 0;
        background-size: cover;
        background-position: center;
        right: 0;
        background-position-x: 90px;
        background-repeat: no-repeat;
    }
}







.pattern {
    border: 1px solid var(--black);
    border-radius: 5px;
    margin-bottom: 20px;
}



.pre-register {
    display: none;
}


/* LOGIN POPUP */

.pre-register {
    position: absolute;
    top: 0;
    left: 0;
    background-color: var(--yellow);
    width: 100%;
    height: calc(100% - 15px);
    justify-content: center;
    align-items: center;
    padding: 30px;
    margin-top: 3px;
    border-radius: 5px;
}

.pre-register h2.hej {
    margin-bottom: 30px;
}

.pre-register h2 {
    font-size: 25px;
    margin-bottom: 20px;
}

.pre-register p {
    font-size: 20px;
    line-height: 35px;
    margin-bottom: 30px;
}

.pre-register .btn-go {
    position: absolute;
    bottom: 30px;
    right: 30px;
    font-size: 18px;
    font-weight: bold;
    color: var(--black);
    display: flex;
    align-content: center;
    align-items: center;
}

.pre-register .btn-go span {
    width: 35px;
    height: 35px;
    background-color: var(--black);
    border-radius: 50%;
    color: var(--white);
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin-left: 8px;
}

.pre-register .btn-go span .icon {
    width: 20px;
    height: 20px;
    fill: var(--white   );
}

.close-pre-register  {
    position: absolute;
    top: 30px;
    right: 30px;
}


.close-pre-register:hover  {
    cursor: pointer;
}

.close-pre-register .icon {
    width: 20px;
    height: 20px;
    fill: var(--black);
}