/*====================MOVIL====================*/

@media(max-width:701px){

.close-pag{
display:flex !important;
position:fixed !important;
top:20px !important;
right:20px !important;
width:38px !important;
height:38px !important;
align-items:center !important;
justify-content:center !important;
font-size:32px !important;
font-weight:100;
color:#ffffff !important;
text-decoration:none !important;
z-index:999999 !important;
opacity:1 !important;
visibility:visible !important;
}

.internal-header{
display:none !important;
background:none !important;
min-height:0 !important;
height:0 !important;
padding:0 !important;
margin:0 !important;
}

.mobile-header{
display:block;
position:fixed;
top:0;
left:0;
width:100%;
height:auto;
overflow:visible;
background:radial-gradient(circle at top right,#0c2a69 0%,#071320 55%,#03101c 100%);
z-index:9999;
}

.mobile-header-inner{
position:relative;
display:flex;
align-items:center;
justify-content:space-between;
max-width:100%;
padding:10px 18px 0;
}

.mobile-logo{
display:flex;
align-items:center;
text-decoration:none;
}

.mobile-logo-img{
display:block;
width:60%;
height:auto;
}

.mobile-header-text{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:3px;
width:100%;
margin-top:30px;
padding:0;
}

.mobile-page-title{
min-width:0;
font-size:22px;
font-weight:600;
line-height:1.2;
color:#ffffff;
text-align:center;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}

.mobile-menu-btn{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:5px;
width:43px;
height:43px;
padding:0;
border:0;
background:transparent;
cursor:pointer;
}

.mobile-menu-btn span{
display:block;
width:26px;
height:3px;
border-radius:999px;
background:#ffffff;
transition:transform .25s ease,opacity .25s ease;
}

.mobile-menu-btn.open span:nth-child(1){
transform:translateY(8px) rotate(45deg);
}

.mobile-menu-btn.open span:nth-child(2){
opacity:0;
visibility:hidden;
}

.mobile-menu-btn.open span:nth-child(3){
transform:translateY(-8px) rotate(-45deg);
}

.mobile-menu{
position:absolute;
top:69px;
right:-55px;
width:max-content;
height:64px;
background:#f8f8ff;
border-radius:10px 0 0 0;
overflow:hidden;
opacity:0;
visibility:hidden;
z-index:10001;
transition:right .45s ease-out,opacity .25s ease-out;
}

.mobile-menu.show{
right:0;
opacity:1;
visibility:visible;
}

.mobile-language{
padding:4px 3px;
text-align:center;
border-bottom:1px solid rgba(255,255,255,.12);
}

.mobile-language a{
color:#000;
text-decoration:none;
font-weight:600;
}

.mobile-language span{
margin:0 6px;
color:#000;
}

.mobile-home-link{
display:block;
padding:4px 3px;
color:#000;
text-decoration:none;
font-weight:600;
text-align:center;
}

.mobile-home-link:hover{
background:rgba(255,255,255,.08);
}

.register-content{
position:fixed !important;
top:140px !important;
bottom:0 !important;
left:0 !important;
width:100% !important;
margin:0 !important;
padding:20px 0 30px !important;
display:flex !important;
flex-direction:column !important;
justify-content:center !important;
align-items:center !important;
overflow-y:auto !important;
overflow-x:hidden !important;
-webkit-overflow-scrolling:touch !important;
}

.register-form input.valid{
border:2px solid #1B7CFF !important;
}

.register-form input.invalid{
border:2px solid #FF3B30 !important;
}

.register-footer p{
margin:0 !important;
color:#0C2A69 !important;
font-size:14px !important;
text-align:center !important;
}

.register-subtitle{
width:90% !important;
max-width:320px !important;
margin:0 auto 52px !important;
color:#3E5168 !important;
font-size:17px !important;
font-weight:600 !important;
line-height:1.6 !important;
text-align:center !important;
white-space:normal !important;
}

html,
body{
overflow-x:hidden;

}
}

/*====================TABLET====================*/

@media(min-width:702px) and (max-width:900px){

html,
body{
width:100%;
height:100%;
min-height:100vh;
overflow:hidden;
}

body{
display:flex;
flex-direction:column;
}

.internal-header{
position:fixed;
top:0;
left:0;
width:100%;
z-index:1000;
}

.register-content{
position:fixed !important;
top:230px !important;
bottom:0 !important;
left:0 !important;
width:100% !important;
margin:0 !important;
padding:20px 0 !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
background:#F7F9FC !important;
overflow:auto !important;
}

.register-container{
width:88% !important;
max-width:520px !important;
margin:0 auto !important;
padding:0 !important;
text-align:center !important;
}

.register-subtitle{
width:100% !important;
margin:0 0 82px !important;
color:#3E5168 !important;
font-size:17px !important;
font-weight:600 !important;
line-height:1.6 !important;
text-align:center !important;
}

.register-form{
width:100% !important;
display:flex !important;
flex-direction:column !important;
gap:16px !important;
}

#full_name,
#email,
#phone,
#password,
#confirm_password{
display:block !important;
width:100% !important;
height:56px !important;
margin:0 !important;
padding:0 20px !important;
border:1px solid #a8b4c3 !important;
border-radius:12px !important;
background:#ffffff !important;
color:#2f3e4e !important;
font-family:'Poppins',sans-serif !important;
font-size:16px !important;
box-sizing:border-box !important;
outline:none !important;
}

.password-wrapper{
position:relative !important;
width:100% !important;
}

.password-wrapper input{
padding-right:55px !important;
}

.toggle-password{
position:absolute !important;
top:50% !important;
right:18px !important;
width:24px !important;
height:24px !important;
margin:0 !important;
transform:translateY(-50%) !important;
cursor:pointer !important;
}

.forgot-password{
width:100% !important;
margin:-7px 0 0 !important;
text-align:right !important;
}

.forgot-password a{
color:#4B5D73 !important;
font-size:14px !important;
font-weight:500 !important;
text-decoration:none !important;
}

.forgot-password a:hover{
color:#006DFF !important;
}

.password-requirements{
width:100% !important;
margin:-10px 0 0 4px !important;
color:#4b5d73 !important;
font-size:13px !important;
line-height:1.4 !important;
text-align:left !important;
}

.terms-check{
display:flex !important;
align-items:flex-start !important;
gap:12px !important;
width:100% !important;
margin:4px 0 10px !important;
color:#3E5168 !important;
font-size:15px !important;
line-height:1.5 !important;
text-align:left !important;
}

.terms-check input[type="checkbox"]{
width:22px !important;
height:22px !important;
margin-top:2px !important;
flex-shrink:0 !important;
}

.terms-check a{
color:#3da5ff !important;
text-decoration:none !important;
font-weight:500 !important;
}

#loginBtn{
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:100% !important;
max-width:none !important;
height:62px !important;
margin:4px 0 0 !important;
padding:0 !important;
border:0 !important;
border-radius:12px !important;
background:linear-gradient(135deg,#2b8cff,#0a63ff) !important;
color:#ffffff !important;
font-family:'Poppins',sans-serif !important;
font-size:18px !important;
font-weight:600 !important;
box-shadow:0 12px 30px rgba(27,124,255,.30) !important;
cursor:pointer !important;
}

#loginBtn:disabled{
background:#68717d !important;
color:#d5d9de !important;
box-shadow:none !important;
cursor:not-allowed !important;
opacity:1 !important;
}

