/* Reglas que antes viajaban como style="…" o style.cssText: la CSP (style-src 'self') prohíbe los estilos en línea. */

/* ── Pantalla de carga ── */
.mx-carga{position:fixed;inset:0;background:color-mix(in srgb, var(--navy) 94%, transparent);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}
.mx-carga-logo{font-size:48px;font-weight:700;color:var(--text)}
.mx-carga-txt{font-size:16px;color:var(--text-2)}
.mx-carga-pista{width:200px;height:4px;background:var(--navy-4);border-radius:2px;overflow:hidden}
.mx-carga-barra{height:100%;width:0%;background:linear-gradient(90deg,var(--blue),var(--cyan));border-radius:2px;animation:loadAnim 1.5s ease infinite}
.mx-carga-lento{display:none;font-size:12.5px;color:var(--text-3);max-width:360px;text-align:center;line-height:1.6}

/* ── Toasts ── */
.mx-toast-cont{position:fixed;bottom:24px;right:24px;z-index:100000;display:flex;flex-direction:column-reverse;gap:10px;align-items:flex-end;pointer-events:none;max-width:calc(100vw - 48px)}

/* ── Diálogo de confirmación ── */
.mxconf-ov{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:9800;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(6px)}
.mxconf-caja{background:var(--navy-2,#111827);border:1px solid var(--border-2,#2b3d57);border-radius:14px;width:440px;max-width:92vw;animation:fadeUp .18s ease;overflow:hidden}
.mxconf-cab{display:flex;gap:13px;padding:20px 22px 4px}
.mxconf-ico{width:34px;height:34px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:16px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.mxconf-ico--peligro{background:var(--red-bg);color:var(--red-txt)}
.mxconf-ico--info{background:var(--blue-glow);color:var(--blue-txt)}
.mxconf-cuerpo{flex:1;min-width:0;padding-top:2px}
.mxconf-tit{font-size:14.5px;font-weight:700;color:var(--text,#f1f5f9);line-height:1.35}
.mxconf-msg{font-size:13px;color:var(--text-2,#b6c2d4);line-height:1.6;margin-top:7px}
.mxconf-det{font-size:11.5px;color:var(--text-3,#64748b);line-height:1.55;margin-top:7px}
.mxconf-pie{display:flex;justify-content:flex-end;gap:9px;padding:16px 22px 18px}

/* ── Error de conexión ── */
.mx-error-ov{position:fixed;inset:0;background:color-mix(in srgb, var(--navy) 95%, transparent);z-index:9999;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px}
.mx-error-ico{font-size:32px}
.mx-error-tit{font-size:16px;color:var(--text);font-weight:600}
.mx-error-msg{font-size:13px;color:var(--text-2);max-width:400px;text-align:center}
.mx-error-btn{margin-top:8px;padding:10px 24px;background:var(--blue);color:#fff;border:none;border-radius:8px;font-size:14px;cursor:pointer}

/* ── Sesión expirada (renovar) ── */
.mx-relogin-ov{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:99999;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(4px)}
.mx-relogin-caja{background:var(--navy-2,#111827);border:1px solid var(--border-2,#2b3d57);border-radius:16px;max-width:440px;width:92vw;padding:26px 28px;text-align:center;color:var(--text,#f1f5f9);font-family:inherit}
.mx-relogin-ico{font-size:32px}
.mx-relogin-tit{font-size:16px;font-weight:700;margin-top:8px}
.mx-relogin-msg{font-size:13px;color:var(--text-2,#b6c2d4);margin-top:8px;line-height:1.6}
.mx-relogin-msg strong{color:var(--text,#f1f5f9)}
.mx-relogin-err{display:none;font-size:12px;color:var(--red-txt,var(--red,#ef4444));margin-top:10px}
.mx-relogin-botones{display:flex;gap:10px;justify-content:center;margin-top:20px}
.mx-relogin-sec{background:transparent;border:1px solid var(--border-2,#2b3d57);color:var(--text-2,#b6c2d4);border-radius:8px;padding:8px 16px;font-size:13px;cursor:pointer}
.mx-relogin-pri{background:var(--blue,#2563eb);border:1px solid var(--blue,#2563eb);color:#fff;border-radius:8px;padding:8px 18px;font-size:13px;font-weight:600;cursor:pointer}

/* ── Usuario en la cabecera ── */
.uh-caja{display:flex;align-items:center;gap:10px}
.uh-avatar{width:32px;height:32px;border-radius:50%;background:var(--blue);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:14px}
.uh-datos{line-height:1.2}
.uh-nombre{font-size:13px;font-weight:500;color:var(--text)}
.uh-rol{font-size:11px;color:var(--text-3)}
.uh-btn{background:transparent;border:1px solid var(--border);color:var(--text-2);padding:6px 10px;border-radius:6px;font-size:11px;cursor:pointer;margin-left:8px}

/* ── Otros ── */
.logo-sub--app{border-left:1px solid var(--border-2,#2f4156);padding-left:12px;margin-left:2px}
.rp-hint--bloque{display:block;margin-top:10px;font-size:11px}
.rp-field--id{flex:0 0 200px}
.rp-field--1{flex:1}
.rp-field--2{flex:2}

/* Movimiento reducido para la animación de ESTA hoja que no es un indicador de progreso (`.mx-carga-barra` sigue
   girando: es una excepción del bloque global). Repite, sin `!important`, lo que ya hace el bloque global de
   `styles-extra.css`, que gana por estar anclado en `html#mx-raiz`. Acorta la duración, nunca `animation: none`. */
@media (prefers-reduced-motion: reduce) {
  .mxconf-caja { animation-duration: .01ms; animation-delay: 0s; animation-iteration-count: 1; }
}
/* Selector de rol del ingreso (cuentas con varios roles): un botón por rol, uno debajo del otro. */
.mx-relogin-roles{flex-direction:column;align-items:stretch;gap:8px}