/* circuit schematic editor.
   A component is a <g class="ckt-part"> that paints no stroke itself, so (mindmap pattern) the
   hover/selection outline is relayed onto the group's inner symbol shapes — the whole symbol
   highlights, not one path. Wires are a single <polyline> and take the outline directly. */

/* the group is clickable across its whole cell via a transparent .ckt-hit rect inside it */
.dia-circuit .flow-canvas g.ckt-part { cursor: pointer; }
.dia-circuit .flow-canvas .ckt-hit { pointer-events: all; }
.dia-circuit .flow-canvas .ckt-wire { cursor: pointer; }

/* wires: outline straight onto the polyline */
.dia-circuit .flow-canvas .ckt-wire.dia-pick-hover { stroke: rgba(59, 110, 246, 0.5) !important; stroke-width: 4px !important; }
.dia-circuit .flow-canvas .ckt-wire.dia-pick-sel { stroke: var(--accent, #3b6ef6) !important; stroke-width: 4px !important; }

/* components: relay the outline to every inner shape so the full symbol lights up */
.dia-circuit .flow-canvas g.ckt-part.dia-pick-hover line,
.dia-circuit .flow-canvas g.ckt-part.dia-pick-hover polyline,
.dia-circuit .flow-canvas g.ckt-part.dia-pick-hover path,
.dia-circuit .flow-canvas g.ckt-part.dia-pick-hover circle {
  stroke: rgba(59, 110, 246, 0.6) !important;
}
.dia-circuit .flow-canvas g.ckt-part.dia-pick-sel line,
.dia-circuit .flow-canvas g.ckt-part.dia-pick-sel polyline,
.dia-circuit .flow-canvas g.ckt-part.dia-pick-sel path,
.dia-circuit .flow-canvas g.ckt-part.dia-pick-sel circle {
  stroke: var(--accent, #3b6ef6) !important;
}
/* filled parts (diode/led triangle, node dot, switch pins) turn accent too when selected */
.dia-circuit .flow-canvas g.ckt-part.dia-pick-sel path[fill]:not([fill="none"]),
.dia-circuit .flow-canvas g.ckt-part.dia-pick-sel circle[fill]:not([fill="none"]) {
  fill: var(--accent, #3b6ef6) !important;
}
.dia-circuit .flow-canvas g.ckt-part.dia-pick-hover path[fill]:not([fill="none"]),
.dia-circuit .flow-canvas g.ckt-part.dia-pick-hover circle[fill]:not([fill="none"]) {
  fill: rgba(59, 110, 246, 0.6) !important;
}

/* the rendered schematic sits nicely centred in the preview panes */
.ckt-svg { display: block; max-width: 100%; height: auto; }
