/* SPDX-License-Identifier: GPL-3.0-or-later */
/* Copyright (C) 2014-2026 Karl R. Wurst */

.info-bar {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.82rem;
  color: #555;
  padding: 0.4rem 1.5rem;
  border-bottom: 1px solid #e0e0e0;
  background: #f8f8f8;
  text-align: center;
}

#wrap {
  overflow: auto;
  padding: 1.25rem 1rem 2rem;
}

svg { display: block; margin: 0 auto; }

/* Node cards: plain white with a thin black/dark border, like the site's boxes */
.node-card {
  fill: #ffffff;
  stroke: #333333;
  stroke-width: 1;
}
.node-card.root-card {
  fill: #e8f0fe;   /* light blue tint for Karl */
  stroke: #333;
  stroke-width: 1.5;
}
.node-card.leaf-card {
  fill: #f9f9f9;
  stroke: #888888;
  stroke-width: 1;
  stroke-dasharray: 4 3;
}

.node-g { cursor: pointer; }
.node-g:hover .node-card      { fill: #fffbe6; stroke: #0000cc; }
.node-g:hover .node-card.root-card { fill: #d0e4ff; stroke: #0000cc; }

/* Text inside nodes */
.node-name {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  fill: #000000;
  pointer-events: none;
}
.node-link-style {
  fill: #0000cc;   /* blue link colour matching the site */
}
.node-meta {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 10px;
  fill: #333333;
  pointer-events: none;
}
.node-div {
  stroke: #cccccc;
  stroke-width: 0.8;
}

/* Edges: simple dark grey lines */
.edge {
  fill: none;
  stroke: #555555;
  stroke-width: 1.2;
}
.edge.hot {
  stroke: #0000cc;
  stroke-width: 2;
}

/* Tooltip: styled like site's popup — plain white box with border */
#tip {
  position: fixed;
  background: #ffffff;
  color: #000000;
  border: 1px solid #333333;
  padding: 0.6rem 0.8rem;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.82rem;
  max-width: 320px;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.12s;
  z-index: 9999;
  box-shadow: 2px 2px 6px rgba(0,0,0,0.18);
  line-height: 1.45;
}
#tip.show { opacity: 1; }
#tip .tn { font-weight: bold; font-size: 0.88rem; display: block; margin-bottom: 0.2rem; }
#tip .td { color: #333; }
#tip .ts { color: #555; margin-top: 0.1rem; }
#tip .tx { color: #444; margin-top: 0.25rem; font-style: italic; font-size: 0.8rem; }
#tip .tl { color: #0000cc; font-size: 0.75rem; margin-top: 0.35rem; }
#tip hr  { border: none; border-top: 1px solid #cccccc; margin: 0.3rem 0; }