/* ── IP lookup widget (shared by homepage and /ip-data) ── */
.ip-widget {
  background: var(--white);
  border: 1px solid var(--gray-200);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
  overflow: hidden
}

.ip-widget-header {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--gray-200);
  display: flex;
  align-items: center;
  gap: .75rem
}

.ip-widget-header input {
  flex: 1;
  padding: .5rem .75rem;
  border: 1.5px solid var(--gray-200);
  border-radius: var(--radius-sm);
  font-family: var(--mono);
  font-size: .85rem;
  outline: none;
  transition: border-color .2s
}

.ip-widget-header input:focus {
  border-color: var(--blue-500)
}

.ip-widget-header button {
  padding: .5rem 1rem;
  background: transparent;
  color: var(--blue-500);
  border: 1.5px solid var(--blue-500);
  border-radius: var(--radius-sm);
  font-family: var(--font);
  font-size: .8rem;
  font-weight: 600;
  cursor: pointer
}

.ip-widget-header button:hover {
  background: var(--blue-50)
}

.ip-widget-tabs {
  display: flex;
  border-bottom: 1px solid var(--gray-200);
  overflow-x: auto;
  scrollbar-width: none
}

.ip-widget-tabs::-webkit-scrollbar {
  display: none
}

.ip-widget-tab {
  flex: 1;
  padding: .6rem .75rem;
  font-size: .75rem;
  font-weight: 600;
  color: var(--gray-400);
  border: none;
  background: none;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all .2s;
  font-family: var(--font);
  white-space: nowrap;
  text-align: center
}

.ip-widget-tab.active {
  color: var(--blue-500);
  border-bottom-color: var(--blue-500)
}

.ip-widget-body {
  padding: 1rem 1.25rem;
  overflow-y: auto;
  position: relative
}

.ip-widget-body.locked .ip-widget-body-content {
  filter: blur(5px);
  user-select: none;
  pointer-events: none
}

.ip-widget-lock-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  background: rgba(255, 255, 255, .25)
}

.ip-widget-lock-overlay .btn {
  box-shadow: var(--shadow-md)
}

.ip-result-row {
  display: flex;
  justify-content: space-between;
  padding: .45rem 0;
  border-bottom: 1px solid var(--gray-100);
  font-size: .82rem
}

.ip-result-row:last-child {
  border-bottom: none
}

.ip-result-key {
  color: var(--gray-400);
  font-weight: 500
}

.ip-result-value {
  font-family: var(--mono);
  font-size: .78rem;
  color: var(--gray-900);
  text-align: right
}

.ip-tag {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .15rem .5rem;
  border-radius: 100px;
  font-size: .72rem;
  font-weight: 600
}

.ip-summary-asn {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  flex-wrap: wrap
}

.ip-summary-asn-number {
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--navy);
  font-family: var(--mono);
  text-decoration: none;
  transition: color .15s;
}

a.ip-summary-asn-number {
  background-image: linear-gradient(var(--blue-500), var(--blue-500));
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1.5px;
  transition: background-size .2s, color .15s;
}

a.ip-summary-asn-number:hover {
  color: var(--blue-500);
  background-size: 100% 1.5px;
}

.ip-summary-asn-name {
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--gray-700)
}

.ip-summary-asn-type {
  display: inline-flex;
  padding: .2rem .6rem;
  border-radius: 100px;
  font-size: .68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .03em;
  background: var(--blue-50);
  color: var(--blue-700);
  border: 1px solid var(--blue-100);
  vertical-align: middle
}

.ip-summary-desc {
  font-size: .82rem;
  color: var(--gray-400);
  margin-top: .25rem
}

.ip-summary-domain {
  font-size: .82rem;
  color: var(--blue-500);
  margin-top: .15rem;
  text-decoration: none
}

.ip-summary-domain:hover {
  text-decoration: underline
}

.ip-summary-risk {
  display: flex;
  align-items: baseline;
  gap: .5rem;
  margin-top: .75rem
}

.ip-summary-risk-label {
  font-size: .82rem;
  font-weight: 600;
  color: var(--gray-700)
}

.ip-summary-risk-score {
  font-family: var(--mono);
  font-size: .75rem;
  font-weight: 700;
  padding: .15rem .4rem;
  border-radius: 4px
}

.ip-summary-risk-score.risk-high {
  background: #fff1f1;
  color: #da1e28
}

.ip-summary-risk-score.risk-medium {
  background: #fff8e1;
  color: #b86e00
}

.ip-summary-risk-score.risk-low {
  background: #defbe6;
  color: #0e6027
}

.ip-summary-risk-level {
  font-size: .82rem;
  font-weight: 600
}

.ip-summary-risk-detail {
  font-size: .75rem;
  color: var(--gray-400);
  margin-top: .2rem
}

.ip-summary-location {
  display: flex;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--gray-100);
  align-items: center
}

.ip-summary-map {
  width: 100px;
  height: 68px;
  border-radius: var(--radius-sm);
  background: var(--gray-100);
  flex-shrink: 0;
  border: 1px solid var(--gray-200);
  overflow: hidden
}

.ip-summary-location-info {
  flex: 1
}

.ip-summary-country {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: 1.05rem;
  font-weight: 600;
  color: var(--navy)
}

.ip-summary-city {
  display: flex;
  align-items: center;
  gap: .4rem;
  font-size: .82rem;
  color: var(--gray-400);
  margin-top: .15rem
}

.ip-summary-resolution {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  padding: .1rem .4rem .1rem .3rem;
  border-radius: 100px;
  background: var(--gray-100);
  color: var(--gray-400);
  font-size: .68rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  cursor: help
}

.ip-summary-resolution svg {
  flex-shrink: 0
}

.ip-summary-resolution::after {
  content: attr(data-tip);
  position: absolute;
  bottom: calc(100% + .5rem);
  left: -.5rem;
  z-index: 500;
  width: 210px;
  padding: .5rem .65rem;
  border-radius: var(--radius-sm);
  background: var(--navy);
  color: #fff;
  font-size: .72rem;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  line-height: 1.45;
  opacity: 0;
  visibility: hidden;
  transform: translateY(3px);
  transition: opacity .15s, transform .15s, visibility .15s
}

.ip-summary-resolution:hover::after,
.ip-summary-resolution:focus::after {
  opacity: 1;
  visibility: visible;
  transform: translateY(0)
}

.ip-summary-tags {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--gray-100)
}

.ip-summary-tag {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .25rem .6rem;
  border-radius: 100px;
  font-size: .72rem;
  font-weight: 600
}

.ip-tag-green {
  background: #defbe6;
  color: #0e6027
}

.ip-tag-neutral {
  background: var(--gray-100);
  color: var(--gray-400)
}

.ip-tag-red {
  background: #fff1f1;
  color: #da1e28
}

.ip-tag-amber {
  background: #fff8e1;
  color: #b86e00
}

@media(max-width:840px) {
  .ip-widget-tabs { flex-wrap: wrap }
  .ip-widget-tab { flex: none; padding: .6rem .6rem; font-size: .7rem }
}
