/* ═══════════════════════════════════════════════════════════════════
   iFlexo · Pantalla de inicio con clave (Registro de NC y Mis NC)
   Concepto "Hoja de prueba": el acceso se presenta como un pliego de
   prueba de impresión (marcas de corte y de registro). Todo va con el
   prefijo ncg- para no tocar estilos ni clases de las páginas.
   ═══════════════════════════════════════════════════════════════════ */

html.ncg-bloqueado,html.ncg-bloqueado body{overflow:hidden;}
/* Al volver de "+ Registrar nueva NC" con pase válido (js/acceso.js), la pantalla no se muestra. */
html.ncg-con-pase .ncg{display:none;}

.ncg{--ncg-paper:#ffffff;--ncg-ink:#121214;--ncg-ink2:#475467;--ncg-ink3:#8a8f98;--ncg-line:#dde1e7;
  position:fixed;inset:0;z-index:10000;display:grid;grid-template-columns:minmax(0,1fr);justify-items:center;align-items:center;
  padding:72px 24px;overflow-y:auto;background:var(--ncg-paper);color:var(--ncg-ink);
  font-family:'Plus Jakarta Sans',system-ui,-apple-system,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;
  transition:opacity .35s ease,visibility .35s ease;}
.ncg *{box-sizing:border-box;}
/* textura de papel: retícula de puntos muy tenue hacia los bordes */
.ncg::before{content:'';position:fixed;inset:0;pointer-events:none;
  background-image:radial-gradient(rgba(18,18,20,.055) 1px,transparent 1.2px);background-size:24px 24px;
  -webkit-mask-image:radial-gradient(ellipse at center,transparent 28%,#000 75%);mask-image:radial-gradient(ellipse at center,transparent 28%,#000 75%);}
.ncg.ncg-sale{opacity:0;visibility:hidden;}

/* Marcas de corte en las 4 esquinas */
.ncg-corte{position:fixed;width:44px;height:44px;pointer-events:none;}
.ncg-corte::before,.ncg-corte::after{content:'';position:absolute;background:var(--ncg-ink);opacity:.55;}
.ncg-corte::before{width:28px;height:1px;}
.ncg-corte::after{width:1px;height:28px;}
.ncg-c-si{top:28px;left:28px;}.ncg-c-si::before{top:16px;left:0;}.ncg-c-si::after{left:16px;top:0;}
.ncg-c-sd{top:28px;right:28px;}.ncg-c-sd::before{top:16px;right:0;}.ncg-c-sd::after{right:16px;top:0;}
.ncg-c-ii{bottom:28px;left:28px;}.ncg-c-ii::before{bottom:16px;left:0;}.ncg-c-ii::after{left:16px;bottom:0;}
.ncg-c-id{bottom:28px;right:28px;}.ncg-c-id::before{bottom:16px;right:0;}.ncg-c-id::after{right:16px;bottom:0;}
/* Marcas de registro a los lados */
.ncg-registro{position:fixed;top:50%;width:34px;height:34px;margin-top:-17px;opacity:.5;pointer-events:none;}
.ncg-registro.ncg-izq{left:30px;}.ncg-registro.ncg-der{right:30px;}
.ncg-esq{position:fixed;bottom:34px;font-size:9.5px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ncg-ink3);pointer-events:none;}
.ncg-esq.ncg-izq{left:92px;}.ncg-esq.ncg-der{right:92px;}

/* ── Bloque central ───────────────────────────────────────────────── */
.ncg-acceso{position:relative;width:100%;max-width:440px;animation:ncg-entra .7s cubic-bezier(.2,.8,.2,1) both;}
@keyframes ncg-entra{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:none;}}
.ncg-logo{display:block;width:176px;height:auto;margin:0 0 38px;}
.ncg-titulo{margin:0 0 34px;font-size:46px;line-height:1.02;font-weight:800;letter-spacing:-.035em;color:var(--ncg-ink);}
.ncg-form{margin:8px 0 0;}
.ncg-label{display:block;margin:0 0 9px;font-size:12.5px;font-weight:700;letter-spacing:.04em;text-transform:none;color:var(--ncg-ink);}
.ncg-campo{display:flex;align-items:center;gap:12px;height:58px;padding:0 10px 0 18px;background:#fff;border:1px solid var(--ncg-line);border-radius:14px;
  box-shadow:0 1px 2px rgba(18,18,20,.04);transition:border-color .2s,box-shadow .2s;}
