/* Vista lista: gráficos con todo el ancho, datos debajo. */
#cards.cards[data-layout="list"] > .card {
  display:grid;grid-template-columns:minmax(0,1fr);align-items:start;
  gap:0;padding:20px 22px;min-width:0;
}
#cards.cards[data-layout="list"] .card-head {
  grid-column:1;grid-row:1;display:flex;justify-content:space-between;
  align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:18px;
}
#cards.cards[data-layout="list"] .card-head .chip {margin-top:0}
#cards.cards[data-layout="list"] .gauges {
  grid-column:1;grid-row:2;display:grid;
  grid-template-columns:100px 100px minmax(0,1fr);gap:24px;
  align-items:start;margin:0;min-width:0;
}
#cards.cards[data-layout="list"] .gauge svg,
#cards.cards[data-layout="list"] .disk-mini .gauge svg {
  display:block;width:74px;height:74px;max-width:100%;margin:0 auto;
}
#cards.cards[data-layout="list"] .gauge-label {margin-top:6px}
#cards.cards[data-layout="list"] .disk-group {align-self:start;min-width:0}
#cards.cards[data-layout="list"] .disk-group > .gauge-label {display:none}
#cards.cards[data-layout="list"] .disk-grid {
  display:grid;grid-template-columns:repeat(auto-fit,minmax(82px,1fr));
  gap:16px 12px;align-items:start;
}
#cards.cards[data-layout="list"] .disk-mini > small {font-size:10px;margin-top:4px}
#cards.cards[data-layout="list"] .disk-more {display:none}
#cards.cards[data-layout="list"] .infra-metrics {
  grid-column:1;grid-row:3;display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;
  border-top:1px solid #243541;margin:20px 0 0;padding:16px 0 0;
}
#cards.cards[data-layout="list"] .card-info {
  grid-column:1;grid-row:4;margin:16px 0 0;padding-top:12px;
}
#cards.cards[data-layout="list"] .card-foot {
  grid-column:1;grid-row:5;display:flex;flex-direction:row;flex-wrap:wrap;
  justify-content:space-between;align-items:center;text-align:left;
  gap:12px;background:none;margin:14px 0 0;padding:0;border:0;
}
#cards.cards[data-layout="list"] .stale-text {grid-column:1;grid-row:6;margin:12px 0 0}
#cards.cards[data-layout="list"] .vc-card-note {grid-column:1;grid-row:7;margin:10px 0 0}
@media(max-width:650px) {
  #cards.cards[data-layout="list"] > .card {padding:17px 15px}
  #cards.cards[data-layout="list"] .gauges {grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
  #cards.cards[data-layout="list"] .disk-group {grid-column:1/-1}
  #cards.cards[data-layout="list"] .disk-grid {grid-template-columns:repeat(auto-fit,minmax(76px,1fr))}
  #cards.cards[data-layout="list"] .infra-metrics {grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
}
/* Compacta v2: unidades consecutivas y tendencia solo en CPU/RAM. */
#cards.cards[data-layout="list"] > .card {padding:14px 16px}
#cards.cards[data-layout="list"] .card-head {gap:10px;margin-bottom:10px}
#cards.cards[data-layout="list"] .host-title {min-width:0;max-width:100%}
#cards.cards[data-layout="list"] .host-title > div {min-width:0}
#cards.cards[data-layout="list"] .host-title h3 {display:inline;margin:0;font-size:14px}
#cards.cards[data-layout="list"] .host-address {display:inline;margin:0;font-size:11px;overflow-wrap:anywhere}
#cards.cards[data-layout="list"] .host-address::before {content:" / ";white-space:pre}
#cards.cards[data-layout="list"] .gauges {display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start}
#cards.cards[data-layout="list"] .gauges > .gauge,
#cards.cards[data-layout="list"] .disk-mini {flex:0 0 80px;min-width:0;max-width:80px}
#cards.cards[data-layout="list"] .disk-group,
#cards.cards[data-layout="list"] .disk-grid {display:contents}
#cards.cards[data-layout="list"] .gauge svg,
#cards.cards[data-layout="list"] .disk-mini .gauge svg {width:64px;height:64px;max-width:64px}
#cards.cards[data-layout="list"] .gauge-label {margin-top:3px;font-size:10px}
#cards.cards[data-layout="list"] .gauges > .gauge > .gauge-description {
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
  min-height:24px;max-height:24px;overflow:hidden;line-height:12px;
  font-size:9px;margin:3px 0 0;overflow-wrap:anywhere;
}
#cards.cards[data-layout="list"] .gauges > .gauge > svg.sparkline {
  display:block;width:80px;max-width:80px;height:18px;margin:2px 0 0;
}
#cards.cards[data-layout="list"] .disk-mini .gauge > svg.sparkline {display:none}
#cards.cards[data-layout="list"] .infra-metrics {margin-top:9px;padding-top:10px;gap:12px}
#cards.cards[data-layout="list"] .card-info {margin-top:9px;padding-top:9px}
#cards.cards[data-layout="list"] .card-foot {margin-top:9px;gap:10px}
#cards.cards[data-layout="list"] .stale-text,
#cards.cards[data-layout="list"] .vc-card-note {margin-top:7px}
@media(max-width:650px) {
  #cards.cards[data-layout="list"] > .card {padding:12px}
  #cards.cards[data-layout="list"] .gauges {display:flex;gap:8px}
  #cards.cards[data-layout="list"] .disk-grid {display:contents}
}
