/* NPN force-visible range rings v8 */

:root {
  --npn-ring-color: #39d36f;
  --n0par-ring-color: #39b7e6;
  --node-ring-color: #ffbf5f;
  --ring-panel-bg: rgba(5, 9, 5, .90);
}

.leaflet-pane.leaflet-npn-range-pane {
  z-index: 425 !important;
  pointer-events: none !important;
}

.npn-range-polyline {
  pointer-events: none !important;
}

.npn-range-node-polyline {
  filter: drop-shadow(0 0 2px rgba(255,191,95,.20));
}

.npn-range-label {
  background: rgba(5, 9, 5, .86);
  border: 1px solid rgba(236,253,245,.34);
  color: rgba(236,253,245,.90);
  padding: 3px 6px;
  font-family: "Courier New", Consolas, monospace;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .06em;
  white-space: nowrap;
  box-shadow: 0 0 10px rgba(0,0,0,.35);
}

.npn-range-label.npn {
  color: rgba(132,255,132,.92);
  border-color: rgba(132,255,132,.46);
}

.npn-range-label.n0par {
  color: rgba(125,211,252,.94);
  border-color: rgba(125,211,252,.50);
}

.npn-range-label.node {
  color: rgba(255,213,128,.94);
  border-color: rgba(255,191,95,.48);
}

.npn-range-control {
  background: var(--ring-panel-bg);
  color: #ecfdf5;
  border: 1px solid rgba(125,211,252,.34);
  padding: 10px 11px;
  min-width: 255px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  box-shadow: 0 18px 50px rgba(0,0,0,.35);
}

.npn-range-control-title {
  color: rgba(236,253,245,.90);
  font-weight: 950;
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.npn-range-control-status {
  color: #a9b8a9;
  font-size: 11px;
  line-height: 1.4;
}

.npn-range-control-row {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-top: 8px;
}

.npn-range-mini {
  border: 1px solid rgba(125,211,252,.34);
  background: rgba(15,24,15,.92);
  color: #ecfdf5;
  padding: 5px 7px;
  font-size: 10px;
  font-weight: 900;
  cursor: pointer;
}

.npn-range-mini.active {
  color: #061006;
  background: rgba(132,255,132,.78);
  border-color: rgba(236,253,245,.70);
}

#npnRingsToggle.ring-on,
#n0parRingsToggle.ring-on,
#rfOpsToggle.ops-on {
  border-color: rgba(132,255,132,.75) !important;
  box-shadow: 0 0 14px rgba(132,255,132,.10) !important;
}

#n0parRingsToggle.ring-on {
  border-color: rgba(125,211,252,.80) !important;
  box-shadow: 0 0 14px rgba(125,211,252,.12) !important;
}

#npnRingsToggle.ring-off,
#n0parRingsToggle.ring-off,
#rfOpsToggle.ops-off {
  border-color: rgba(255,191,95,.42) !important;
  opacity: .82;
}

.npn-rf-ops-mode .marker-client,
.npn-rf-ops-mode .marker-room,
.npn-rf-ops-mode .marker-unknown,
.npn-rf-ops-mode .npn-icon-client,
.npn-rf-ops-mode .npn-icon-room,
.npn-rf-ops-mode .npn-icon-unknown {
  opacity: .25 !important;
  filter: grayscale(.35);
}

/* Dim force-visible ring override v6 */
.npn-range-label {
  background: rgba(5, 9, 5, .76) !important;
  border-color: rgba(236,253,245,.20) !important;
  color: rgba(236,253,245,.72) !important;
  box-shadow: none !important;
}

.npn-range-label.npn {
  color: rgba(132,255,132,.70) !important;
  border-color: rgba(132,255,132,.24) !important;
}

.npn-range-label.n0par {
  color: rgba(125,211,252,.72) !important;
  border-color: rgba(125,211,252,.26) !important;
}

/* Balanced ring visibility v7/v8 */
.npn-range-label {
  background: rgba(5, 9, 5, .82) !important;
  border-color: rgba(236,253,245,.28) !important;
  color: rgba(236,253,245,.84) !important;
  box-shadow: none !important;
}

.npn-range-label.npn {
  color: rgba(132,255,132,.84) !important;
  border-color: rgba(132,255,132,.34) !important;
}

.npn-range-label.n0par {
  color: rgba(125,211,252,.86) !important;
  border-color: rgba(125,211,252,.38) !important;
}

.npn-range-label.node {
  color: rgba(255,213,128,.90) !important;
  border-color: rgba(255,191,95,.42) !important;
}

.npn-node-ring-actions {
  margin-top: 9px;
  padding-top: 8px;
  border-top: 1px solid rgba(236,253,245,.16);
}

.npn-node-ring-toggle {
  width: 100%;
  border: 1px solid rgba(255,191,95,.42);
  background: rgba(12,18,12,.96);
  color: rgba(236,253,245,.90);
  padding: 7px 9px;
  font-family: "IBM Plex Mono", "Courier New", monospace;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .05em;
  text-transform: uppercase;
  cursor: pointer;
}

.npn-node-ring-toggle.active {
  background: rgba(255,191,95,.82);
  border-color: rgba(255,230,170,.86);
  color: #090d08;
  box-shadow: 0 0 16px rgba(255,191,95,.16);
}

.npn-node-ring-toggle:hover {
  border-color: rgba(255,230,170,.86);
}