/* =====================================================
   CFDI Fácil - Página de INICIO DE SESIÓN (body.home)
   style.css trae reglas del sistema por dentro (#nav de 200 px a toda
   la altura, #content a lo ancho, logo en blanco) que aquí no aplican:
   se anulan con "html body.home" para ganar especificidad.
   ===================================================== */
html body.home{
    background:linear-gradient(160deg,#eef6e0 0%,#f4f6f9 45%,#e3f2fa 100%) !important;
    min-height:100vh; margin:0; padding:0 16px;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    box-sizing:border-box; font-family:"Segoe UI",Roboto,Arial,sans-serif;
}
html body.home #inicio{
    width:100% !important; max-width:420px !important; min-width:0 !important;
    margin:40px auto 0 !important; padding:32px 28px 24px !important;
    display:flex !important; flex-direction:column; align-items:stretch;
    background:#fff !important; border-radius:16px !important;
    box-shadow:0 10px 30px rgba(15,23,42,.10) !important; border:1px solid #eef0f4 !important;
    box-sizing:border-box !important; overflow:visible !important;
}
/* Logo arriba, centrado y a color */
html body.home .home-menu{
    width:100% !important; float:none !important; display:contents !important;
}
html body.home #inicio a.logo{
    order:1; display:block !important; position:static !important;
    width:190px !important; height:56px !important; margin:0 auto 18px !important;
    background:url("../images/cfdifacil_logo.png") no-repeat center center !important;
    background-size:contain !important; filter:none !important;
}
/* Formulario */
html body.home #inicio #content{
    order:2; width:100% !important; max-width:none !important; min-height:0 !important;
    padding:0 !important; margin:0 !important; float:none !important; display:block !important;
    border:none !important; background:transparent !important; box-shadow:none !important;
}
html body.home #inicio form{ border:none !important; box-shadow:none !important; padding:0 !important; margin:0 !important; background:transparent !important; max-width:none !important; width:auto !important; }
html body.home #inicio fieldset{ border:none !important; margin:0 !important; padding:0 !important; min-width:0; }
html body.home #inicio legend{
    display:block; width:100%; float:none; text-align:center !important;
    font-size:20px !important; font-weight:700 !important; color:#1f2d3d !important;
    margin:0 0 20px !important; padding:0 !important; border:none !important; background:none !important;
}
html body.home #inicio .textfield{ margin:0 0 14px !important; clear:both; float:none !important; display:block !important; }
html body.home #inicio .textfield label{
    display:block !important; width:auto !important; float:none !important; text-align:left !important;
    font-size:13px !important; font-weight:600 !important; color:#5b6674 !important; margin:0 0 6px !important;
}
html body.home #inicio .textfield input{
    display:block !important; width:100% !important; max-width:none !important; box-sizing:border-box !important;
    height:46px !important; padding:0 14px !important; font-size:16px !important; /* 16px: iPhone no hace zoom */
    border:1px solid #d5dae2 !important; border-radius:10px !important; background:#fff !important; color:#2c3e50 !important;
    margin:0 !important; float:none !important; box-shadow:none !important;
}
html body.home #inicio .textfield input:focus{ outline:none !important; border-color:#7DBE0D !important; box-shadow:0 0 0 3px rgba(125,190,13,.2) !important; }
html body.home #inicio .buttons{ margin:20px 0 0 !important; padding:0 !important; text-align:center; float:none !important; display:block !important; }
html body.home #inicio .buttons input[type="submit"]{
    display:block !important; width:100% !important; height:48px !important; margin:0 !important;
    background:#7DBE0D !important; color:#fff !important; border:none !important; border-radius:10px !important;
    font-size:16px !important; font-weight:700 !important; cursor:pointer; box-shadow:none !important; text-shadow:none !important;
}
html body.home #inicio .buttons input[type="submit"]:hover{ background:#5e9209 !important; }
/* Ligas (Inicio | Registrarse | Recuperar Contraseña) abajo del botón */
html body.home #inicio #nav{
    order:3; position:static !important; left:auto !important; top:auto !important;
    width:100% !important; max-width:none !important; min-height:0 !important; height:auto !important;
    float:none !important; display:block !important; overflow:visible !important;
    margin:22px 0 0 !important; padding:16px 0 0 !important; border:none !important; border-top:1px solid #eef0f4 !important;
    background:none !important; box-shadow:none !important; text-align:center !important;
    font-size:0 !important; color:transparent !important; /* esconde los "|" sueltos */
}
html body.home #inicio #nav a{
    display:inline-block !important; float:none !important; width:auto !important;
    font-size:14px !important; color:#157aa8 !important; font-weight:600 !important; text-decoration:none !important;
    padding:6px 10px !important; margin:2px !important; border:none !important; border-radius:8px !important; background:none !important;
}
html body.home #inicio #nav a:hover{ background:#dff1fa !important; }
/* Pie */
html body.home #footer{
    width:100%; max-width:420px; margin:18px auto 30px !important; padding:0 !important;
    text-align:center !important; font-size:12px !important; color:#7b8794 !important; background:none !important;
    min-height:0 !important; position:static !important;
}
html body.home #footer a{ color:#157aa8 !important; display:inline !important; }
html body.home #footer .fb-like{ max-width:100%; overflow:hidden; margin-bottom:8px; }
/* Mensajes de error del login (si los hay) */
html body.home #inicio .error, html body.home #inicio .alertmsg, html body.home #inicio p{ text-align:center; }

