/* NORCOM NOC / Visão Geral CPU — v6.1
   Layout plano, leitura SNMP real e estados explícitos. */
#dashboard .dashboard-cpu-headline{
 display:flex;align-items:center;gap:8px;min-height:32px;
 margin:-4px 0 10px;padding:2px 0 5px;
 font-size:10px;line-height:1.5;color:#a3c3d0;font-weight:650;
}
#dashboard .dashboard-cpu-headline::before{
 content:"";display:block;flex:none;width:7px;height:7px;border-radius:50%;
 background:#64e6b7;box-shadow:0 0 0 4px #64e6b716;
}
#dashboard .dashboard-cpu-headline[data-level="warning"]::before{background:#f8c982;box-shadow:0 0 0 4px #f8c9821d}
#dashboard .dashboard-cpu-headline[data-level="critical"]::before{background:#ff8993;box-shadow:0 0 0 4px #ff89931d}
#dashboard .dashboard-cpu-headline[data-level="unavailable"]::before{background:#849bad;box-shadow:none}
#dashboard .device-card{
 grid-template-columns:minmax(205px,1.2fr) minmax(245px,1.05fr) minmax(145px,.73fr);
 gap:16px;padding:15px 19px;min-height:88px;
}
#dashboard .device-card .resources{
 display:grid;grid-template-columns:minmax(120px,1.25fr) minmax(85px,.65fr);
 gap:16px;align-items:center;width:100%;min-width:0;margin:0;
}
#dashboard .device-card .resources>div{
 flex:auto;min-width:0;margin:0;
}
#dashboard .noc-cpu{
 min-width:0;width:100%;display:flex;flex-direction:column;
 gap:7px;padding:0;margin:0;
 --cpu-tint:#65e6b9;
}
#dashboard .noc-cpu[data-level="warning"]{--cpu-tint:#ffd087}
#dashboard .noc-cpu[data-level="critical"]{--cpu-tint:#ff8f9b}
#dashboard .noc-cpu[data-level="unavailable"]{--cpu-tint:#758e9e}
#dashboard .noc-cpu-heading{
 display:flex;align-items:baseline;justify-content:space-between;gap:10px;min-width:0;
}
#dashboard .noc-cpu-heading>span{
 color:#a8c5d3;font-size:10px;font-weight:750;letter-spacing:.06em;
}
#dashboard .noc-cpu-heading strong{
 color:var(--cpu-tint);font-size:18px;font-weight:830;
 letter-spacing:-.035em;font-variant-numeric:tabular-nums;line-height:1.1;
 white-space:nowrap;
}
#dashboard .noc-cpu-track{
 width:100%;height:7px;border-radius:99px;overflow:hidden;
 background:#28495b;border:1px solid #36596b;
}
#dashboard .noc-cpu-track>span{
 display:block;height:100%;min-width:0;background:var(--cpu-tint);
 border-radius:99px;transition:width .28s ease;
}
#dashboard .noc-cpu-track.unavailable{
 background:repeating-linear-gradient(135deg,#244052,#244052 5px,#2c4d60 5px,#2c4d60 10px);
}
#dashboard .noc-cpu-status{
 align-self:flex-start;color:var(--cpu-tint);font-size:9px;font-weight:730;letter-spacing:.01em;
}
#dashboard .noc-cpu[data-level="normal"] .noc-cpu-status{color:#9edac3}
#dashboard .device-card .resources>div:not(.noc-cpu){
 min-width:0;padding:0 0 0 14px;border-left:1px solid #355567;
}
#dashboard .device-card .resources>div:not(.noc-cpu) .resource-top{
 display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
 gap:3px 10px;font-size:10px;color:#a8c5d3;font-weight:750;
}
#dashboard .device-card .resources>div:not(.noc-cpu) .resource-top b{
 font-size:15px;color:#d6f2ea;font-weight:800;font-variant-numeric:tabular-nums;
}
#dashboard .device-card .resources .meter{
 height:6px;border-radius:99px;margin-top:8px;background:#28495b;
}
#dashboard .device-card .resources .meter>span{
 border-radius:99px;background:#79b0de;
}
#dashboard .device-card .device-bottom{
 font-size:9px;line-height:1.45;gap:5px;padding-left:12px;
}
#dashboard .device-card .device-bottom>span{
 display:flex;justify-content:space-between;gap:8px;min-width:0;
}
#dashboard .device-card .device-bottom>span b{
 font-size:10px;white-space:nowrap;color:#d8eff4;
}
#dashboard .device-card:has(.noc-cpu[data-level="critical"]){
 background:linear-gradient(90deg,#432b3a33,transparent 65%)!important;
}
#dashboard .device-card:has(.noc-cpu[data-level="critical"]) .device-symbol{
 border-color:#7c5a64;
}
@media(min-width:801px) and (max-width:1130px){
 #dashboard .device-card{
  grid-template-columns:minmax(0,1fr) minmax(225px,1fr);
  gap:10px 18px;
 }
 #dashboard .device-card .device-bottom{
  grid-column:1/-1;display:flex;flex-direction:row;flex-wrap:wrap;
  justify-content:flex-start;gap:8px 20px;padding:8px 0 0;
  border-left:0;border-top:1px solid #2c4c5e;
 }
 #dashboard .device-card .device-bottom>span{justify-content:flex-start}
}
@media(max-width:800px){
 #dashboard .dashboard-cpu-headline{
  font-size:9.5px;margin:0 0 7px;line-height:1.5;
 }
 #dashboard .device-card{
  display:flex;flex-wrap:wrap;gap:10px 0;
  padding:12px 13px;min-height:0;
 }
 #dashboard .device-card .card-top{flex:1 1 100%}
 #dashboard .device-card .resources{
  display:grid;flex:1 1 100%;width:100%;
  grid-template-columns:minmax(0,1.3fr) minmax(85px,.85fr);
  gap:13px;margin:2px 0 0;
 }
 #dashboard .noc-cpu-heading strong{font-size:18px}
 #dashboard .noc-cpu-heading>span{font-size:10px}
 #dashboard .noc-cpu-track{height:7px}
 #dashboard .noc-cpu-status{font-size:9px}
 #dashboard .device-card .resources>div:not(.noc-cpu){
  padding-left:14px;
 }
 #dashboard .device-card .resources>div:not(.noc-cpu) .resource-top b{font-size:14px}
 #dashboard .device-card .device-bottom{
  display:flex;flex:1 1 100%;flex-direction:row;justify-content:flex-start;
  align-items:center;flex-wrap:wrap;gap:7px 15px;
  border-left:0;border-top:1px solid #294a60;
  padding:8px 0 0;margin:0;min-width:0;
 }
 #dashboard .device-card .device-bottom>span{gap:5px;font-size:9px}
 #dashboard .device-card .device-bottom>span b{font-size:9px}
}
@media(max-width:365px){
 #dashboard .device-card .resources{
  grid-template-columns:minmax(0,1fr) minmax(77px,.8fr);gap:9px;
 }
 #dashboard .device-card .resources>div:not(.noc-cpu){padding-left:10px}
 #dashboard .noc-cpu-heading strong{font-size:16px}
}
@media(prefers-reduced-motion:reduce){
 #dashboard .noc-cpu-track>span{transition:none}
}