*,
*::after,
*::before {
  box-sizing: border-box;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
    monospace;
}

.btn-noborder {
  border: none;
  padding: 0;
  outline: none;
  background: transparent;
}

.react-flow__node {
  background: transparent !important;
  border: none !important;
}

.react-flow__node-default {
  width: fit-content;
  padding: 0px;
  font-weight: 600;
  background: transparent !important;
  display: flex;
  justify-content: center;
  align-items: center;
  border: none;
  border-color: transparent !important;
}

.react-flow__node-default.selectable:focus,
.react-flow__node-default.selectable.selected,
.react-flow__node-default.selectable:hover {
  box-shadow: 0 0 0 0 #ffffff !important;
}

.react-flow__controls-button {
  background: hsl(var(--controls)) !important;
  color: hsl(var(--foreground)) !important;
  border-bottom: 1px solid hsl(var(--controls-border)) !important;
}

.react-flow__controls-button:hover {
  background: hsl(var(--controls-hover)) !important;
}

.react-flow__controls-button svg {
  fill: currentColor !important;
}

.react-flow__edge-path {
  stroke-width: 1.5;
}

.CollapsibleContent {
  overflow: hidden;
}
.CollapsibleContent[data-state="open"] {
  animation: slideDown 225ms ease-in-out;
}
.CollapsibleContent[data-state="closed"] {
  animation: slideUp 225ms ease-in-out;
}

@keyframes slideDown {
  from {
    height: 0;
  }
  to {
    height: var(--radix-collapsible-content-height);
  }
}

@keyframes slideUp {
  from {
    height: var(--radix-collapsible-content-height);
  }
  to {
    height: 0;
  }
}