@media (max-width:480px){
    html body.home{ justify-content:flex-start; }
    html body.home #inicio{ margin-top:24px !important; padding:24px 18px 18px !important; }
    html body.home #inicio a.logo{ width:160px !important; height:48px !important; }
}

/* Logo oficial nuevo (1-oct) */
html body.home #inicio a.logo{background-image:url("../images/cfdifacil_logo_nuevo.png") !important}

/* 1-oct: ver contraseña, «¿Olvidaste…?», errores y estado «Entrando…» */
html body.home #inicio .cf-pass{ position:relative; }
html body.home #inicio .cf-pass input{ padding-right:48px !important; }
html body.home #inicio .cf-ver-pass{
    position:absolute; right:4px; bottom:3px; width:40px; height:40px; border:none; background:none;
    color:#1E9BD6; cursor:pointer; display:flex; align-items:center; justify-content:center; border-radius:8px; padding:0;
}
html body.home #inicio .cf-ver-pass:hover{ background:#e8f5fb; }
html body.home #inicio .cf-ver-pass .cf-tacha{ display:none; }
html body.home #inicio .cf-ver-pass.on .cf-tacha{ display:inline; }
html body.home #inicio .cf-olvide{ text-align:center; margin:-4px 0 0; }
html body.home #inicio .cf-olvide a{ font-size:13px; color:#157aa8; text-decoration:none; font-weight:600; }
html body.home #inicio .cf-olvide a:hover{ text-decoration:underline; }
html body.home #inicio .error{
    background:#fdecec !important; color:#b42318 !important; border:1px solid #f5c2c0 !important; border-radius:10px !important;
    padding:10px 12px !important; margin:0 0 16px !important; font-size:14px !important; text-align:center !important;
    width:auto !important; float:none !important; display:block !important;
}
html body.home #inicio .textfield input.cf-falta{ border-color:#d93025 !important; box-shadow:0 0 0 3px rgba(217,48,37,.15) !important; }
html body.home #inicio .textfield input::placeholder{ color:#a0a8b3; }
html body.home #inicio .buttons input.cf-cargando{ opacity:.75; cursor:progress; }
/* En el login ya está «¿Olvidaste tu contraseña?»: no repetirlo abajo */
html body.home #inicio:has(.cf-olvide) #nav a[href*="restart_password"]{ display:none !important; }

