/* NPN Solar Storm / Aurora Overlay v1 */

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

.npn-solar-control {
  background: rgba(5, 9, 5, .92);
  color: #ecfdf5;
  border: 1px solid rgba(255,191,95,.38);
  padding: 11px;
  width: 285px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  box-shadow: 0 18px 50px rgba(0,0,0,.36);
}

.npn-solar-title {
  color: rgba(255,191,95,.92);
  font-weight: 950;
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.npn-solar-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

.npn-solar-stat {
  border: 1px solid rgba(148,163,184,.22);
  background: rgba(15,24,15,.78);
  padding: 7px;
}

.npn-solar-stat span {
  display: block;
  color: rgba(236,253,245,.56);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.npn-solar-stat b {
  display: block;
  margin-top: 2px;
  font-size: 15px;
  font-weight: 950;
}

.npn-solar-stat.good b { color: rgba(132,255,132,.86); }
.npn-solar-stat.watch b { color: rgba(255,191,95,.90); }
.npn-solar-stat.storm b { color: rgba(255,120,120,.90); }

.npn-solar-row {
  display: grid;
  gap: 6px;
  margin-top: 8px;
}

.npn-solar-row label {
  color: rgba(236,253,245,.70);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.npn-solar-buttons {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
  margin-top: 8px;
}

.npn-solar-control button {
  border: 1px solid rgba(255,191,95,.34);
  background: rgba(15,24,15,.92);
  color: #ecfdf5;
  padding: 8px 9px;
  font-size: 11px;
  font-weight: 950;
  cursor: pointer;
}

.npn-solar-control button.active {
  color: #061006;
  background: rgba(255,191,95,.82);
  border-color: rgba(236,253,245,.70);
}

.npn-solar-control input[type="range"] {
  width: 100%;
}

.npn-solar-status {
  color: #a9b8a9;
  font-size: 11px;
  line-height: 1.35;
  margin-top: 8px;
}

.npn-solar-status.good { color: rgba(132,255,132,.78); }
.npn-solar-status.warn { color: rgba(255,191,95,.82); }
.npn-solar-status.bad { color: rgba(255,120,120,.86); }

#solarStormTopToggle.solar-on {
  border-color: rgba(255,191,95,.82) !important;
  box-shadow:
    0 0 0 1px rgba(255,191,95,.12) inset,
    0 0 16px rgba(255,191,95,.18) !important;
}

#solarStormTopToggle.solar-storm {
  border-color: rgba(255,120,120,.92) !important;
  box-shadow:
    0 0 0 1px rgba(255,120,120,.18) inset,
    0 0 20px rgba(255,120,120,.24) !important;
}

.npn-solar-legend {
  display: flex;
  gap: 5px;
  align-items: center;
  margin-top: 7px;
  color: rgba(236,253,245,.62);
  font-size: 10px;
}

.npn-solar-swatch {
  width: 18px;
  height: 9px;
  border: 1px solid rgba(236,253,245,.20);
}

.npn-solar-swatch.low { background: rgba(80, 200, 120, .70); }
.npn-solar-swatch.mid { background: rgba(255, 191, 95, .78); }
.npn-solar-swatch.high { background: rgba(255, 80, 110, .84); }
.npn-solar-swatch.extreme { background: rgba(190, 80, 255, .88); }