/* Seepferdchen Service Radebeul – Hinweise der Formularprüfung */
.formular input, .formular select, .formular textarea { scroll-margin-top: 110px; transition: border-color .15s ease; }

.feld.hat-fehler input,
.feld.hat-fehler select,
.feld.hat-fehler textarea { border-color: #c0392b; background: #fffafa; }
.feld.hat-fehler input:focus,
.feld.hat-fehler textarea:focus { outline-color: rgba(192, 57, 43, .2); }

.feld.ist-ok input,
.feld.ist-ok textarea { border-color: #3c9a5f; }

.feld-fehler {
  display: flex; gap: 6px; align-items: flex-start;
  margin-top: 6px; color: #a52a1f; font-size: .88rem; font-weight: 700; line-height: 1.35;
}
.feld-fehler::before {
  content: "!"; flex: none; display: inline-grid; place-items: center;
  width: 17px; height: 17px; margin-top: 1px; border-radius: 50%;
  background: #a52a1f; color: #fff; font-size: .72rem; font-weight: 800;
}
.feld-fehler[hidden] { display: none; }

.check.hat-fehler span { color: #a52a1f; }
.check.hat-fehler input { outline: 2px solid #c0392b; outline-offset: 1px; }
.check + .feld-fehler { grid-column: 1 / -1; margin-top: -8px; }

.feld .opt--pflicht { color: inherit; font-weight: 700; }
