/* WAHub — gaya pentadbir (Bootstrap 5.3 + tambahan kecil) */
:root {
  --wh-green: #128c7e;
  --wh-green-dark: #075e54;
}
body { background: #f4f6f8; }
.wh-nav { background: linear-gradient(90deg, var(--wh-green-dark), var(--wh-green)); }
.wh-nav .nav-link.active { font-weight: 600; text-decoration: underline; text-underline-offset: 6px; }
.wh-kpi { border: 0; box-shadow: 0 1px 2px rgba(0, 0, 0, .06); transition: transform .12s; color: inherit; }
a.wh-kpi:hover { transform: translateY(-2px); }
.card { border-color: #e3e7eb; }
.wh-url { max-width: 260px; }
.wh-err { max-width: 280px; }
.wh-wamid { max-width: 260px; }
.wh-chip { font-weight: 500; margin: 1px 2px 1px 0; }
.wh-events td { vertical-align: top; }
.wh-pre { background: #0f172a; color: #e2e8f0; padding: .9rem 1rem; border-radius: .4rem; font-size: .78rem; max-height: 560px; overflow: auto; white-space: pre-wrap; word-break: break-word; }
.w-35 { width: 35%; }
.font-sans { font-family: var(--bs-body-font-family); }
.wh-mode-status { border-color: #0d6efd; background-color: #eef4ff; }
.wh-mode-inbound { border-color: #198754; background-color: #ecf8f1; font-weight: 600; }
.wh-login { background: radial-gradient(circle at top, #e9f7f4, #f4f6f8 60%); }
.wh-logo { width: 64px; height: 64px; border-radius: 18px; margin: 0 auto; display: grid; place-items: center; font-size: 34px; color: #fff; background: linear-gradient(135deg, var(--wh-green-dark), #25d366); box-shadow: 0 6px 18px rgba(18, 140, 126, .35); }
@media (max-width: 576px) {
  .wh-url, .wh-err, .wh-wamid { max-width: 160px; }
}