.login-link{
width:100% !important;
margin:18px 0 0 !important;
padding:0 !important;
color:#3E5168 !important;
font-size:15px !important;
text-align:center !important;
}

.login-link a{
color:#3da5ff !important;
font-weight:600 !important;
text-decoration:none !important;
}

.close-page-x{
display:flex !important;
position:fixed !important;
top:30px !important;
right:30px !important;
width:48px !important;
height:48px !important;
align-items:center !important;
justify-content:center !important;
font-size:42px !important;
font-weight:100 !important;
color:#ffffff !important;
text-decoration:none !important;
z-index:999999 !important;
opacity:1 !important;
visibility:visible !important;
}

.register-footer{
position:relative !important;
width:100% !important;
height:60px !important;
margin:30px 0 0 !important;
padding:0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
background:transparent !important;
color:#0C2A69 !important;
}

.register-footer p{
margin:0 !important;
color:#0C2A69 !important;
font-size:15px !important;
line-height:1.2 !important;
}

.spacer{
width:14%;
}

#full_name.valid,
#email.valid,
#phone.valid,
#password.valid,
#confirm_password.valid{
border:2px solid #1B7CFF !important;
}

#full_name.invalid,
#email.invalid,
#phone.invalid,
#password.invalid,
#confirm_password.invalid{
border:2px solid #FF3B30 !important;
}

