/* Minimarket: Entrar y Usuarios D. Solo presentaci?n; recursos locales. */
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario){font-family:'Plus Jakarta Sans',sans-serif;color:#3b2b24;--ih-naranja:#a74725;--ih-tinta:#3b2b24;--ih-borde:#e7dcd3}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) *{box-sizing:border-box;min-width:0}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :is(button,input,select){font:inherit;max-width:100%;min-height:48px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) button{border-radius:14px;white-space:normal;overflow-wrap:anywhere;cursor:pointer;transition:background-color 180ms}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :is(input:not([type=checkbox]),select){background:#fff!important;color:#3b2b24;border:1px solid #e7dcd3!important;border-radius:12px;padding:12px;width:100%}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :is(h1,h2,h3){color:#3b2b24;overflow-wrap:anywhere}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :focus-visible{outline:3px solid #a74725;outline-offset:3px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :is(.btn-cerrar-modal,.btn-login-primario,.persona-primario){background:#a74725!important;color:#fff!important;border:1px solid #a74725!important;min-height:48px;padding:12px 16px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :is(.btn-secundario,.link-login-secundario,.btn-clave-propia,.btn-agregar-usuario,.btn-editar-usuario,.persona-boton,.persona-olvidar){background:#fff!important;color:#85391f!important;border:1px solid #e7dcd3!important;padding:12px}
#pantallaLogin{background-color:#faf8f5!important;overflow-y:auto;overflow-x:hidden;padding:24px 16px calc(24px + env(safe-area-inset-bottom,0px))}
#pantallaLogin .contenedor-login{width:100%;max-width:560px;margin:auto;min-width:0}
#pantallaLogin .encabezado-login{gap:14px;margin-bottom:24px;max-width:100%}
#pantallaLogin .encabezado-login h1{font-size:24px;white-space:normal}
#pantallaLogin .logo-login{flex-shrink:0;background:#f7e9df;color:#85391f;border-radius:16px}
#pantallaLogin .caja-login{width:100%;padding:24px 18px;background:#fff;border:1px solid #e7dcd3;border-radius:18px;box-shadow:none}
#pantallaLogin .caja-input-login{background:#fff;border:1px solid #e7dcd3;border-radius:12px;min-width:0}
#pantallaLogin .caja-input-login input{border:0!important;background:transparent!important}
#pantallaLogin :is(.campo-login label,.sub-saludo-local,.etiqueta-tarjeta-login){color:#76665c}
#pantallaLogin .grilla-usuarios-login{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#pantallaLogin :is(.tarjeta-usuario-login,.tarjeta-local-login){background:#fff;border:1px solid #e7dcd3;border-radius:16px;padding:14px;max-width:100%;min-width:0}
#pantallaLogin .nombre-tarjeta-login{white-space:normal;font-size:16px;overflow-wrap:anywhere}
#pantallaLogin :is(.avatar-saludo-local,.foto-local-login){background:#f7e9df!important;color:#85391f;flex-shrink:0}
#pantallaLogin .teclado-pin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:100%;max-width:320px;margin:16px auto}
#pantallaLogin .teclado-pin button{min-height:56px;background:#faf8f5!important;color:#3b2b24!important;border:1px solid #e7dcd3;font-size:24px}
#pantallaLogin .teclado-pin .tecla-texto{font-size:14px}
#pantallaLogin .puntos-pin{gap:16px;margin:24px auto}
#pantallaLogin .puntos-pin span{border-color:#a74725}
#pantallaLogin .puntos-pin span.lleno{background:#a74725}
#loginPersona{background:transparent;color:#3b2b24}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-marco h2,#gestionPersona.persona-marco h2{font-size:24px;margin:0 0 16px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-marco p,#gestionPersona.persona-marco p{line-height:1.6;color:#76665c;overflow-wrap:anywhere}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-marco button,#gestionPersona.persona-marco button{margin:6px 0;width:100%;text-align:center}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-recordada{border:1px solid #e7dcd3;border-radius:16px;background:#fff;padding:8px 12px;margin:12px 0}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-avatar{display:flex;align-items:center;justify-content:center;flex:0 0 48px;height:48px;border-radius:50%;background:#f7e9df;color:#85391f;font-weight:800}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-datos{display:flex;flex-direction:column;gap:6px;overflow-wrap:anywhere}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-datos strong{font-size:18px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-datos small{font-size:13px;color:#76665c}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-campo{display:block;padding:8px 0;font-size:14px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .persona-campo input{margin-top:8px}
#loginPersona input[type=password]{font-size:26px;letter-spacing:.15em;min-height:60px}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) :is(.persona-interruptor,label:has(>input[type=checkbox])){display:flex;align-items:center;gap:12px;min-height:48px;text-align:left;line-height:1.5;color:#3b2b24!important;padding:8px 0}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) input[type=checkbox]{appearance:none;position:relative;flex:0 0 44px;width:44px!important;height:26px;min-height:26px;margin:0;border:1px solid #76665c;border-radius:20px;background:#fff;cursor:pointer}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) input[type=checkbox]::before{content:'';position:absolute;width:18px;height:18px;top:3px;left:3px;border-radius:50%;background:#76665c;transition:transform 180ms}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) input[type=checkbox]:checked{background:#a74725;border-color:#a74725}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) input[type=checkbox]:checked::before{background:#fff;transform:translateX(18px)}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) input[type=checkbox]:disabled{opacity:.55;cursor:default}
:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .caja{background:#faf8f5;color:#3b2b24;max-width:100%;overflow-x:hidden}
#modalUsuarios .caja{border:1px solid #e7dcd3}
#modalUsuarios :is(.tarjeta-cuenta-propia,.fila-usuario-lista){display:flex;flex-wrap:wrap;gap:12px;background:#fff;border:1px solid #e7dcd3;border-radius:16px;padding:16px;margin-bottom:12px}
#modalUsuarios .tarjeta-lista-usuarios{background:transparent;border:0;overflow:visible}
#modalUsuarios .info-usuario{flex:1 1 140px;overflow-wrap:anywhere}
#modalUsuarios :is(.avatar-usuario-propio,.avatar-usuario-lista){background:#f7e9df!important;color:#85391f;flex-shrink:0}
#modalUsuarios :is(.nombre-usuario-propio,.nombre-rol-usuario-lista){font-size:18px;white-space:normal}
#modalUsuarios :is(.pills-permisos-usuario,.fila-titulo-equipo-usuarios){display:flex;flex-wrap:wrap!important;gap:8px}
#modalUsuarios .pill-permiso-usuario{background:#f7e9df;color:#85391f;border-radius:20px;padding:6px 10px;white-space:normal}
#modalUsuarios .btn-cerrar-sesion{background:#fff;color:#9b3028;border:1px solid #e7dcd3}
#modalEditarPermisos .chip-dia-trabajador{display:flex;align-items:center;flex-direction:column;min-width:48px;min-height:64px;border:1px solid #e7dcd3;border-radius:12px;padding:8px;background:#fff;gap:6px}
#modalEditarPermisos div:has(>.chip-dia-trabajador){flex-wrap:wrap!important}
#modalQrAccesoUsuario :is(canvas,img){max-width:100%;height:auto!important}
#modalQrAccesoUsuario :is(.token-texto-chico,.caja-codigo-primer-ingreso){overflow-wrap:anywhere}
#modalQrAccesoUsuario .caja-codigo-primer-ingreso{font-size:32px;color:#85391f;background:#f7e9df;border-radius:14px}
#gestionPersona{inset:0;background:#faf8f5;border:0;border-radius:0;padding:24px 18px;overflow-y:auto;overflow-x:hidden}
#gestionPersona.persona-marco button.persona-trabajador{background:#fff;color:#3b2b24;border:1px solid #e7dcd3;border-radius:16px;text-align:left;padding:18px;font-weight:700}
@media(min-width:768px){
:is(#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario){align-items:center;padding:24px}
:is(#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) .caja{width:100%;max-width:620px;max-height:90dvh;overflow-y:auto;border-radius:18px;padding:24px}
#gestionPersona{inset:5dvh 0;margin:0 auto;width:calc(100% - 48px);max-width:620px;border:1px solid #e7dcd3;border-radius:18px;padding:24px}
}
@media(prefers-reduced-motion:reduce){:is(#pantallaLogin,#gestionPersona,#modalUsuarios,#modalEditarPermisos,#modalCambiarClave,#modalQrAccesoUsuario) *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
#gestionPersona .persona-trabajador{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
#gestionPersona .persona-trabajador strong{font-size:18px;width:100%}
#gestionPersona .persona-trabajador small{font-size:13px;font-weight:400;width:100%;color:#76665c}
#gestionPersona .persona-insignia{font-size:12px;border-radius:20px;padding:6px 10px;background:#f7e9df;color:#85391f}
#pantallaLogin .puntos-pin.error{animation-duration:180ms}
#loginPersona .persona-elegir.persona-recordada{display:flex;align-items:center;gap:12px;text-align:left;background:#fff;color:#3b2b24;border:1px solid #e7dcd3;padding:16px;margin-bottom:0}
#loginPersona .persona-olvidar{font-size:12px;text-align:right;margin-top:0;border:0!important}
#pantallaLogin.con-foto .encabezado-login h1{color:#fff}
#pantallaLogin.con-foto .encabezado-login span{color:#fff}
#modalUsuarios .caja>div:has(>h3)>span[onclick]{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:48px}
#modalEditarPermisos .dias-horario{flex-wrap:wrap!important}
#pantallaLogin .contenedor-login{padding:0;gap:20px;overflow:visible;flex:none}
/* Stitch fija 16 px con !important: el PIN necesita cifras grandes. */
#loginPersona input[type=password],#pantallaLogin input[inputmode=numeric],#modalCambiarClave input[inputmode=numeric]{font-size:26px!important}
#modalUsuarios .fila-usuario-lista,#pantallaLogin .tarjeta-usuario-login.pendiente{opacity:1!important}
/* Revision de Claude (23-oct): la tarjeta propia ahora es blanca; el nombre y el rol quedaban en blanco. */
#modalUsuarios #nombreTarjetaPropia{color:#3b2b24!important}#modalUsuarios #rolTarjetaPropia{color:#76665c!important}
/* 23-oct (prueba en vivo de Nacho): el aviso del ingreso con correo se veia gris y nadie lo notaba. */
#loginPersona p[role=status]:not(:empty),#gestionPersona p[role=status]:not(:empty){color:#9b2923;font-weight:700;background:#fbeae7;border:1px solid #f0c9c2;border-radius:12px;padding:10px 12px}
