@st-import [root as dragHandleRoot] from '../DragHandle/DragHandle.st.css';
@st-import [B10, B50, B60] from '../Foundation/stylable/colors.st.css';

.root {
  -st-states: newColorsBranding, draggable, dragging, dragDisabled, dim, highlight;
  position: relative;
}

.root:hover:draggable:not(:dragDisabled),
.root:hover:dragging:not(:dragDisabled) {
  background-color: value(B60);
}

.root:hover:newColorsBranding:draggable:not(:dragDisabled),
.root:hover:newColorsBranding:dragging:not(:dragDisabled) {
  background-color: value(B50);
}


.root:focus-visible {
  outline: none;
}

.root:draggable:not(:dragging):not(:dragDisabled) {
  cursor: grab;
}

.root:dragging:not(:dragDisabled) {
  cursor: grabbing;
}

.root:dragging:dim:not(:dragDisabled) {
  opacity: 0.7;
}

.root:hover .dragHandleRoot:not(:disabled) {
  color: value(B10);
}

/* st-namespace-reference="../../../../src/DraggableContainer/DraggableContainer.st.css" */