/* Alien IT: coloured network rooms, enamel device badges, clear stop markers. */
.cp-main-map {
  background: #f4f8fc;
  border-color: #c5d6e2;
  box-shadow: 0 16px 42px #18384b0a, inset 0 1px 0 #fff;
}
.cp-main-map .lt-map-toolbar {
  border-color: #d3dfe8;
  box-shadow: 0 4px 14px #18384b08;
}
.cp-main-map .lt-solution {
  border-color: #ccdbe4;
  border-radius: 10px;
  background: #f9fcfe;
  color: #27465c;
  box-shadow: inset 0 1px 0 #fff;
}
.cp-main-map .lt-solution:hover { background: #edf5fa; border-color: #8aaabd; }
.cp-main-map .lt-solution[aria-pressed=true] {
  background: #e5f3ed;
  border-color: #428a77;
  color: #155e50;
  box-shadow: inset 0 -3px 0 #428a77;
}
.cp-main-map .lt-map-tools > button { background: #213f53; border-radius: 9px; }
.cp-main-map .map-heading { color: #49697c; padding-top: 10px; }
.cp-main-map .room { stroke-width: 1.5; }
.cp-main-map .trusted-room { fill: #e5f0fa; stroke: #9fbed6; }
.cp-main-map .iot-room { fill: #efebf8; stroke: #b8acd3; }
.cp-main-map .local-room { fill: #e4f3ed; stroke: #9fcaba; }
.cp-main-map .guest-room { fill: #faf1dc; stroke: #d6c18c; }
.cp-main-map .room-label { letter-spacing: .8px; }
.cp-main-map #trusted-label { fill: #275e86; }
.cp-main-map #iot-label { fill: #655184; }
.cp-main-map #services-label { fill: #286e5a; }
.cp-main-map #guest-label { fill: #80642d; }
.cp-main-map .wire path { stroke: #9eafbd; stroke-opacity: .42; stroke-width: 2; }
.cp-main-map .device-node { --device-accent: #356c93; }
.cp-main-map .device-node.tv,
.cp-main-map .device-node.camera,
.cp-main-map .device-node.printer { --device-accent: #78629b; }
.cp-main-map .device-node.dns,
.cp-main-map .device-node.recorder,
.cp-main-map .device-node.nas { --device-accent: #347d66; }
.cp-main-map .device-node.guest { --device-accent: #927235; }
.cp-main-map .device-node .node-disc {
  fill: url(#device-face);
  stroke: #fff;
  stroke-width: 3;
  filter: drop-shadow(0 3px 3px #18384b23);
}
.cp-main-map .device-node .device-icon {
  stroke: var(--device-accent);
  stroke-width: 2.2;
}
.cp-main-map .device-node .node-label { fill: #193e53; font-weight: 650; }
.cp-main-map .device-node .node-note { fill: #4b6779; }
.cp-main-map .device-node.router .node-disc {
  fill: url(#gateway-face);
  stroke: #e4f4f0;
  stroke-width: 4;
  filter: drop-shadow(0 4px 6px #163f4c35);
}
.cp-main-map .device-node.router .device-icon { stroke: #effffb; stroke-width: 2; }
.cp-main-map .device-node:hover .node-disc,
.cp-main-map .device-node:focus-visible .node-disc { stroke: var(--device-accent); }
.cp-main-map .device-node:focus-visible { outline: none; }
.cp-main-map .lt-flight-path { stroke-width: 3; stroke-opacity: .32; }
.cp-main-map .lt-flight-blocked .lt-flight-path { stroke: #b43d55; stroke-dasharray: 5 6; stroke-opacity: .5; }
.cp-main-map .lt-moving-marker > circle { filter: drop-shadow(0 1px 2px #17394e30); }
.cp-main-map .lt-packet-label rect {
  fill: #fff;
  stroke: #bdcfdc;
  stroke-width: 1;
  filter: drop-shadow(0 2px 2px #17394e13);
}
.cp-main-map .lt-flight-blocked .lt-packet-label rect { fill: #fff7f8; stroke: #cd8a98; }
.cp-main-map .lt-flight-blocked .lt-moving-marker > circle { fill: #b43d55; }
.cp-main-map .lt-flight-blocked.lt-deciding .lt-packet-label rect { fill: #fff0f3; stroke: #b43d55; stroke-width: 1.8; }
.lt-drop-frame { display: none; }
.lt-flight-blocked.lt-deciding .lt-drop-frame {
  display: block;
  fill: #fff1f4;
  stroke: #b43d55;
  stroke-width: 2;
}
.cp-main-map .lt-flight-blocked.lt-deciding .lt-moving-marker > circle { stroke-width: 1.5; }
.cp-main-map .lt-flight-allowed.lt-deciding .lt-packet-label rect { fill: #f2fbf6; stroke: #6ea890; }
.cp-service-strip > div { border-color: #d5e2eb; box-shadow: 0 3px 10px #17394e04; }
@media (prefers-reduced-motion: reduce) {
  .cp-main-map .device-node { transition: none; }
}