.ncg-campo:focus-within{border-color:var(--ncg-ink);box-shadow:0 0 0 4px rgba(18,18,20,.07);}
.ncg-campo > svg{flex:none;color:var(--ncg-ink3);}
.ncg .ncg-campo input{flex:1;min-width:0;width:auto;height:100%;margin:0;padding:0;border:none;border-radius:0;background:none;box-shadow:none;outline:none;
  font:inherit;font-size:16px;letter-spacing:.14em;color:var(--ncg-ink);}
.ncg .ncg-campo input:focus{border:none;box-shadow:none;outline:none;}
.ncg .ncg-campo input::placeholder{letter-spacing:0;color:#a3a9b3;}
.ncg-ojo{display:flex;align-items:center;justify-content:center;flex:none;width:38px;height:38px;padding:0;border:none;background:none;border-radius:10px;color:var(--ncg-ink3);cursor:pointer;}
.ncg-ojo:hover{background:#eef0f3;color:var(--ncg-ink);}
.ncg-ojo:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(18,18,20,.15);}
.ncg-boton{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;height:58px;margin-top:14px;border:none;border-radius:14px;
  background:var(--ncg-ink);color:#fff;font:inherit;font-size:15px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;overflow:hidden;
  box-shadow:0 14px 30px -16px rgba(18,18,20,.55);transition:transform .2s,box-shadow .2s,opacity .2s;}
/* línea de color que recorre la base del botón */
.ncg-boton::after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,#00a0e3 0 25%,#e5007e 25% 50%,#ffe600 50% 75%,#e8601a 75%);
  transform:scaleX(.18);transform-origin:left;transition:transform .45s cubic-bezier(.2,.8,.2,1);}
.ncg-boton:hover{transform:translateY(-1px);box-shadow:0 18px 34px -16px rgba(18,18,20,.6);}
.ncg-boton:hover::after{transform:scaleX(1);}
.ncg-boton svg{transition:transform .2s;}
.ncg-boton:hover svg{transform:translateX(4px);}
.ncg-boton:focus-visible{outline:none;box-shadow:0 0 0 4px rgba(18,18,20,.18);}
.ncg-boton[disabled]{cursor:wait;opacity:.75;transform:none;}
.ncg-boton[disabled]::after{transform:scaleX(1);animation:ncg-carga 1.1s linear infinite;}
@keyframes ncg-carga{from{transform:translateX(-100%) scaleX(1);}to{transform:translateX(100%) scaleX(1);}}
.ncg-error{margin:12px 0 0;font-size:13px;font-weight:600;color:#b42318;}
.ncg-error[hidden]{display:none;}
.ncg-con-error .ncg-campo{border-color:#f04438;box-shadow:0 0 0 4px rgba(240,68,56,.10);animation:ncg-sacude .35s;}
@keyframes ncg-sacude{20%,60%{transform:translateX(-5px);}40%,80%{transform:translateX(5px);}}
.ncg-pie{display:flex;align-items:center;gap:14px;margin:30px 0 0;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--ncg-ink3);white-space:nowrap;}
.ncg-pie span{flex:1;height:1px;background:var(--ncg-line);}

@media(prefers-reduced-motion:reduce){
  .ncg,.ncg-acceso,.ncg-boton,.ncg-boton::after,.ncg-campo{animation:none !important;transition:none !important;}
}
@media(max-width:640px){
  .ncg{padding:64px 26px 72px;}
  .ncg-corte{transform:scale(.75);}
  .ncg-c-si,.ncg-c-sd{top:14px;}.ncg-c-si,.ncg-c-ii{left:14px;}.ncg-c-sd,.ncg-c-id{right:14px;}.ncg-c-ii,.ncg-c-id{bottom:14px;}
  .ncg-registro,.ncg-esq{display:none;}
  .ncg-logo{width:150px;margin-bottom:30px;}
  .ncg-titulo{font-size:36px;}
  .ncg-pie{font-size:9.5px;letter-spacing:.12em;gap:10px;}
}
