/**
  * Cumtomized styles for User Registration plugin
  * Evommet 2025
  * JBlanco
  */

/* Formularios de registro y login */
#user-registration{
    background:transparent!important;
}


/* Mensajes de formulario de registro y login */
#user-registration .user-registration-message-container{
    font-weight:500!important;
}
#user-registration .user-registration-message-container ul li{
    line-height:1em!important;
}
.user-registration-page .ur-message.user-registration-message ul{
    padding-bottom:0!important;
}

/* Margen inferior de los elementos en losformularios de registro y login*/
body.user-registration-page #user-registration:not(.user-registration-MyAccount) .ur-frontend-form .user-registration-form .ur-form-row .ur-form-grid .user-registration-form-row, 
body.user-registration-page .user-registration:not(.user-registration-MyAccount) .ur-frontend-form .user-registration-form .ur-form-row .ur-form-grid .user-registration-form-row, 
body.user-registration-membership_page_user-registration-login-forms #user-registration:not(.user-registration-MyAccount) .ur-frontend-form .user-registration-form .ur-form-row .ur-form-grid .user-registration-form-row, 
body.user-registration-membership_page_user-registration-login-forms .user-registration:not(.user-registration-MyAccount) .ur-frontend-form .user-registration-form .ur-form-row .ur-form-grid .user-registration-form-row{
	margin-bottom:0!important;
}




/* Formulario de LOGIN ---------------------------------- */
.page-login .ur-frontend-form .user-registration-form .ur-form-row .ur-form-grid > div:not(.user-registration-before-login-btn){
    margin-top:0!important;
}
#user_registration_ajax_login_submit{
    position: relative;
	display: inline-block;
	padding-top: 0.2em !important;
    padding-right: 1.6em !important;
    padding-bottom: 0.2em !important;
    padding-left: 1.6em !important;	    
    font-size: 1.3rem!important;
    font-weight: 600 !important;    
	letter-spacing: 0.03em!important;
	border-radius: 2em!important;
    line-height:2em!important;
	transition: all 300ms ease 0ms!important;
    color: #ffffff !important;
    border-color: var(--main-color)!important;
    background-color: var(--main-color)!important;
}
#user_registration_ajax_login_submit:hover{	
	color: #ffffff !important;
    border-color: var(--main-color-light)!important;
    background-color: var(--main-color-light)!important;
}

.user-registration-form.user-registration-form-login.login .user-registration-register.register a{
    font-weight:500;
    font-size:1rem;
    color:var(--main-color)!important;
}




/* Formulario LOST PASSWORD ---------------------------------- */
.ur-frontend-form.login .ur-lost-password-content-container .ur-lost-password-title{
    font-size:2rem!important;
    line-height:1em!important;
}
.ur-frontend-form.login .ur-lost-password-content-container .ur-lost-password-message{
    font-size:1rem!important;
    line-height:1.2em!important;
    font-weight:500!important;
}
.user-registration-ResetPassword.ur_lost_reset_password .user-registration-form-row.user-registration-form-row--first.form-row.form-row-first{
    padding-bottom:10px!important;
    margin-bottom:0!important;
}
.user-registration-ResetPassword.ur_lost_reset_password .user-registration-form-row.user-registration-form-row--first.form-row.form-row-first label{
    margin:0!important;
    font-size:1rem!important;
    font-weight:500!important;
}
.user-registration-ResetPassword.ur_lost_reset_password .user-registration-Button.button.ur-reset-password-btn{
    position: relative;
	display: inline-block;
	padding-top: 0.2em !important;
    padding-right: 1.6em !important;
    padding-bottom: 0.2em !important;
    padding-left: 1.6em !important;	    
    font-size: 1.3rem!important;
    font-weight: 600 !important;    
	letter-spacing: 0.03em!important;
	border-radius: 2em!important;
    line-height:2em!important;
	transition: all 300ms ease 0ms!important;
    color: #ffffff !important;
    border-color: var(--main-color)!important;
    background-color: var(--main-color)!important;
}
.user-registration-ResetPassword.ur_lost_reset_password .user-registration-Button.button.ur-reset-password-btn:hover{	
	color: #ffffff !important;
    border-color: var(--main-color-light)!important;
    background-color: var(--main-color-light)!important;
}



/* Formulario de REGISTRO ---------------------------------- */
.user-registration-page .user-registration.ur-frontend-form{
    background:#ffffff!important;
}
/* ocultar todos los campos de registro, excepto mail y contraseña */
.user-registration-page .user-registration.ur-frontend-form .ur-form-row:not([data-row-id="0"]) {
    display: none!important;
}



/* Formulario DETALLE DE PERFIL ---------------------------------- */

#user-registration.user-registration-MyAccount{
    margin-top:0!important;
}

/* inputs Radio - en horizontal */
#user-registration .user-registration-MyAccount-content .user-registration-profile-fields ul {
    padding-bottom:0!important;
}
#user-registration .user-registration-MyAccount-content .user-registration-profile-fields .ur-field-item.field-radio ul li{
    display:inline-block;
    padding-right:20px;
}

/* líne separación tipo datos */
#user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-form-row[data-row-id="7"]{
    border-top:1px solid #e9e9e9!important;
    padding-top:20px;
}

/* Etiquetas campos */
#user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-form-row .ur-form-grid label{
    margin-bottom:5px;
}

/* Rows */
#user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-form-row{
    margin-bottom:10px;
}

/* Botón 'Guardar'*/
#user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .user-registration-profile-fields > p{
    margin-top:0!important;
}

/* Campo Email */
#user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-field-item.field-user_email{
    margin-bottom:0;
}

@media (min-width:769px){ 
    /* Row de campo Email */
    #user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-form-row[data-row-id="0"]{
        width:66%;
    } 

    /* Gráfico rosco Profile completion */
    #user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-profile-completion-detail{
        right:100px!important;
        box-shadow:none!important;
    }
    #user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-profile-completion-detail .ur-profile-completion-detail__circular-bar{
        --size:100px!important;
    }
}

/* Título de gráfico rosco Profile completion */
#user-registration .user-registration-MyAccount-content .user-registration-EditProfileForm .ur-profile-completion-detail .ur-profile-completion-detail__title{
    display:none!important;
}

/* Título */
#user-registration .user-registration-MyAccount-content .user-registration-profile-fields > h2{
    display:none!important;
}

/* Mensaje 'Completa tu perfil para...' */
#user-registration.user-registration-MyAccount .user-registration-info{
    position: relative;
    top: 0;
    z-index: 1;
    width: 100%;
    font-size: 1.2rem;
    background-color: var(--main-color);
    color: #ffffff;
    text-align: center;
    font-weight: 500;    
    border-top-left-radius: 16px!important;
    border-top-right-radius: 16px!important;
   
}

/* Pestañas */
#user-registration.user-registration-MyAccount .user-registration-MyAccount-navigation-link a{
    font-size:1.1rem;    
}
#user-registration.user-registration-MyAccount .user-registration-MyAccount-navigation-link a:hover{
    color:var(--main-color-light)!important;
    background: #ffffff!important;
    border-bottom: 3px solid var(--main-color-light)!important;
    cursor:pointer;
}
#user-registration.user-registration-MyAccount .user-registration-MyAccount-navigation-link a span{cursor:pointer;}
#user-registration.user-registration-MyAccount .user-registration-MyAccount-navigation-link.is-active a{
    color:var(--main-color)!important;
    border-color: var(--main-color)!important;
    background: #ffffff!important;
}