/* Simple Grafana panel styling — plain iframes, responsive grid, no JS.
 *
 * 2026-04-19: Stripped the JS-driven time-range picker that rewrote
 * iframe URLs on click. The rewrites introduced future-dated ranges
 * (now+72h) that Grafana returned empty for most panels, so panels
 * looked broken / blank. Falling back to whatever range the iframe
 * src carries. If a time picker comes back, it should wrap the iframe
 * in a <details> or similar and NOT rewrite src without user intent.
 */

/* Panel grid layouts: .pg.sN = N columns on desktop */
.pg {
  display: grid;
  gap: 0.5rem;
  margin: 1rem 0;
  width: 100%;
}
.pg iframe {
  width: 100%;
  border: 1px solid var(--lightgray);
  border-radius: 6px;
  background: var(--light);
}
.pg.s1 { grid-template-columns: 1fr; }
.pg.s2 { grid-template-columns: 1fr 1fr; }
.pg.s3 { grid-template-columns: repeat(3, 1fr); }
.pg.s4 { grid-template-columns: repeat(4, 1fr); }
.pg.s6 { grid-template-columns: repeat(6, 1fr); }

/* Mobile: everything collapses to one column (simpler than forcing 2). */
@media (max-width: 768px) {
  .pg.s2, .pg.s3, .pg.s4, .pg.s6 {
    grid-template-columns: 1fr;
  }
}

/* Hide any leftover time-picker control placeholders; the JS is gone. */
.grafana-controls { display: none; }

/* Ensure Quartz article styles don't clip panels */
article .pg, article div[class*="pg"] { overflow: visible; }