/* Tambahan khusus halaman status per POP. styles.css adalah salinan utuh MRTG-PUBLIK — jangan disunting di sana. */
.pop-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.pop-card { border: 1px solid var(--grid); border-left: 4px solid var(--nodata); border-radius: 8px; padding: 12px 14px; background: var(--surface); }
.pop-card[data-s="normal"] { border-left-color: var(--good); }
.pop-card[data-s="sebagian"] { border-left-color: var(--warn); }
.pop-card[data-s="gangguan"] { border-left-color: var(--crit); }
.pop-card[data-s="pemeliharaan"] { border-left-color: var(--accent-2); }
.pop-nama { font-weight: 600; font-size: 15px; }
.pop-status { font-size: 13px; margin-top: 4px; }
.pop-card[data-s="gangguan"] .pop-status { color: var(--crit); font-weight: 600; }
.pop-sejak, .pop-insiden { font-size: 12px; color: var(--ink-3); margin-top: 4px; }
.notice.basi[data-level="kuning"] { border-left: 4px solid var(--warn); }
.notice.basi[data-level="merah"] { border-left: 4px solid var(--crit); }
.incident-body { white-space: pre-line; }   /* isi · Penyebab · Dampak dipisah baris baru di status.js */
.incident-update { font-size: 12.5px; color: var(--ink-3); margin-top: 6px; }
.footer-note a { color: inherit; }

/* ---- Perbaikan review ---- */
/* h1 tampil sama seperti span.header-title sebelumnya */
h1.header-title { margin: 0; font-size: 15px; font-weight: 600; line-height: inherit; letter-spacing: normal; }

/* Banner netral: status belum dapat dipantau / sebagian wilayah belum terpantau (bukan hijau). */
.banner[data-level="unknown"] { border-left-color: var(--ink-3); }
.banner[data-level="unknown"] .banner-dot { background: var(--ink-3); }
.banner[data-level="error"] .banner-dot { background: var(--ink-3); }

/* Data basi: kuning 5-30 menit, merah > 30 menit (lebih kuat). */
.notice.basi .basi-baris + .basi-baris { margin-top: 4px; }
.notice.basi[data-level="merah"] { background: #fdeaea; border-color: var(--crit); color: #7a1818; font-weight: 600; }
.notice.basi[data-level="merah"] .basi-baris + .basi-baris { font-weight: 400; }

/* Bilah uptime 90 hari tak boleh meluap di ponsel sempit. */
.uptime-bars { overflow: hidden; }
@media (max-width: 640px) {
  .uptime-bars { gap: 1px; }
  .uptime-bars i { min-width: 1px; }
}