.password-requirements.valid{
color:#2E8B57 !important;
}
.password-requirements.invalid{
color:#FF3B30 !important;
}

.register-title{
font-size:24px !important;
line-height:1.2 !important;
}

.step-indicator{
display:inline-block !important;
margin-top:12px !important;
padding:4px 12px !important;
border:1px solid rgba(255,255,255,.35) !important;
border-radius:20px !important;
color:rgba(255,255,255,.82) !important;
font-size:15px !important;
font-weight:600 !important;
line-height:1.2 !important;
visibility:visible !important;
opacity:1 !important;
}

}

/*======================PC======================*/

@media(min-width:901px){

html,
body{
width:100%;
min-height:100%;
overflow-x:hidden;
overflow-y:auto;
scrollbar-width:none;
}

html::-webkit-scrollbar,
body::-webkit-scrollbar{
display:none;
}

body{
display:block;
}

.mobile-header{
display:none !important;
}

/* No tocar visualmente el header */
.internal-header{
position:fixed;
top:0;
left:0;
width:100%;
z-index:1000;
}

/* El main comienza debajo del header y usa flujo normal */
.register-content{
position:relative !important;
top:auto !important;
bottom:auto !important;
left:auto !important;
width:100% !important;
min-height:calc(100vh - 230px) !important;
margin:230px 0 0 !important;
padding:30px 0 0 !important;
box-sizing:border-box !important;
display:flex !important;
flex-direction:column !important;
align-items:center !important;
justify-content:center !important;
background:#F7F9FC !important;
overflow:visible !important;
}

/* Contenedor del formulario */
.register-container{
width:90% !important;
max-width:520px !important;
margin:0 auto !important;
padding:0 !important;
text-align:center !important;
}

/* Subtítulo visible encima del primer input */
.register-subtitle{
display:block !important;
width:100% !important;
margin:0 0 82px !important;
color:#3E5168 !important;
font-size:17px !important;
font-weight:600 !important;
line-height:1.6 !important;
text-align:center !important;
}

/* Formulario */
.register-form{
width:100% !important;
display:flex !important;
flex-direction:column !important;
gap:16px !important;
}

/* Inputs */
.register-form input[type="text"],
.register-form input[type="email"],
.register-form input[type="tel"],
.register-form input[type="password"]{
display:block !important;
width:100% !important;
height:56px !important;
margin:0 !important;
padding:0 20px !important;
border:1px solid #A8B4C3 !important;
border-radius:12px !important;
background:#FFFFFF !important;
color:#2F3E4E !important;
font-family:'Poppins',sans-serif !important;
font-size:16px !important;
box-sizing:border-box !important;
outline:none !important;
}

.register-form input.valid{
border:2px solid #1B7CFF !important;
}

.register-form input.invalid{
border:2px solid #FF3B30 !important;
}

/* Contraseñas */
.password-wrapper{
position:relative !important;
width:100% !important;
}

.password-wrapper input{
padding-right:55px !important;
}

.toggle-password{
position:absolute !important;
top:50% !important;
right:18px !important;
width:24px !important;
height:24px !important;
margin:0 !important;
transform:translateY(-50%) !important;
cursor:pointer !important;
}

.forgot-password{
width:100% !important;
margin:-7px 0 0 !important;
text-align:right !important;
}

.forgot-password a{
color:#4B5D73 !important;
font-size:14px !important;
font-weight:500 !important;
text-decoration:none !important;
}

.forgot-password a:hover{
color:#006DFF !important;
}

/* Textos de validación */
.password-requirements{
width:100% !important;
margin:-10px 0 0 4px !important;
color:#4B5D73 !important;
font-size:13px !important;
line-height:1.4 !important;
text-align:left !important;
}

/* Validacio de texto debajo de los Passwords */
.password-requirements.valid{
color:#2E8B57 !important;
}
.password-requirements.invalid{
color:#FF3B30 !important;
}

/* Eliminar Ojos automaticos de Password */
input[type="password"]::-ms-reveal,
input[type="password"]::-ms-clear{
display:none;
}
input[type="password"]::-webkit-credentials-auto-fill-button{
display:none !important;
visibility:hidden;
pointer-events:none;
}

/* Términos */
.terms-check{
display:flex !important;
align-items:flex-start !important;
gap:12px !important;
width:100% !important;
margin:4px 0 10px !important;
color:#3E5168 !important;
font-size:15px !important;
line-height:1.5 !important;
text-align:left !important;
}

.terms-check input[type="checkbox"]{
width:22px !important;
height:22px !important;
margin-top:2px !important;
flex-shrink:0 !important;
}

.terms-check a{
color:#006DFF !important;
text-decoration:none !important;
font-weight:500 !important;
}

/* Botón */
#loginBtn{
display:flex !important;
align-items:center !important;
justify-content:center !important;
width:100% !important;
max-width:none !important;
height:62px !important;
margin:4px 0 0 !important;
padding:0 !important;
border:0 !important;
border-radius:12px !important;
background:linear-gradient(135deg,#2B8CFF,#0A63FF) !important;
color:#FFFFFF !important;
font-family:'Poppins',sans-serif !important;
font-size:18px !important;
font-weight:600 !important;
box-shadow:0 12px 30px rgba(27,124,255,.30) !important;
cursor:pointer !important;
}

#loginBtn:disabled{
background:#68717D !important;
color:#D5D9DE !important;
box-shadow:none !important;
cursor:not-allowed !important;
opacity:1 !important;
}

