/* Threat Pursuit — Theme Pack (Demo) */
:root{
  /* these are defaults; the HTML inline CSS also defines vars. This file overrides where needed. */
  --accent: #00d9ff;
  --accent2: #7de7f2;
  --accent-rgb: 0, 217, 255;
  --txt: #e2e8f0;
  --muted: #94a3b8;
  --shadow: rgba(var(--accent-rgb),0.05);
}

/* -------- Animated network links (pulse effects) -------- */
.netLinks{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.netRow{
  display:grid;
  grid-template-columns: 150px 1fr 90px;
  gap:10px;
  align-items:center;
}
.netLabel{
  font-size:12px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color: var(--muted);
}
.netMeta{
  text-align:right;
  font-size:12px;
  color: var(--muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

.link{
  position: relative;
  height: 2px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb),0.14);
  border: 1px solid rgba(var(--accent-rgb),0.06);
  overflow: hidden;
}
.link::after{
  content:'';
  position:absolute;
  top:-1px;
  height:4px;
  width:52px;
  left:-60px;
  background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb),0.95), transparent);
  filter: blur(0.2px);
  animation: tp_pulse 3.2s linear infinite;
  opacity: 0.9;
}
.link.warn{ background: rgba(255,209,102,0.12); border-color: rgba(255,209,102,0.08); }
.link.warn::after{
  background: linear-gradient(90deg, transparent, rgba(255,209,102,0.95), transparent);
  animation-duration: 4.2s;
}
.link.bad{ background: rgba(255,92,122,0.10); border-color: rgba(255,92,122,0.08); }
.link.bad::after{
  background: linear-gradient(90deg, transparent, rgba(255,92,122,0.95), transparent);
  animation-duration: 5.0s;
}

@keyframes tp_pulse{
  from { left:-60px; }
  to   { left:100%; }
}

/* -------- Night operation variant -------- */
body.night{
  /* dim the cyan, reduce bloom */
  --accent: #00a9bf;
  --accent2: #7de7f2;
  --shadow: rgba(var(--accent-rgb),0.05);
}

/* reduce visual noise */
body.night .scanlines{ opacity: 0.08 !important; }
body.night header{
  background: linear-gradient(180deg, rgba(12,18,24,0.96), rgba(7,11,15,0.94)) !important;
}
body.night aside,
body.night section.content{
  border-color: rgba(var(--accent-rgb),0.12) !important;
}
body.night .navBtn.active{
  box-shadow: 0 0 0 1px rgba(var(--accent-rgb),0.12), 0 0 14px rgba(var(--accent-rgb),0.06) !important;
}
body.night .ico{
  box-shadow: none !important;
}
body.night .pill{
  box-shadow: 0 0 0 1px rgba(0,0,0,0.2), 0 10px 22px rgba(0,0,0,0.18) !important;
}
body.night .btn:hover{
  box-shadow: 0 0 0 1px rgba(var(--accent-rgb),0.06), 0 0 16px rgba(var(--accent-rgb),0.06) !important;
}

/* slow down motion slightly for low-observability */
body.night .link::after{ animation-duration: 4.2s; opacity: 0.75; }

