/* Bare variant: no background/border (used in JEI grid) */
.slotBare {
  cursor: default;
  position: relative;
  overflow: visible;
}

.slot {
  cursor: default;
  position: relative;
  overflow: visible;
}

.hovered::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.4);
  pointer-events: none;
}

.highlighted::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 128, 0.4);
  pointer-events: none;
}

.dragTarget::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.3);
  pointer-events: none;
}

.resultSlot {
  background: #8b8b8b;
}

.disabled {
  cursor: not-allowed;
  opacity: 0.5;
}

.emptyLabel {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255, 255, 255, 0.3);
  font-family: 'Minecraft', monospace;
  text-align: center;
  pointer-events: none;
  font-size: 0.6em;
}

/* Mobile overlay backdrop */
.mobileOverlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0, 0, 0, 0.3);
}

.mobileMenu {
  display: flex;
  flex-direction: column;
  background: #282828;
  border: 2px solid #555555;
  font-family: 'Minecraft', monospace;
  image-rendering: pixelated;
  z-index: 10001;
}

.mobileMenuInfo {
  margin-bottom: 4px;
  flex-shrink: 0;
}

.mobileBtn {
  background: #404040;
  color: #ffffff;
  border: 1px solid #666666;
  cursor: pointer;
  padding: 4px 8px;
  font-family: inherit;
  font-size: inherit;
  text-align: left;
  transition: background 0.1s;
}

.mobileBtn:hover,
.mobileBtn:active {
  background: #555555;
}

.mobileBtnDanger {
  color: #ff5555;
  border-color: #aa0000;
}

.mobileBtnDanger:hover,
.mobileBtnDanger:active {
  background: #330000;
}