/* Enlace de login */
.login-link{
width:100% !important;
margin:18px 0 0 !important;
padding:0 !important;
color:#3E5168 !important;
font-size:15px !important;
text-align:center !important;
}

.login-link a{
color:#006DFF !important;
font-weight:600 !important;
text-decoration:none !important;
}

/* Cruz: se mantiene en el header */
.close-page-x{
display:flex !important;
position:fixed !important;
top:30px !important;
right:30px !important;
width:48px !important;
height:48px !important;
align-items:center !important;
justify-content:center !important;
font-size:42px !important;
font-weight:100 !important;
color:#FFFFFF !important;
text-decoration:none !important;
z-index:999999 !important;
opacity:1 !important;
visibility:visible !important;
}

/* Footer dentro del main y desplazándose con él */
.register-footer{
position:relative !important;
left:auto !important;
bottom:auto !important;
width:100% !important;
height:auto !important;
margin:35px 0 0 !important;
padding:18px 0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
background:#F7F9FC !important;
z-index:auto !important;
}

.register-footer p{
margin:0 !important;
color:#0C2A69 !important;
font-size:15px !important;
line-height:1.2 !important;
text-align:center !important;
}

.spacer{
width:7%;
}

.register-title{
font-size:24px !important;
line-height:1.2 !important;
}

.step-indicator{
display:inline-block !important;
margin-top:12px !important;
padding:4px 12px !important;
border:1px solid rgba(255,255,255,.35) !important;
border-radius:20px !important;
color:rgba(255,255,255,.82) !important;
font-size:15px !important;
font-weight:600 !important;
line-height:1.2 !important;
visibility:visible !important;
opacity:1 !important;
}

}