/* Estilos de la vista Monitor (SPA). Solo cargan cuando la vista está activa. */
.monbar{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.monbar .monlbl{font-size:11px;text-transform:uppercase;letter-spacing:1px;color:var(--dim)}
.monbar .segs{display:inline-flex;gap:3px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:3px}
.monbar .seg{background:none;border:0;color:var(--dim);font:inherit;font-size:13px;font-weight:600;padding:6px 13px;border-radius:7px;cursor:pointer;display:inline-flex;align-items:center;gap:4px}
.monbar .seg:hover{color:var(--txt)} .monbar .seg.on{background:var(--run);color:#08111f}
.workers{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(215px,1fr))}
.wcard{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:14px 16px}
.wcard .wh{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.wcard .wn{font-weight:600;font-size:14px}
.wip{font-weight:400;font-size:11px;color:var(--run);font-family:ui-monospace,monospace;margin-left:6px;cursor:help}
.err{cursor:default}
.trov{position:fixed;inset:0;background:rgba(1,4,9,.76);z-index:60;display:none;align-items:flex-start;justify-content:center;padding:40px 20px;overflow:auto}
.trov.show{display:flex}
.trbox{background:var(--panel);border:1px solid var(--line);border-radius:12px;max-width:1040px;width:100%;padding:18px 20px;box-shadow:0 12px 40px rgba(0,0,0,.5)}
.trh{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}
.trh h3{margin:0;font-size:14px;font-weight:600}
.trx{background:none;border:0;color:var(--dim);font-size:24px;cursor:pointer;line-height:1}
.trrow{font-size:12px;margin-bottom:6px} .trrow b{color:var(--dim);font-weight:700;margin-right:6px;text-transform:uppercase;font-size:10px}
.trexc{color:var(--fail);font-family:ui-monospace,monospace}
.trmono{font-family:ui-monospace,monospace;color:var(--dim)}
.trpre{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:12px;overflow:auto;max-height:60vh;
  font-family:ui-monospace,monospace;font-size:12px;color:var(--txt);white-space:pre;margin:4px 0 0}
.schwrap{max-height:420px;overflow:auto}
#schq{width:100%;max-width:360px;background:var(--panel2);border:1px solid var(--line);color:var(--txt);
  border-radius:7px;padding:6px 10px;font-size:13px;margin:2px 0 12px}
#schq:focus{outline:none;border-color:var(--run)}
.sched-at{font-family:ui-monospace,monospace;font-weight:700;color:var(--run)}
.sched-in{font-family:ui-monospace,monospace;color:var(--dim);font-size:11px}
.sched-freq{color:var(--dim);font-size:11px}
.schg{border-top:1px solid var(--panel2)} .schg:first-child{border-top:none}
.schg-h{display:flex;align-items:center;gap:8px;cursor:pointer;user-select:none;padding:8px 4px;font-weight:600;font-size:13px}
.schg-h:hover{color:var(--run)}
.schg-h .chev2{color:var(--dim);font-size:10px;width:10px}
.schg-h .n{color:var(--dim);font-weight:600;font-size:11px}
.schg-h .soon{color:var(--run);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
.wcard.pe{border-left:3px solid #f0883e}
tr.pe td:first-child{box-shadow:inset 3px 0 0 #f0883e}
.wcard .big{font-size:30px;font-weight:700;line-height:1;color:var(--run)}
.wcard .big small{font-size:12px;color:var(--dim);font-weight:400}
.wstats{display:flex;gap:14px;margin-top:12px;font-size:12px;color:var(--dim)}
.wstats b{color:var(--txt);font-weight:600}
.load{margin-top:8px;font-size:11px;color:var(--dim);font-family:ui-monospace,monospace}
.args{font-family:ui-monospace,monospace;font-size:11px;color:var(--dim);
  max-width:340px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.w{font-family:ui-monospace,monospace;font-size:12px;color:var(--run)}
.pw{white-space:nowrap} .pw .pwn{color:var(--run);font-family:ui-monospace,monospace;font-size:12px;margin-left:5px}
.elapsed{font-family:ui-monospace,monospace;font-weight:700;color:var(--warn)}
.running-row{animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{background:transparent}50%{background:rgba(88,166,255,.05)}}
.fail-card{border-color:rgba(248,81,73,.4)}
.fail-card h2{color:var(--fail)}
.err{font-family:ui-monospace,monospace;font-size:11px;color:var(--fail);
  max-width:360px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rerun{background:rgba(88,166,255,.15);color:var(--run);border:1px solid rgba(88,166,255,.4);
  border-radius:6px;padding:3px 10px;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap}
.reran{display:inline-block;text-decoration:none;white-space:nowrap;font-size:11px;font-weight:600;
  padding:3px 9px;border-radius:6px;color:var(--ok);border:1px solid rgba(63,185,80,.4);background:rgba(63,185,80,.12)}
.acts{display:flex;align-items:center;gap:7px}
.ibtn{background:none;border:0;padding:0;cursor:pointer;line-height:0;display:inline-flex;transition:transform .1s}
.ibtn svg{width:24px;height:24px;display:block}
.ibtn:hover{transform:scale(1.12)} .ibtn:active{transform:scale(.95)}
.ibtn:disabled{opacity:.4;cursor:default;transform:none}
.rstat{font-size:11px;font-weight:700;white-space:nowrap}
.rstat.ok{color:var(--ok)} .rstat.bad{color:var(--fail)} .rstat.run{color:var(--run)}
.mainw{padding:18px 22px;display:grid;gap:20px;grid-template-columns:minmax(0,1fr);max-width:1600px;margin:0 auto}
.mainw > section{min-width:0}                 /* que las secciones puedan encoger; si no, las tablas anchas desbordan la página */
.mainw table{table-layout:auto}
.mainw h2{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--dim);margin:0 0 10px}
.mainw .card h2, .mainw section > h2{cursor:pointer;user-select:none}
.mainw h2 .chev{display:inline-block;width:12px;color:var(--dim);font-size:10px;transition:transform .15s}
.mainw .collapsed > h2 .chev{transform:rotate(-90deg)}
.mainw .collapsed > :not(h2){display:none !important}
.wcard .wh{flex-wrap:wrap;gap:4px 8px}
.wcard .wn{white-space:nowrap}
/* ---- responsive (móvil / tablet / pc con pantalla chica) — mismo criterio que TV ---- */
@media(max-width:900px){
  /* la clave: las tarjetas pueden encoger dentro de la grilla (como .wc en TV),
     así no se desbordan ni se cortan a la derecha */
  .workers{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}
  .wcard{min-width:0;overflow:hidden}
  .wcard .wh{flex-wrap:wrap;gap:4px 8px}
  .wcard .wstats{gap:10px 14px;flex-wrap:wrap}
  .wcard .load{white-space:normal;overflow-wrap:anywhere}   /* la línea EC2/priv envuelve, no fuerza el ancho */
  .wip{overflow:hidden;text-overflow:ellipsis;max-width:100%}
}
@media(max-width:760px){
  /* móvil: ocultar Args en "ejecutando ahora" (libera espacio para Tarea y el botón
     detener) y truncar el error de "fallidas" a 2 líneas (pinchar abre el traceback). */
  .argcol{display:none}
  .err{max-width:none!important;overflow-wrap:anywhere;white-space:normal;font-size:10.5px;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  /* worker = bandera arriba + número abajo (compacto); estado y botón pegados al contenido
     para que el nombre de la tarea se lleve el ancho y el botón no quede separado */
  .pw,.stcol,.btncol{white-space:nowrap;width:1%}
  .pw{text-align:center} .pw .pwn{display:block;margin:2px 0 0}
}
@media(max-width:640px){
  .mainw{padding:10px 12px;gap:12px}
  .args{max-width:130px}
  .trbox{padding:14px 12px} .trov{padding:20px 10px}
}
@media(max-width:560px){
  .workers{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}  /* minmax(0,..): el mínimo auto crecía con el contenido y desbordaba */
  .wcard{padding:12px 13px}
  .wip{display:none}
  .wcard .big{font-size:24px}
  .wcard .wstats{gap:6px 10px;font-size:11px}
  .wcard .load{font-size:10px}
  .args{max-width:120px}
}
@media(max-width:400px){.workers{grid-template-columns:minmax(0,1fr)}}

/* Maquina degradada (memoria o carga sobre el umbral): la misma condicion que dispara la
   alerta de Teams, para que el panel no la contradiga. */
.wcard.cargada{border-color:var(--warn);box-shadow:inset 0 0 0 1px rgba(210,153,34,.25)}
.badge.sob{background:rgba(210,153,34,.18);color:var(--warn);border:1px solid var(--warn);
  margin-left:6px;font-size:10px}
.wcard .sobmot{color:var(--warn)}