/* ============================================================
   FORMULARE — Inputs, Select, Checkbox
   ============================================================ */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="url"],
input[type="date"],
textarea,
select {
  background: rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 6px;
  padding: 9px 12px;
  color: var(--text-primary);
  font-family: inherit;
  font-size: var(--fs-body);
  width: 100%;
  height: 40px;
  box-sizing: border-box;
  transition: border-color var(--transition);
}

textarea { height: auto; }

/* Safari/Chrome: Kalender-Icon bei type=date an Theme anpassen */
input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(1) brightness(1.6);
  cursor: pointer;
}

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

input::placeholder, textarea::placeholder { color: var(--text-muted); }

/* Select: kein natives Pfeil-Icon, Optionsliste passend zum dunklen Theme */
select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background-image: none;
}
select::-ms-expand { display: none; }
select option {
  background: var(--bg-card);
  color: var(--text-primary);
}

label {
  display: flex;
  align-items: center;
  gap: var(--gap-xs);
  font-size: var(--fs-body);
  color: var(--text-secondary);
}

input[type="checkbox"], input[type="radio"] {
  accent-color: var(--accent);
  width: 16px;
  height: 16px;
}

.form-group { display: flex; flex-direction: column; gap: var(--gap-sm); }
.form-row   { display: flex; gap: var(--gap-sm); }