/*
 * ui-lang-overlay.css
 *
 * Semantic positioning for independent floating UI elements.
 */


/* Shared overlay host container*/

#overlays {
  position: fixed;
  inset: 0;
  pointer-events: none;
}


/* Overlay item */

.overlay {
  position: absolute;
  pointer-events: auto;
}


/* Center */

.overlay-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}


/* Edges */

.overlay-top {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.overlay-bottom {
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
}

.overlay-left {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}

.overlay-right {
  top: 50%;
  right: 0;
  transform: translateY(-50%);
}


/* Corners */

.overlay-top-left {
  top: 0;
  left: 0;
}

.overlay-top-right {
  top: 0;
  right: 0;
}

.overlay-bottom-left {
  bottom: 0;
  left: 0;
}

.overlay-bottom-right {
  bottom: 0;
  right: 0;
}


/* Draggable */

.draggable {
  cursor: grab;
  user-select: none;
}

.draggable:active {
  cursor: grabbing;
}