/* ============================================================================
   Datei-Upload-Formular · Ergänzungen zu style.css
   ============================================================================
   Eigene Datei statt Erweiterung von style.css: der Claude-Zugriff auf dieses
   Archiv kann Google-Drive-Dateien nur NEU anlegen, keinen bestehenden Inhalt
   in-place ändern. Wer mag, kann diese paar Regeln bei Gelegenheit von Hand in
   style.css übernehmen (Abschnitt "Formulare") und diese Datei dann löschen -
   technisch macht es keinen Unterschied, es sind zwei zusätzliche Selektoren
   auf denselben CSS-Variablen wie die restliche Seite.
   ============================================================================ */

.form-hint {
  margin: 0.35em 0 0;
  font-size: 0.85rem;
  color: var(--color-grey);
}

.contact-form input[type="file"] {
  padding: 0.6em;
  background: var(--color-white);
  cursor: pointer;
}

/* "Datei auswaehlen"-Button des nativen Datei-Feldes: gleiche Form wie .btn
   (Radius, Schrift, Uebergang), aber dunkelgrau statt Akzentfarbe, damit er
   sich klar vom roten Submit-Button "Datei(en) jetzt hochladen" abhebt. */
.contact-form input[type="file"]::file-selector-button,
.contact-form input[type="file"]::-webkit-file-upload-button {
  display: inline-block;
  background: var(--color-text);
  color: var(--color-white);
  font-family: var(--font-heading);
  font-size: 0.95em;
  padding: 0.6em 1.4em;
  margin-right: 1em;
  border-radius: 5px;
  border: 0;
  cursor: pointer;
  transition: background-color 0.15s ease;
}
.contact-form input[type="file"]::file-selector-button:hover,
.contact-form input[type="file"]::-webkit-file-upload-button:hover {
  background: var(--color-black);
}

.upload-progress {
  height: 10px;
  background: var(--color-bg-light);
  border-radius: 5px;
  overflow: hidden;
  margin: 0.5em 0;
}
.upload-progress-bar {
  display: block;
  height: 100%;
  width: 0%;
  background: var(--color-accent);
  transition: width 0.2s ease;
}