/* ============================================================
   Goldfeder – rf_form.css
   Gemeinsame Regeln fuer Eingabefelder. Auf JEDER Seite mit Formular.

   WARUM ES DAS GIBT (26.08.2026):
   Theresa am Handy: „Klassenkasse wirkt unten bei Datum nicht sauber
   formatiert - das geht raus" und „bei Konferenz ueberschneidet sich was
   bei Datum und Anlegen".

   WAS DAHINTERSTECKT:
   Safari am iPhone behandelt `input[type=date]` als Sonderfall. Das Feld hat
   dort eine EIGENE Mindestbreite (das Datumsformat plus Kalendersymbol) und
   laesst sich mit `width:100%` nicht schmaler machen. In einer Zeile mit
   Nachbarn drueckt es diese hinaus oder schiebt sich darueber.

   ⚠️ AM RECHNER SIEHT MAN DAS NICHT. Chrome am Schreibtisch macht das Feld
   brav schmal. Alle 24 Seiten wurden bei 375px vermessen: kein Ueberstand,
   keine Ueberschneidung - und trotzdem hatte Theresa recht. Wer das hier
   aendert, prueft es an einem echten iPhone nach, nicht im Testbrowser.

   Zwei Massnahmen:
   1. Das Datumsfeld verliert sein Sonderverhalten (`appearance:none`) und
      darf schrumpfen (`min-width:0`).
   2. Unter 430px steht in einer Formularzeile nur noch EIN Feld. Lieber ein
      Feld mehr untereinander als zwei, die sich ins Gehege kommen.
   ============================================================ */

/* 1) Datums- und Zeitfelder duerfen schrumpfen ---------------------------- */
input[type="date"],
input[type="time"],
input[type="month"],
input[type="week"],
input[type="datetime-local"]{
  -webkit-appearance:none;
  appearance:none;
  min-width:0;
  width:100%;
  /* Safari zentriert den Inhalt sonst und laesst rechts Luft stehen. */
  text-align:left;
}
/* Das Kalendersymbol in Safari nicht zusaetzlich Platz greifen lassen. */
input[type="date"]::-webkit-date-and-time-value{ text-align:left; min-width:0 }
input[type="date"]::-webkit-calendar-picker-indicator{ margin-left:0 }

/* 2) Nichts darf breiter werden als sein Platz --------------------------- */
input, select, textarea{ max-width:100% }
/* Flex-Kinder schrumpfen nur, wenn man es ihnen ausdruecklich erlaubt.
   Ohne min-width:0 ist die Inhaltsbreite die Untergrenze - genau die Falle. */
.row > *{ min-width:0 }

/* 3) Am Handy: ein Feld je Zeile ----------------------------------------- */
@media (max-width:430px){
  .row{ flex-direction:column; align-items:stretch; gap:10px }
  .row > *{ width:100%; flex:1 1 auto !important; min-width:0 !important }
  /* Knoepfe, die in einer Formularzeile stehen (z. B. „Anlegen" bei den
     Konferenzen), sitzen dann sauber darunter statt daneben. */
  .row > button, .row > .btn{ width:100% }
}