#temp-edge {
    pointer-events: none;
    stroke-dasharray: none;
    stroke: #2d3748;
    stroke-width: 2;

}

#temp-edge.dashed {
    stroke-dasharray: 5,5 !important;
}

#temp-edge.warning {
    stroke: #dc2626 !important;
}

.edge-straight {
    stroke: #666;
    stroke-width: 2;
    pointer-events: none;
}

.edge-straight-hit-area {
    stroke: transparent;
    stroke-width: 15;
    cursor: pointer;
}

g.selected .edge-straight {
    stroke: var(--selection-border-color);
    stroke-width: 2;
    fill: none;
}

g.focused .edge-straight {
    stroke: var(--selection-border-color);
    stroke-width: 3;
    fill: none;
}

.edge-bezier {
    stroke: #666;
    stroke-width: 2;
    fill: none;
    transition: stroke 0.2s, stroke-width 0.2s;
    pointer-events: none;
}

.edge-bezier-hit-area {
    stroke: transparent;
    stroke-width: 15;
    fill: none;
    cursor: pointer;
    pointer-events: visibleStroke;
}

g.selected .edge-bezier {
    stroke: var(--selection-border-color);
    stroke-width: 2;
    fill: none;
}

g.focused .edge-bezier {
    stroke: var(--selection-border-color);
    stroke-width: 3;
    fill: none;
}

.edge-rectilinear {
    stroke: #666;
    stroke-width: 2;
    fill: none;
    transition: stroke 0.2s, stroke-width 0.2s;
    pointer-events: none;
}

.edge-rectilinear-hit-area {
    stroke: transparent;
    stroke-width: 15;
    fill: none;
    cursor: pointer;
    pointer-events: visibleStroke;
}

g.selected .edge-rectilinear {
    stroke: var(--selection-border-color);
    stroke-width: 2;
    fill: none;
}

g.focused .edge-rectilinear {
    stroke: var(--selection-border-color);
    stroke-width: 3;
    fill: none;
}

g.warning .edge-bezier,
g.warning .edge-rectilinear,
g.warning .edge-straight {
    stroke: #dc2626 !important;
    stroke-dasharray: 5 5 !important;
}