/* React Flow基础样式覆盖 */
.react-flow__node {
  transition: all 0.2s ease;
}

.react-flow__node.selected {
  z-index: 2;
}

/* Handle样式优化 */
.react-flow__handle {
  border: 2px solid white;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  transition: all 0.2s ease;
}

.react-flow__handle:hover {
  transform: scale(1.2);
}

.react-flow__handle.react-flow__handle-left {
  left: -6px;
}

.react-flow__handle.react-flow__handle-right {
  right: -6px;
}

.react-flow__handle.react-flow__handle-top {
  top: -6px;
}

.react-flow__handle.react-flow__handle-bottom {
  bottom: -6px;
}

/* 边缘样式 */
.react-flow__edge-path {
  stroke-width: 2;
  transition: stroke-width 0.2s ease;
}

.react-flow__edge:hover .react-flow__edge-path {
  stroke-width: 3;
}

/* 控制面板样式 */
.react-flow__controls {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.react-flow__controls-button {
  border: none;
  background: white;
  transition: all 0.2s ease;
}

.react-flow__controls-button:hover {
  background: #f3f4f6;
  transform: scale(1.05);
}

/* 小地图样式 */
.react-flow__minimap {
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* 背景样式 */
.react-flow__background {
  background-color: #f9fafb;
}

/* 选择框样式 */
.react-flow__selection {
  background: rgba(59, 130, 246, 0.1);
  border: 1px solid #3b82f6;
}

/* 节点工具栏样式 */
.react-flow__node-toolbar {
  background: white;
  border-radius: 6px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  border: 1px solid #e5e7eb;
}

/* Ant Design组件在React Flow中的z-index修复 */
.ant-select-dropdown,
.ant-tooltip,
.ant-popover {
  z-index: 9999 !important;
}

/* 确保拖拽时的视觉效果 */
.react-flow__node.dragging {
  box-shadow: 0 10px 25px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* 防止选中文本 */
.react-flow__node * {
  user-select: none;
}

.react-flow__node input,
.react-flow__node textarea {
  user-select: text;
}

/* 连接线动画 */
.react-flow__edge.animated .react-flow__edge-path {
  stroke-dasharray: 5;
  animation: dashdraw 0.5s linear infinite;
}

@keyframes dashdraw {
  0% {
    stroke-dashoffset: 10;
  }
}

/* 节点面板滚动条样式 */
.node-panel-scroll::-webkit-scrollbar {
  width: 6px;
}

.node-panel-scroll::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 3px;
}

.node-panel-scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 3px;
}

.node-panel-scroll::-webkit-scrollbar-thumb:hover {
  background: #94a3b8;
}

/* 响应式设计 */
@media (max-width: 768px) {
  .react-flow__controls {
    bottom: 10px;
    right: 10px;
  }
  
  .react-flow__minimap {
    bottom: 10px;
    left: 10px;
    width: 150px !important;
    height: 100px !important;
  }
}