/* ===== ScreenMonitor — painel de parede (modules/monitor.js), só admin ===== */
.btn-monitor{background:#0B1E33;color:#fff;border-color:#0B1E33}
.btn-monitor:hover{background:#12304F;border-color:#12304F}
body.monitor-aberto{overflow:hidden}
.mon{position:fixed;inset:0;z-index:1600;background:#0A1526;color:#E7EEF7;font-size:14px;
  --panel:rgba(14,28,48,.86);--line:rgba(120,160,205,.18);--muted:#8FA4BC;--loss:#E5484D;--ok:#2FBF71;--brand:#2F9BE0;
  --display:"Barlow Condensed",system-ui,sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.mon-map{position:absolute;inset:0}
.mon-semmapa{height:100%;display:grid;place-items:center;color:var(--muted)}
/* rótulos e pulsos no mapa */
.mon-lbl{text-shadow:0 1px 2px #000,0 0 6px #000;transform:translateY(24px);letter-spacing:.02em;white-space:nowrap}
.mon-lbl.veic{transform:translateY(22px)}
.mon-pulso{position:absolute;width:var(--tam,64px);height:var(--tam,64px);margin-left:calc(var(--tam,64px) / -2);margin-top:calc(var(--tam,64px) / -2);border-radius:50%;
  border:3px solid var(--cor,#E5484D);opacity:0;animation:monPulso 1.9s ease-out infinite;pointer-events:none}
@keyframes monPulso{0%{transform:scale(.35);opacity:.9}100%{transform:scale(1.35);opacity:0}}
@media (prefers-reduced-motion:reduce){.mon-pulso{animation:none;opacity:.35;transform:scale(.6)}}
.mon-tip{position:relative;padding-right:34px!important;min-width:180px}
.mon-tip .tip-row small{color:#6B7E92;margin-left:4px}
.mon-tip-x{position:absolute;top:4px;right:5px;width:26px;height:26px;border-radius:7px;border:none;background:#EEF2F7;color:#2A3B4D;font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center}
.mon-tip-x:hover{background:#D33A4B;color:#fff}
/* topo */
.mon-top{position:absolute;left:0;right:0;top:0;display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;padding:10px 20px 12px;z-index:5;pointer-events:none;
  background:linear-gradient(180deg,rgba(8,18,32,.96) 0%,rgba(8,18,32,.86) 70%,rgba(8,18,32,0) 100%)}
.mon-top>*{pointer-events:auto}
.mon-brand{display:flex;align-items:baseline;gap:10px}
.mon-brand h1{font:700 34px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;margin:0}
.mon-brand h1 b{color:var(--brand)}
.mon-brand small{color:var(--muted);font-size:13px;white-space:nowrap}
.mon-live{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;font:500 12px var(--mono);color:var(--muted);padding:5px 10px;border:1px solid var(--line);border-radius:99px;background:rgba(10,21,38,.6)}
.mon-live i{width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 0 3px rgba(47,191,113,.2)}
.mon-kpis{order:10;flex:1 1 100%;display:flex;gap:10px;min-width:0;margin-top:2px}
.mon-kpi{flex:1 1 0}
.mon-kpi{display:flex;align-items:center;gap:12px;padding:8px 14px 8px 12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(8px);border-top:3px solid var(--kc,#5C7089)}
.mon-kpi b{font:600 42px/1 var(--display);font-variant-numeric:tabular-nums;color:var(--kc,#E7EEF7);min-width:1.1ch;text-align:right}
.mon-kpi div{display:flex;flex-direction:column;gap:3px;min-width:0}
.mon-kpi span{font-size:12.5px;line-height:1.1;color:#E7EEF7;text-transform:uppercase;letter-spacing:.07em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mon-kpi small{font:500 11.5px var(--mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mon-kpi.onus{--kc:#8FB8E0} .mon-kpi.online{--kc:var(--ok)} .mon-kpi.loss{--kc:var(--loss)} .mon-kpi.gasp{--kc:#F2A83B} .mon-kpi.sem{--kc:#9AA9BC} .mon-kpi.crit{--kc:#FF5E67} .mon-kpi.frota{--kc:#2F9BE0}
.mon-kpi.loss b{text-shadow:0 0 14px rgba(229,72,77,.55)}
.mon-clock{text-align:right;margin-left:auto}
.mon-clock span{font:600 44px/1 var(--display);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.mon-clock small{display:block;font:500 12px var(--mono);color:var(--muted);letter-spacing:.06em}
.mon-btn,.mon-sair{padding:8px 12px;border-radius:9px;border:1px solid var(--line);background:rgba(10,21,38,.7);color:#E7EEF7;font-weight:600;font-size:12px;cursor:pointer;display:inline-flex;gap:7px;align-items:center}
.mon-btn{padding:8px 9px}
.mon-btn:hover,.mon-sair:hover{border-color:var(--brand)}
.mon-sair span{font:500 10.5px var(--mono);opacity:.7}
/* coluna de painéis */
.mon-side{position:absolute;top:166px;right:16px;bottom:16px;width:400px;display:flex;flex-direction:column;gap:12px;z-index:4}
.mon-box{background:var(--panel);border:1px solid var(--line);border-radius:14px;backdrop-filter:blur(10px);display:flex;flex-direction:column;min-height:0;box-shadow:0 12px 40px rgba(0,0,0,.35);max-height:34%}
.mon-box.grow{flex:1 1 0;max-height:none}
.mon-bh{display:flex;align-items:center;gap:10px;padding:11px 14px 9px;border-bottom:1px solid var(--line)}
.mon-bh h2{font:600 16px/1 var(--display);letter-spacing:.06em;text-transform:uppercase;margin:0;white-space:nowrap}
.mon-bh .n{font:600 17px/1 var(--display);color:var(--muted);font-variant-numeric:tabular-nums}
.mon-bh .tag{margin-left:auto;font:500 10.5px var(--mono);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.mon-stripe{width:4px;height:18px;border-radius:2px}
.mon-bb{overflow:auto;padding:6px 8px 8px;scrollbar-width:thin;scrollbar-color:#5C7089 transparent;min-height:56px}
.mon-row{display:grid;gap:3px 10px;padding:8px;border-radius:9px;align-items:center;cursor:pointer}
.mon-row:hover{background:rgba(255,255,255,.05)}
.mon-row + .mon-row{border-top:1px solid rgba(120,160,205,.08)}
.mon-since{font:500 11.5px var(--mono);color:var(--muted);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.mon-since small{display:block;font-size:10px;opacity:.8}
.mon-vazio{padding:18px 12px;text-align:center;color:var(--muted);font-size:13px}
/* alertas */
.mon-row.al{grid-template-columns:8px 1fr auto}
.mon-lv{width:8px;height:34px;border-radius:3px;background:#5C7089}
.mon-lv.critica{background:#FF5E67;box-shadow:0 0 10px rgba(255,94,103,.7)} .mon-lv.alta{background:#F2A83B} .mon-lv.atencao{background:#F5D061} .mon-lv.info{background:var(--ok)}
.mon-row.al .t{font-weight:600;font-size:13px}
.mon-row.al .d{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
/* link loss */
.mon-row.ll{grid-template-columns:auto 1fr auto}
.mon-cto{font:600 15px/1 var(--display);letter-spacing:.04em;padding:6px 7px;border-radius:7px;background:rgba(229,72,77,.18);color:#FFC9CC;min-width:76px;text-align:center}
.mon-cli{font-weight:500;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-transform:uppercase}
.mon-cli small{display:block;font:400 11px var(--mono);color:var(--muted);text-transform:none}
/* link loss RESOLVIDO (SLA): voltou a ficar online e espera confirmação */
.mon-row.ll.ok{background:rgba(47,191,113,.12);box-shadow:inset 3px 0 0 var(--ok);cursor:default;
  grid-template-columns:auto 1fr;grid-template-areas:"cto cli" "tempo conf";row-gap:8px}
.mon-row.ll.ok:hover{background:rgba(47,191,113,.16)}
.mon-row.ll.ok .mon-cto{grid-area:cto} .mon-row.ll.ok .mon-cli{grid-area:cli} .mon-row.ll.ok .mon-since{grid-area:tempo}
.mon-cto.ok{background:rgba(47,191,113,.2);color:#B7F0D0}
.mon-row.ll.ok .mon-cli small{color:#93D9B3}
.mon-since.ok{color:var(--ok);font:700 16px/1 var(--display);letter-spacing:.03em;text-align:left;align-self:center}
.mon-since.ok small{font:500 10px var(--mono);color:#93D9B3;font-weight:500;letter-spacing:0;margin-top:3px}
.mon-since .sig{color:#8FB8E0;opacity:.9}
.mon-confs{grid-area:conf;justify-self:end;display:flex;gap:6px}
.mon-conf{padding:8px 11px;border-radius:9px;border:1px solid transparent;
  font:700 12px/1 system-ui,sans-serif;cursor:pointer;white-space:nowrap;letter-spacing:.02em}
.mon-conf.tec{background:var(--ok);border-color:var(--ok);color:#06281A}
.mon-conf.falso{background:rgba(242,168,59,.16);border-color:#F2A83B;color:#F5C989}
.mon-conf:hover{filter:brightness(1.15)}
.mon-conf:disabled{opacity:.45;cursor:default}
/* frota */
.mon-row.fr{grid-template-columns:auto 1fr auto}
.mon-dot{width:10px;height:10px;border-radius:50%;background:var(--c,#5C7089);box-shadow:0 0 0 3px rgba(255,255,255,.08)}
.mon-veic{font-weight:600;font-size:13px}
.mon-veic small{display:block;font-size:11.5px;color:var(--muted);font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:250px}
.mon-vel{font:600 17px/1 var(--display);font-variant-numeric:tabular-nums;text-align:right}
.mon-vel small{display:block;font:400 10.5px var(--mono);color:var(--muted)}
/* legenda */
.mon-legend{position:absolute;left:16px;bottom:16px;z-index:4;display:flex;flex-direction:column;gap:8px;pointer-events:none}
.mon-lg{display:flex;gap:14px;flex-wrap:wrap;padding:9px 12px;border-radius:10px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(8px);font-size:12px;color:var(--muted)}
.mon-lg i{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:-1px}
.mon-scan{font:500 11.5px var(--mono);color:var(--muted);padding:6px 10px;background:rgba(10,21,38,.65);border-radius:8px;border:1px solid var(--line);align-self:flex-start}
/* controles de zoom do Google mais para cima da legenda */
.mon .gm-bundled-control{margin-bottom:96px!important}
@media(max-width:1500px){ .mon-kpi small{display:none} .mon-kpi b{font-size:36px} .mon-kpi span{font-size:11px} .mon-side{top:150px} }
@media(max-width:1180px){ .mon-kpis{flex-wrap:wrap} .mon-kpi{flex:1 1 30%} .mon-side{width:340px;top:230px} }
@media(max-width:820px){ .mon-kpis{display:none} .mon-side{left:12px;right:12px;width:auto;top:auto;bottom:12px;height:46vh;flex-direction:row} .mon-box{max-height:none;flex:1} .mon-legend{display:none} .mon-brand small,.mon-live{display:none} }
/* linha que acabou de entrar na lista (novo link loss, novo alerta, veículo que apareceu) */
.mon-row.mon-novo{animation:monNovo 4s ease-out}
@keyframes monNovo{0%,60%{background:rgba(229,72,77,.22);box-shadow:inset 3px 0 0 var(--loss)}100%{background:transparent;box-shadow:none}}
.mon-box .mon-bb{overflow-anchor:none}
@media (prefers-reduced-motion:reduce){.mon-row.mon-novo{animation:none;box-shadow:inset 3px 0 0 var(--loss)}}

/* rodada 4: sem classificação manual — a linha verde só espera o sinal normalizar */
.mon-aguarda{display:inline-block;padding:4px 12px;border-radius:999px;background:#FDF3E2;
  color:#8A5A00;font-size:15px;font-weight:800;white-space:nowrap}
