/* Visitor Intelligence enriched context panel */

.vi-monitor-detail {
  width: min(560px, 100vw);
}

.vi-monitor-detail-body {
  padding-bottom: 104px;
}

.vi-monitor-det-section {
  padding: 12px;
  border: 1px solid var(--vi-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.018);
}

.vi-monitor-det-section + .vi-monitor-det-section {
  margin-top: 12px;
}

.vi-monitor-kv {
  grid-template-columns: 148px minmax(0, 1fr);
}

.vi-monitor-kv:last-child {
  border-bottom: 0;
}

.vi-monitor-kv strong {
  line-height: 1.42;
}

.vi-monitor-detail-actions {
  flex-wrap: wrap;
}

.vi-monitor-act-btn {
  min-width: 110px;
}

.vi-monitor-tag[href*="screen_resolution"],
.vi-monitor-tag[href*="effective_connection_type"] {
  border-color: rgba(85, 216, 255, 0.22);
  background: rgba(85, 216, 255, 0.06);
  color: var(--vi-cyan-2);
}

@media (max-width: 760px) {
  .vi-monitor-detail {
    width: 100%;
  }

  .vi-monitor-kv {
    grid-template-columns: 118px minmax(0, 1fr);
  }

  .vi-monitor-detail-actions {
    position: sticky;
  }
}