.custom-zone-btn {
  --bs-btn-bg: #fffbe6;
  --bs-btn-color: #000;
  --bs-btn-border-color: #ffe58f;

  --bs-btn-hover-bg: #fff3bf;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-border-color: #ffe58f;

  --bs-btn-active-bg: #ffe58f;
  --bs-btn-active-color: #000;
  --bs-btn-active-border-color: #ffd43b;

  --bs-btn-focus-shadow-rgb: 255, 212, 59;

  transition: transform 0.18s ease, box-shadow 0.18s ease;
}

.custom-zone-btn:hover {
  transform: scale(1.10);
  font-weight: 500;
  z-index: 1; /* prevents overlap glitches in grid (xpbe: well not so sure but nevermind that for now..)*/
}

.btn-check:checked + .custom-zone-btn {
  box-shadow: 0 0 0 2px rgba(255, 212, 59, 0.35);
  transform: scale(1.03);
  font-weight: 650;
}

.dim-wrapper {
  white-space: nowrap;
}

.dim-input {
  width: 7ch;
  text-align: center;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}