stackrender/src/styles/globals.css

.react-flow__attribution {
  display: none;
}



.text-editable {
  @apply dark:group-hover:bg-content1 group-hover:bg-background border-[0.5px] border-transparent group-hover:border-primary-300 dark:group-hover:ring-divider rounded-sm cursor-pointer;
}


.react-flow__node.selected {
  transition: box-shadow 0.3s ease;
  /* Add transition */
  /* box-shadow: 0px 0px 15px 0px hsl(var(--heroui-secondary-50)), 0px 2px 30px 0px hsl(var(--heroui-secondary-50)), 0px 0px 1px 0px hsl(var(--heroui-secondary-50));
*/
}

.noselect {
  user-select: none;
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* IE10+/Edge */
}


html,
body {

  user-select: none;
  -webkit-user-select: none;
  /* Safari */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;

}


.selectable {
  user-select: text;
  -webkit-user-select: text;
  /* Safari */
  -moz-user-select: text;
  /* Firefox */
  -ms-user-select: text;
  /* IE/Edge */
}

.react-flow__renderer {
  cursor: default !important;
  /* or pointer, grab, etc. */
}

.sidebar-item[data-active="true"] svg {
  color: hsl(var(--heroui-primary));

}

div[data-slot="input-wrapper"] {
  outline: none;
  border-width: 1px;

}

div[data-slot="mainWrapper"] button[data-slot="trigger"] {

  outline: none;
  border-width: 1px;
}


div[data-slot="content"] hr[role="separator"] {
  display: none;
}



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



/* Target the scrollbar */
::-webkit-scrollbar {
  width: 6px;
  /* Width of the scrollbar */

}

/* Track (background of the scrollbar) */


/* Handle (the scroll thumb) */
::-webkit-scrollbar-thumb {
  background: hsl(var(--heroui-scrollbar));
  /* Darker gray */
  border-radius: 6px;
  /* Rounded corners */

}



/* Handle on hover */
::-webkit-scrollbar-thumb:hover {

  background: hsl(var(--heroui-scrollbar-hover));
  /* Darker on hover */
}



.react-flow__node {
  cursor: grab !important;
}

.react-flow__node:active {
  cursor: grabbing !important;
}

.react-flow__pane {
  cursor: default !important;
}




.database-checkbox[data-selected="true"] {
  border: 1.5px solid hsl(var(--heroui-primary-300));
}



thead[role="rowgroup"] th {
  border-radius: 0px !important;

}

thead[role="rowgroup"] th:last-child {
  border-radius: 0px 4px 4px 0px !important;

}

thead[role="rowgroup"] th:first-child {
  border-radius: 4px 0px 0px 4px !important;
}

tbody[role="rowgroup"] tr td::before {
  display: none;
}


tbody[role="rowgroup"] tr td {
  border-radius: 0px;
}


tbody[role="rowgroup"] tr td:last-child {
  border-radius: 0px 4px 4px 0px !important;

}

tbody[role="rowgroup"] tr td:first-child {
  border-radius: 4px 0px 0px 4px !important;

}

.cm-editor {

  min-width: 100% !important;
}


.cm-scroller::-webkit-scrollbar {
  height: 6px;
}

button[data-testid="remove"] {

  top: 1px;
  position: relative;
}

button[data-testid="remove"]:after {
  content: '×';
  color: white;
  font-size: 11px;
  position: relative;
  top: -2px;


}

button[data-testid="remove"] svg {
  display: none;
}

[data-invalid="true"] div[data-slot="input-wrapper"] {
  border: 1px solid red !important;
  background-color: transparent;
  outline: none;
}

 
div[data-slot="calendar"] div[data-slot="input-wrapper"]{
  background-color: hsl(var(--heroui-default));
  border : hsl(var(--heroui-divider))
}