.baklava-connection {
    stroke: var(--baklava-color-connection-default);
    stroke-width: 2px;
    fill: none;

    &.--temporary {
        stroke-width: 4px;
        stroke-dasharray: 5 5;
        stroke-dashoffset: 0;
        animation: dash 1s linear infinite;
        transform: translateY(-1px);
    }

    @keyframes dash {
        to {
            stroke-dashoffset: 20;
        }
    }

    &.--allowed {
        stroke: var(--baklava-color-connection-allowed);
    }

    &.--forbidden {
        stroke: var(--baklava-color-connection-forbidden);
    }
}
