/* Secure-VPN V10 - scope: Heatmap's Selected result details only.
   Fixes the 3 narrow columns that squeezed text into letter-by-letter wraps.
   No table, API, data, or other page changes. */
body.heatmap-page #heatmap .detail-card {
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
  color:#153944!important;
  background:#fff!important;
}
body.heatmap-page #heatmap .detail-card h2 {
  color:#113646!important;
  font-size:clamp(19px,1.6vw,23px)!important;
  line-height:1.3!important;
}
body.heatmap-page #heatmap .detail-card .detail-title {
  color:#125b4c!important;
  font-size:14px!important;
  line-height:1.5!important;
  font-weight:750!important;
  overflow-wrap:anywhere!important;
}
body.heatmap-page #heatmap .detail-card dl {
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  align-items:stretch!important;
  margin:12px 0 0!important;
}
body.heatmap-page #heatmap .detail-card dl > div {
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  width:auto!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  min-height:78px!important;
  padding:12px!important;
  gap:5px!important;
  background:#f6fbf8!important;
  border:1px solid #cbded6!important;
  border-radius:12px!important;
  overflow-wrap:anywhere!important;
  box-sizing:border-box!important;
}
body.heatmap-page #heatmap .detail-card dl > div dt {
  display:block!important;
  flex:none!important;
  width:auto!important;
  max-width:100%!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.4!important;
  color:#426475!important;
  letter-spacing:0!important;
  overflow-wrap:normal!important;
}
body.heatmap-page #heatmap .detail-card dl > div dd {
  display:block!important;
  flex:none!important;
  margin:0!important;
  width:auto!important;
  max-width:100%!important;
  font-size:14px!important;
  font-weight:650!important;
  line-height:1.5!important;
  color:#143c4b!important;
  word-break:normal!important;
  overflow-wrap:anywhere!important;
  white-space:normal!important;
}
body.heatmap-page #heatmap .detail-card dl > div:has(> #detail-exit-ip),
body.heatmap-page #heatmap .detail-card dl > div:has(> #detail-confidence),
body.heatmap-page #heatmap .detail-card dl > div:has(> #detail-connect) {
  grid-column:1/-1!important;
  min-height:0!important;
}
body.heatmap-page #heatmap .detail-card #detail-exit-ip {
  font-size:13px!important;
  font-variant-numeric:tabular-nums!important;
  color:#193e4b!important;
}
body.heatmap-page #heatmap .detail-card #detail-confidence {
  color:#155d4c!important;
}
body.heatmap-page #heatmap .detail-card #detail-close {
  color:#174c51!important;
  border-color:#bedcd2!important;
  background:#fff!important;
}
@media(max-width:700px){
  body.heatmap-page #heatmap .detail-card dl {
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.heatmap-page #heatmap .detail-card dl > div {min-height:0!important}
}