/* Studio-1-Formulare: Layout kommt KOMPLETT aus den bestehenden
   .ac-campain-Regeln in style.css (gleiche Klassen wie die AC-Forms).
   Hier nur: Honeypot verstecken + Status-Meldung. */
.s1-form .s1-hp { position: absolute; left: -9999px; opacity: 0; height: 0; overflow: hidden; }
.s1-form .s1-msg { margin-top: 12px; font-size: 1rem; }
.s1-form .s1-msg.ok { color: #1c7a3d; }
.s1-form .s1-msg.err { color: #B94A48; }

/* --- Bewerbungsformular mit Unterlagen-Upload (ersetzt Formidable, 07/2026) ---
   Bewusst auf .s1-form--bewerbung begrenzt: E-Mail ist in allen anderen
   Formularen volle Breite und soll es bleiben. */
.s1-form--bewerbung ._form_element:has([for*="s1-phone"]),
.s1-form--bewerbung ._form_element:has([for*="s1-email"]) {
  flex: 1 1 calc(50% - 10px);
}

/* --- Datei-Auswahl ---
   Das native Feld wird nur optisch versteckt (nicht display:none), damit es
   fokussierbar bleibt; sichtbarer Knopf ist das zugehoerige <label>. Damit
   entfaellt auch die native «4 Dateien»-Anzeige — die Auswahl steht unten in
   der eigenen Liste.
   Hover-Farbe ist #FF788E: das Olivgruen in .ac-campain ._submit:hover ist
   toter Code, eine spaetere Regel ueberschreibt es site-weit per !important. */
.s1-form .s1-file-input {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: 0;
  opacity: 0;
  overflow: hidden;
}

.s1-form .s1-file-trigger {
  display: inline-block;
  padding: 10px 22px;
  border: 1px solid #09384C;
  background: #fff;
  color: #09384C;
  font-family: 'Flama', sans-serif;
  font-size: 0.9375rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  cursor: pointer;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* Sekundaer neben dem Submit-Button, aber gleiche Hover-Sprache wie alle
   Studio-1-CTAs. :focus-visible am versteckten Input faerbt den Knopf mit. */
.s1-form .s1-file-trigger:hover,
.s1-form .s1-file-input:focus-visible + .s1-file-trigger {
  background: #FF788E;
  border-color: #FF788E;
  color: #fff;
}

.s1-form .s1-upload-hint {
  margin: 8px 0 0;
  font-size: 0.875rem;
  color: #4a4a4a;
}

/* Liste bewusst aus <div>s statt <ul>/<li>: die Theme-Regeln setzen Listen
   site-weit auf list-style:disc mit padding-left, was den Aufzaehlungspunkt
   ueber den Text schiebt. */
.s1-form .s1-upload-list {
  margin: 12px 0 0;
  display: grid;
  gap: 8px;
}

.s1-form .s1-file {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 10px;
  border: 1px solid rgba(74, 74, 74, 0.25);
  background: #fff;
}

.s1-form .s1-file__thumb {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #F1F4F6;
  color: #09384C;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  overflow: hidden;
}

.s1-form .s1-file__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.s1-form .s1-file__body {
  min-width: 0;
  flex: 1 1 auto;
  line-height: 1.35;
}

.s1-form .s1-file__name {
  display: block;
  font-size: 0.875rem;
  color: #09384C;
  word-break: break-word;
}

.s1-form .s1-file__size {
  display: block;
  font-size: 0.8125rem;
  color: #4a4a4a;
}

.s1-form .s1-file--err { border-color: #B94A48; }
.s1-form .s1-file--err .s1-file__size { color: #B94A48; font-weight: 700; }

.s1-form .s1-file__remove {
  flex: 0 0 auto;
  width: 28px;
  height: 28px;
  padding: 0;
  border: none;
  background: transparent;
  color: #4a4a4a;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  transition: color 0.3s ease;
}

.s1-form .s1-file__remove:hover { color: #B94A48; }

@media (max-width: 768px) {
  .s1-form--bewerbung ._form_element:has([for*="s1-phone"]),
  .s1-form--bewerbung ._form_element:has([for*="s1-email"]) {
    flex: 1 1 100% !important;
  }
}

/* Puffer unter dem Formular im Fokus-Fenster (Roman 27.07.2026, iPhone).
   Im Fokus-Modus ist das Formular das LETZTE Element des Scroll-Containers,
   der selbst kein padding-bottom hat — der Senden-Knopf klebt also am
   Dokumentende. Mobil liegen dort drei fixe Ebenen uebereinander: die
   Safari-Leiste, der Ticker-Balken (z-index 90) und der Chat-Knopf. Ergebnis:
   «Unterlagen senden» ist verdeckt und nicht klickbar — auf einem
   Bewerbungsformular ein Blocker. Der Puffer laesst den Knopf ueber diese
   Ebenen hinausscrollen; safe-area deckt zusaetzlich die Home-Indicator-Zone. */
.us_focus-window .s1-form {
  padding-bottom: calc(48px + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 900px) {
  .us_focus-window .s1-form {
    padding-bottom: calc(180px + env(safe-area-inset-bottom, 0px));
  }
}