/* -------- Day operation variant -------- */
body.theme-day .scanlines{ opacity: 0.04 !important; }
body.theme-day header{
  background: linear-gradient(180deg, rgba(252,253,254,0.98), rgba(241,246,248,0.96)) !important;
  box-shadow: 0 6px 18px rgba(10,20,22,0.12) !important;
}
body.theme-day aside,
body.theme-day section.content{
  border-color: rgba(var(--accent-rgb),0.18) !important;
}
body.theme-day aside{
  background: rgba(255,255,255,0.92) !important;
}
body.theme-day .nav{
  background: transparent;
}
body.theme-day .navHead{
  background: linear-gradient(180deg, rgba(252,253,254,0.98), rgba(245,249,250,0.96)) !important;
  border-bottom: 1px solid rgba(var(--accent-rgb),0.18) !important;
}
body.theme-day .contentHead{
  background: linear-gradient(180deg, rgba(252,253,254,0.98), rgba(245,249,250,0.96)) !important;
  border-bottom: 1px solid rgba(var(--accent-rgb),0.18) !important;
}
body.theme-day .card{
  background: rgba(255,255,255,0.96) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
}
body.theme-day .graphCard,
body.theme-day .chartCard{
  background: rgba(255,255,255,0.96) !important;
}
body.theme-day .graphConsoleFloat,
body.theme-day .graphDetailsFloat{
  background: rgba(255,255,255,0.98) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
}
body.theme-day #graphConsole{
  background: rgba(250,252,252,0.98) !important;
  color: var(--txt) !important;
}
body.theme-day .graphPiercerResults,
body.theme-day .graphTitanResults,
body.theme-day .graphConsoleStub{
  background: rgba(250,252,252,0.98) !important;
  color: var(--txt) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
}
body.theme-day .graphPiercerOutput,
body.theme-day .graphTitanOutput{
  color: var(--txt) !important;
}
body.theme-day .graphResultBody{
  background: rgba(250,252,252,0.98) !important;
  color: var(--txt) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
}
body.theme-day .mono{
  color: var(--txt);
}
body.theme-day #graphCanvas{
  background: #f8fbfc !important;
  border-color: rgba(var(--accent-rgb),0.18) !important;
}
body.theme-day .graphCanvasCard.mapActive #graphCanvas{
  background: transparent !important;
}
body.theme-day .reportChartCard{
  background: rgba(255,255,255,0.98) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
  color: var(--txt) !important;
}
body.theme-day .reportChartTitle,
body.theme-day .reportChartStatus{
  color: var(--txt) !important;
}
body.theme-day #serRx,
body.theme-day #console,
body.theme-day #centralEvents{
  background: rgba(250,252,252,0.98) !important;
  color: var(--txt) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
}
body.theme-day #mqttLogs,
body.theme-day #mqttTokenOutput{
  background: rgba(250,252,252,0.98) !important;
  color: var(--txt) !important;
  border-color: rgba(var(--accent-rgb),0.16) !important;
}
body.theme-day table thead th{
  background: rgba(var(--accent-rgb),0.08);
}
body.theme-day table tbody td{
  background: rgba(255,255,255,0.96);
}
body.theme-day .navBtn.active{
  box-shadow: none !important;
  background: rgba(0,0,0,0.04) !important;
  border-color: rgba(0,0,0,0.12) !important;
  color: var(--txt) !important;
}
body.theme-day .pill{
  box-shadow: 0 0 0 1px rgba(0,0,0,0.06), 0 8px 16px rgba(12,20,22,0.1) !important;
}
body.theme-day .btn:hover{
  box-shadow: 0 0 0 1px rgba(var(--accent-rgb),0.18), 0 0 12px rgba(var(--accent-rgb),0.12) !important;
}
body.theme-day .link::after{ opacity: 0.55; }
body.theme-day .navBtn{
  background: rgba(255,255,255,0.96) !important;
  border-color: rgba(0,0,0,0.05) !important;
  color: var(--txt) !important;
  box-shadow: 0 6px 14px rgba(12,20,22,0.06) !important;
}
body.theme-day .navBtn:hover{
  background: rgba(248,250,251,0.98) !important;
  border-color: rgba(0,0,0,0.08) !important;
  box-shadow: 0 10px 20px rgba(12,20,22,0.08) !important;
}
body.theme-day .ico{
  background: rgba(0,0,0,0.03) !important;
  border-color: rgba(0,0,0,0.08) !important;
  color: var(--txt) !important;
  box-shadow: none !important;
}
body.theme-day .navBtn.active .ico{
  background: rgba(0,0,0,0.05) !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.theme-day input,
body.theme-day select,
body.theme-day textarea{
  color: var(--txt) !important;
  background: rgba(255,255,255,0.98) !important;
  border-color: rgba(0,0,0,0.12) !important;
}
body.theme-day input::placeholder,
body.theme-day textarea::placeholder{
  color: var(--muted) !important;
}
body.theme-day .btn{
  color: var(--txt) !important;
  background: rgba(245,249,250,0.96) !important;
  border-color: rgba(0,0,0,0.14) !important;
  box-shadow: none !important;
}
body.theme-day .btn.primary{
  background: rgba(var(--accent-rgb),0.12) !important;
  border-color: rgba(var(--accent-rgb),0.32) !important;
  color: var(--txt) !important;
}
body.theme-day .btn.danger{
  background: rgba(255,92,122,0.12) !important;
  border-color: rgba(255,92,122,0.25) !important;
  color: #4a1b24 !important;
}
body.theme-day .graphMenu{
  background: rgba(255,255,255,0.98) !important;
  border-color: rgba(0,0,0,0.12) !important;
  box-shadow: 0 16px 28px rgba(0,0,0,0.12) !important;
}
body.theme-day .graphMenu button{
  color: var(--txt) !important;
  border-bottom: 1px solid rgba(0,0,0,0.08) !important;
}
body.theme-day .graphMenu button:hover{
  background: rgba(var(--accent-rgb),0.10) !important;
}