.scan-input {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 56px;
  gap: 8px;
}

.scan-input .keyboard-button {
  height: 56px;
  min-height: 56px;
  background: var(--teal);
  color: #fff;
  font-size: 1.45rem;
  line-height: 1;
}

.result.warning {
  border-top-color: var(--amber);
}

.result.warning .state {
  color: #855800;
}

.result.warning {
  border-top-width: 1px;
  box-shadow: none;
}

.result.warning .state {
  min-height: 0;
  padding: 8px 10px;
  font-size: .82rem;
  line-height: 1.25;
}

#receiving-form {
  padding-bottom: 4px;
}

#receiving-result .result.warning {
  margin-top: 0;
}

.result.error {
  border-top-width: 1px;
  box-shadow: none;
}

.result.error .state {
  min-height: 0;
  padding: 8px 10px 8px 40px;
  align-items: flex-start;
  font-size: .82rem;
  line-height: 1.25;
}

.result.error .state::before {
  left: 10px;
  width: 22px;
  height: 22px;
  font-size: .9rem;
}