.sg-field,
.sg-select,
.sg-textarea {
  width: 100%;
  border: 1px solid var(--sg-color-border);
  border-radius: var(--sg-radius-md);
  background: #fff;
  padding: 0 var(--sg-space-16);
  color: var(--sg-color-text);
  font: 400 1rem/1.4 var(--sg-font-body);
}

.sg-field,
.sg-select {
  min-height: 3.25rem;
}

.sg-textarea {
  min-height: 8rem;
  padding-top: var(--sg-space-12);
  padding-bottom: var(--sg-space-12);
  resize: vertical;
}

.sg-field:focus-visible,
.sg-select:focus-visible,
.sg-textarea:focus-visible {
  outline: none;
  border-color: var(--sg-color-accent);
  box-shadow: var(--sg-shadow-focus);
}

.sg-help {
  font-size: 0.875rem;
  color: var(--sg-color-text-soft);
}

.sg-notice {
  padding: var(--sg-space-12) var(--sg-space-16);
  border-radius: var(--sg-radius-md);
}

.sg-notice-success {
  background: rgba(31, 122, 67, 0.12);
  color: var(--sg-color-success);
}

.sg-notice-error {
  background: rgba(180, 35, 24, 0.1);
  color: var(--sg-color-error);
}