/* ==========================================================================
   MERZ-Look für WPForms (alle Formulare der Website, seit 24.09.2026)

   WPForms läuft mit „modernem Markup"; das Aussehen steuern CSS-Variablen am
   Container. Hier die MERZ-Werte — wie zuvor die Elementor-Formulare:
   Felder 48 px, Rahmen #AFAFAF, Radius 5, Fokus Merz-Rot, Knopf Merz-Rot 40 px.

   Ausprägung per CSS-Klasse am WPForms-Widget (Erweitert → CSS-Klassen):
     merz-wpforms--zeile   E-Mail-Feld und Knopf in einer Zeile (Newsletter)
   ========================================================================== */

.wpforms-container {
	--wpforms-field-border-radius: 5px;
	--wpforms-field-border-size: 1px;
	--wpforms-field-border-color: #AFAFAF;
	--wpforms-field-background-color: #FFFFFF;
	--wpforms-field-text-color: #484847;
	--wpforms-field-menu-color: #FFFFFF;
	--wpforms-field-size-input-height: 48px;
	--wpforms-field-size-input-spacing: 18px;
	--wpforms-field-size-font-size: 16px;
	--wpforms-field-size-line-height: 24px;
	--wpforms-field-size-padding-h: 16px;
	--wpforms-field-size-checkbox-size: 18px;
	--wpforms-label-color: #484847;
	--wpforms-label-sublabel-color: #6E6E6D;
	--wpforms-label-error-color: #B51B26;
	--wpforms-label-size-font-size: 16px;
	--wpforms-label-size-line-height: 22px;
	--wpforms-label-size-sublabel-font-size: 14px;
	--wpforms-button-border-radius: 5px;
	--wpforms-button-border-size: 0px;
	--wpforms-button-background-color: #B51B26;
	--wpforms-button-text-color: #FFFFFF;
	--wpforms-button-size-font-size: 16px;
	--wpforms-button-size-height: 40px;
	--wpforms-button-size-padding-h: 22px;
	--wpforms-button-size-margin-top: 8px;
	--wpforms-page-break-color: #B51B26;
	font-family: var(--font-sans);
}
.wpforms-container .wpforms-form .wpforms-field-label { font-weight: 600; }
.wpforms-container .wpforms-form .wpforms-required-label { color: #B51B26; }
.wpforms-container .wpforms-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.wpforms-container .wpforms-form select,
.wpforms-container .wpforms-form textarea { font-family: var(--font-sans); }
.wpforms-container .wpforms-form input:focus,
.wpforms-container .wpforms-form select:focus,
.wpforms-container .wpforms-form textarea:focus {
	border-color: #B51B26 !important;
	box-shadow: 0 0 0 1px #B51B26 !important;
	outline: none;
}
.wpforms-container .wpforms-form input::placeholder,
.wpforms-container .wpforms-form textarea::placeholder { color: #8A8A89; opacity: 1; }
.wpforms-container .wpforms-form input[type="checkbox"] { accent-color: #B51B26; }

/* Knopf: wie EHNES Button primär */
.wpforms-container .wpforms-form button[type="submit"] {
	font-family: var(--font-sans);
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	transition: background-color .15s ease;
}
.wpforms-container .wpforms-form button[type="submit"]:hover,
.wpforms-container .wpforms-form button[type="submit"]:focus { background: #911520 !important; }
.wpforms-container .wpforms-form button[type="submit"]:focus-visible { outline: 3px solid #484847; outline-offset: 3px; }
/* „Abbrechen" in den Popups steht rechts neben dem Senden-Knopf (merz-stellen.js,
   merz-anfrage.js) — gleich hoch wie dieser (--wpforms-button-size-height 40 px). */
.merz-bewerbung__abbrechen .elementor-button,
.merz-anfrage-abbrechen .elementor-button { min-height: 40px; display: inline-flex; align-items: center; }

/* Datei-Upload (Stil „modern"): gestrichelte Ablagefläche wie im Hub */
.wpforms-container .wpforms-uploader {
	border: 2px dashed #AFAFAF !important;
	border-radius: 6px !important;
	background: #FFFFFF !important;
	transition: border-color .15s ease;
}
.wpforms-container .wpforms-uploader:hover { border-color: #B51B26 !important; }
.wpforms-container .wpforms-uploader,
.wpforms-container .wpforms-uploader * { font-family: var(--font-sans, "Source Sans 3", sans-serif); }
.wpforms-container .wpforms-uploader .modern-title { color: #484847; font-size: 16px; font-weight: 600; }
.wpforms-container .wpforms-uploader .modern-title span { color: #B51B26; text-decoration: none !important; }
.wpforms-container .wpforms-uploader .modern-hint { font-size: 14px; }

/* Bestätigung nach dem Absenden */
.wpforms-confirmation-container-full,
div[submit-success] > .wpforms-confirmation-container-full:not(.wpforms-redirection-message) {
	background: #F3F3F3 !important;
	border: 0 !important;
	border-radius: 5px;
	color: #484847 !important;
	font-family: var(--font-sans);
	font-size: 17px;
	line-height: 25px;
	padding: 18px 22px !important;
}
.wpforms-confirmation-container-full p:last-child { margin-bottom: 0; }

/* Ausprägung: eine Zeile (Newsletter) */
.merz-wpforms--zeile .wpforms-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.merz-wpforms--zeile .wpforms-field-container { flex: 1 1 220px; min-width: 0; }
.merz-wpforms--zeile .wpforms-field { padding: 0 !important; }
.merz-wpforms--zeile .wpforms-submit-container { padding: 0 !important; margin: 0 !important; }
/* Knopf so hoch wie das Feld, sonst steht er 8 px tiefer */
.merz-wpforms--zeile .wpforms-submit-container button[type=submit] { height: 48px !important; }
.merz-wpforms--zeile .wpforms-field-label { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* Gesperrte Typen in der Produktanfrage (merz-anfrage.js) */
.merz-anfrage .is-gesperrt { opacity: .45; }
.merz-anfrage .is-gesperrt label,
.merz-anfrage .is-gesperrt input { cursor: not-allowed; }
.merz-anfrage .merz-anfrage-hinweis { display: block; font-size: 13px; line-height: 17px; }