frontend/src/Components/AiComponents/ChatComponents/Graph.css

/* Fullscreen overlay */
.graph-dialog-container {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100vh !important;
  background-color: rgba(0, 0, 0, 0.2) !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  z-index: 1000 !important;
  overflow: hidden !important;
}

/* Inner dialog container */
.graph-dialog-inner {
  position: relative !important;
  border-radius: 12px !important;
  padding: 1rem !important;
  width: 45% !important;
  max-width: 100% !important;
  background-color: #1e1e1e !important;
  min-height: 80vh !important;
  overflow: hidden !important; /* Prevent scrolling */
}

/* Header styling */
.graph-dialog-header {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  padding: 16px !important;
  background-color: #1e1e1e !important;
  color: #fff !important;
}

/* Title styling */
.graph-dialog-title {
  font-weight: bold !important;
  font-size: 1.5rem !important;
  margin: 0 !important;
}

/* Close button styling */
.graph-dialog .close-btn {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  background: none !important;
  color: white !important;
  padding: 7px !important;
  border-radius: 5px !important;
  cursor: pointer !important;
}
.graph-dialog-close-btn:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: white !important;
}

/* Content area */
.graph-dialog-content {
  padding: 0 !important;
  background-color: #1e1e1e !important;
  height: 550px !important;
  overflow: hidden !important;
}

/* Loading state */
.graph-loading {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  height: 50% !important;
  color: #fff !important;
}

/* Error message */
.graph-error {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  height: 50% !important;
  color: red !important;
}