/* ===== 1-oct: REGISTRO y RECUPERAR CONTRASEÑA (mismas tarjetas que el login) ===== */
html body.home #inicio:has(.cf-reg){ max-width:520px !important; }
html body.home #inicio .cf-reg-intro, html body.home #inicio .cf-reg-nota{
    text-align:center !important; color:#5b6674; font-size:14px; line-height:1.45; margin:-8px 0 18px !important;
}
html body.home #inicio .cf-reg-nota{ margin:-4px 0 12px !important; font-size:13px; }
html body.home #inicio .cf-reg-sec{
    text-align:center; font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#1E9BD6;
    margin:22px 0 12px; padding-bottom:6px; border-bottom:1px solid #eef0f4;
}
html body.home #inicio .cf-req{ color:#d93025; font-weight:700; }
html body.home #inicio small.cf-hint{ display:block; font-size:12px; color:#7b8794; margin-top:5px; line-height:1.35; text-align:left; }
html body.home #inicio .cf-reg-tipo{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:0 0 14px; }
html body.home #inicio .cf-reg-op{
    position:relative; display:block !important; width:auto !important; float:none !important; margin:0 !important; cursor:pointer;
}
html body.home #inicio .cf-reg-op input{ position:absolute; opacity:0; width:1px; height:1px; }
html body.home #inicio .cf-reg-op span{
    display:block; text-align:center; padding:10px 8px; border:1.5px solid #d5dae2; border-radius:10px;
    font-size:14px; font-weight:700; color:#2c3e50; background:#fff; transition:.15s;
}
html body.home #inicio .cf-reg-op span small{ display:block; font-weight:400; font-size:11.5px; color:#7b8794; margin-top:2px; }
html body.home #inicio .cf-reg-op input:checked + span{ border-color:#7DBE0D; background:#f3f9e8; box-shadow:0 0 0 3px rgba(125,190,13,.18); }
html body.home #inicio .cf-reg-op input:focus-visible + span{ outline:2px solid #1E9BD6; outline-offset:2px; }
html body.home #inicio .cf-reg .personafisica{ display:none; }
html body.home #inicio .cf-reg.es-fisica .personafisica{ display:block; }
html body.home #inicio .cf-reg .cf-lbl-fisica{ display:none; }
html body.home #inicio .cf-reg.es-fisica .cf-lbl-fisica{ display:inline; }
html body.home #inicio .cf-reg.es-fisica .cf-lbl-moral{ display:none; }
html body.home #inicio .cf-reg-2col{ display:grid; grid-template-columns:1fr 1fr; gap:0 12px; }
html body.home #inicio .cf-reg-captcha{ display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; margin:0 0 12px; }
html body.home #inicio .cf-reg-capimg img{ display:block; height:44px; width:auto; border:1px solid #d5dae2; border-radius:8px; background:#fff; }
html body.home #inicio .cf-reg-recap{
    display:inline-flex; align-items:center; gap:6px; border:1px solid #cfe7f3; background:#f2f9fd; color:#157aa8;
    font-weight:600; font-size:13px; padding:8px 12px; border-radius:8px; cursor:pointer;
}
html body.home #inicio .cf-reg-recap:disabled{ opacity:.6; cursor:progress; }
html body.home #inicio .cf-reg-ya{ text-align:center; font-size:14px; color:#5b6674; margin:14px 0 0 !important; }
html body.home #inicio .cf-reg-ya a{ color:#157aa8; font-weight:700; text-decoration:none; }
html body.home #inicio .cf-preg{
    text-align:center; font-weight:700; color:#1f2d3d; background:#f2f9fd; border:1px solid #cfe7f3; border-radius:10px;
    padding:12px; margin:0 0 14px; font-size:15px;
}
/* Pantallas de «listo» (registro y contraseña enviada) */
html body.home #inicio .cf-ok{ text-align:center; padding:4px 0; }
html body.home #inicio .cf-ok-ico{
    width:72px; height:72px; border-radius:50%; margin:0 auto 14px; display:flex; align-items:center; justify-content:center;
    background:#f3f9e8; color:#5e9209;
}
html body.home #inicio .cf-ok h2{ font-size:20px !important; font-weight:700 !important; color:#1f2d3d !important; margin:0 0 10px !important; text-align:center !important; }
html body.home #inicio .cf-ok p{ font-size:14px; color:#4a5563; line-height:1.5; margin:0 0 10px; }
html body.home #inicio .cf-ok .cf-ok-nota{ font-size:13px; color:#7b8794; }
html body.home #inicio .cf-btn-verde{
    display:block; margin:18px 0 0; height:48px; line-height:48px; border-radius:10px; background:#7DBE0D; color:#fff !important;
    font-weight:700; font-size:16px; text-decoration:none; text-align:center;
}
html body.home #inicio .cf-btn-verde:hover{ background:#5e9209; }
@media (max-width:420px){
    html body.home #inicio .cf-reg-2col{ grid-template-columns:1fr; }
}
/* borde más oscuro en los campos (1-oct) */
html body.home #inicio .textfield input{ border:1.5px solid #7a8794 !important; }
html body.home #inicio .textfield input:focus{ border-color:#1E9BD6 !important; }
html body.home #inicio .textfield input.cf-falta{ border-color:#d93025 !important; }