/* Acceso de Cova · estados de la pantalla de entrada (Iris, #1139).
   Hoja APARTE: no toca app.css. Se enlaza DESPUÉS de app.css en lunes/index.html:
   <link rel="stylesheet" href="acceso-estados.css?v=1139">
   Pone, solo con CSS, lo que hacía que la entrada pareciera una página y no una app:
   1) «Comprobando tu cuenta…» con el anillo de carga que gira (estado-cargando).
   2) «No hemos podido comprobar tu cuenta» con su icono (estado-error-reintentar), logo y botón Reintentar amarillo y centrado.
   3) Mensaje de error de la clave como caja con icono de aviso (antes: solo texto rojo).
   4) Aviso «PIN incorrecto» con el icono y el título en rojo (antes: marrón sobre rosa) y el toque duplicado fuera del teclado.
   5) Botón «Entrar» y teclado «enviando» (para cuando Daniela ponga aria-busy="true" al enviar).
   Los iconos son los de iconos/estados/ (ya entregados en estados1087). Contraste mínimo 4,5:1; respeta «reducir movimiento». */

/* ---------- 1 y 2. Comprobando la cuenta / sin cobertura ---------- */
.acc-c:has(>.acc-esp:first-child)::before{content:"";display:block;width:112px;height:51px;margin:0 0 8px;background:url(crm-logo-blanco.png) left center/contain no-repeat}
.acc-esp{display:flex;flex-direction:column;align-items:center;gap:16px;max-width:340px;margin:0 auto;padding:56px 8px 8px;color:#fff;font-size:18px;font-weight:700;line-height:1.4;text-align:center}
.acc-esp::before{content:"";display:block;width:80px;height:80px;background:url(../iconos/estados/estado-cargando.svg) center/contain no-repeat}
@media (prefers-reduced-motion:no-preference){.acc-esp::before{animation:acc-gira 1.1s linear infinite}}
@keyframes acc-gira{to{transform:rotate(360deg)}}
.acc-esp:has(+ [data-act=acc-reint])::before{background-image:url(../iconos/estados/estado-error-reintentar.svg);animation:none}
.acc-c>[data-act=acc-reint]{display:flex;align-items:center;justify-content:center;width:100%;max-width:340px;min-height:56px;margin:20px auto 0;border-radius:14px;background:var(--yel);color:#14213a;font-size:17px;font-weight:800}
.acc-c>[data-act=acc-reint]:hover{background:var(--yel-2)}
.acc-c>[data-act=acc-reint]:focus-visible{outline:3px solid #fff;outline-offset:3px}

/* ---------- 3. Error de la clave ---------- */
.entrar .login-err{display:flex;align-items:flex-start;gap:10px;margin:0;padding:12px 14px;border:1px solid #f3c6c2;border-radius:12px;background:#fde8e6;color:#8c1d17;font-size:15px;font-weight:700;line-height:1.35}
.entrar .login-err::before{content:"";flex:none;width:22px;height:22px;margin-top:-1px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9.5v4'/%3E%3Cpath d='M12 17.2h.01'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.3 3.9L1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0z'/%3E%3Cpath d='M12 9.5v4'/%3E%3Cpath d='M12 17.2h.01'/%3E%3C/svg%3E") center/contain no-repeat}

/* ---------- 4. PIN incorrecto y avisos de la entrada ---------- */
.acc-card .aviso.err{border:1px solid #f3c6c2;color:#8c1d17}
.acc-card .aviso.err b{color:#8c1d17}
.acc-card .aviso.err .i{color:#b3261e}
.acc-card .aviso.err span{color:#8c1d17}
/* el mensaje emergente de la app caía encima de las teclas «borrar» y «OK» a 390 px; en la entrada sube arriba */
body.entrada #toast{bottom:auto;top:max(12px,env(safe-area-inset-top));transform:translate(-50%,-160%)}
body.entrada #toast.on{transform:translate(-50%,0)}

/* ---------- 5. Enviando (aria-busy="true" lo pone app.js al enviar) ---------- */
.acc-card .login .b[aria-busy=true],.acc-card .login .b.cargando{pointer-events:none;opacity:.85}
.acc-card .login .b[aria-busy=true] .i,.acc-card .login .b.cargando .i{display:none}
.acc-card .login .b[aria-busy=true]::before,.acc-card .login .b.cargando::before{content:"";width:20px;height:20px;margin-right:10px;border:3px solid rgba(20,33,58,.25);border-top-color:#14213a;border-radius:50%}
@media (prefers-reduced-motion:no-preference){.acc-card .login .b[aria-busy=true]::before,.acc-card .login .b.cargando::before{animation:acc-gira .8s linear infinite}}
.acc-pin[aria-busy=true] .teclado{opacity:.55;pointer-events:none}
.acc-pin[aria-busy=true] .puntos i{animation:none}
@media (prefers-reduced-motion:no-preference){.acc-pin[aria-busy=true] .puntos i.on{animation:acc-pulso .9s ease-in-out infinite alternate}}
@keyframes acc-pulso{to{opacity:.4}}

/* ---------- Legibilidad ---------- */
.login input::placeholder,.acc-card input::placeholder{color:#5d6b82;opacity:1}
.entrar-c footer,.acc-c footer{font-size:13px}