select,
input {
  width: 100%;
  min-height: 30px;
  border: 1px solid var(--border-soft);
  border-radius: 3px;
  background: var(--bg-surface-soft);
  color: var(--text-main);
  font: inherit;
  padding: 5px 8px;
}

select:focus,
input:focus {
  border-color: var(--border-strong);
  outline: none;
}

.field label,
.label {
  display: block;
  margin-bottom: 4px;
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
}

.save-button {
  height: 30px;
  border: 1px solid rgba(94, 184, 255, 0.42);
  border-radius: 3px;
  background: rgba(94, 184, 255, 0.12);
  color: #e8f4ff;
  cursor: pointer;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.save-button:hover {
  background: rgba(94, 184, 255, 0.18);
}

.message {
  margin-top: 12px;
  padding: 9px 10px;
  border: 1px solid var(--border-soft);
  background: var(--bg-surface);
  color: var(--text-secondary);
  font-size: 12px;
}

.message.ok {
  border-color: rgba(60, 184, 120, 0.4);
  color: #c8efd8;
}

.message.error {
  border-color: rgba(240, 74, 80, 0.4);
  color: #ffc4c7;
}