/**
* Module: react-flow base style overrides.
*/
@import 'reactflow/dist/style.css';

/* stylelint-disable selector-class-pattern */

.react-flow__handle {
  z-index: var(--z-index-navigation);
  cursor: default !important;
  border-radius: 9999px;

  border-color: var(--color-border);
  background-color: var(--color-card);

  .selected & {
    border-color: var(--color-muted-foreground);
  }
}

.react-flow__pane {
  cursor: default;
}

.react-flow__edge {
  cursor: default;
}

.react-flow__attribution {
  font-size: var(--font-size-sm);
  font-family: var(--font-ui);
  font-weight: 400;
  margin: 1rem;

  background-color: transparent;
  color: var(--color-muted-foreground);
}

[class*='react-flow__node-'] {
  &:hover:not(.selected) {
    box-shadow: 0 0 0 2px var(--color-selected) !important;
  }
}