@import "tailwindcss";

:root {
  --background: #0f1117;
  --foreground: #e1e4e8;
  --card: #161b22;
  --card-foreground: #e1e4e8;
  --border: #30363d;
  --muted: #8b949e;
  --primary: #58a6ff;
  --destructive: #da3633;
  --success: #238636;
}

body {
  background-color: var(--background);
  color: var(--foreground);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}

/* Native <select> popups otherwise fall back to the OS default (light)
   background while inheriting the light theme text — unreadable. Pin both. */
select {
  color: var(--foreground);
}
select option {
  background-color: var(--card);
  color: var(--foreground);
}

/* System Map: make a selected edge unmistakable — thicken it and lay a bright
   halo behind the colored stroke so the current selection reads at a glance
   before a Backspace/Delete removes it. */
.react-flow__edge.selected .react-flow__edge-path {
  stroke-width: 3.5;
  filter: drop-shadow(0 0 5px rgba(240, 246, 252, 0.9));
}
.react-flow__edge:hover .react-flow__edge-path {
  stroke-width: 3;
  cursor: pointer;
}