/* LeadMagnet Newsletter – Frontend-Formular.
 * Bei style="theme" wird bewusst minimal gestylt, damit das Theme bzw.
 * Elementor/YOOtheme das Aussehen der Felder übernimmt.
 */

.lmn-form-wrap {
	margin: 1em 0;
}

.lmn-form .lmn-field {
	margin: 0 0 1em;
}

.lmn-form .lmn-field label {
	display: block;
	margin-bottom: 0.25em;
}

.lmn-form .lmn-field-consent label {
	display: flex;
	align-items: flex-start;
	gap: 0.5em;
	font-size: 0.85em;
	line-height: 1.5;
}

.lmn-form .lmn-field-consent input[type="checkbox"] {
	margin-top: 0.2em;
	flex: 0 0 auto;
}

/* "plain"-Stil: eigenständiges, neutrales Aussehen ohne Theme-Abhängigkeit. */
.lmn-style-plain .lmn-field input[type="text"],
.lmn-style-plain .lmn-field input[type="email"] {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7em 0.9em;
	border: 1px solid #ccc;
	border-radius: 6px;
	font-size: 1em;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.lmn-style-plain .lmn-field input[type="text"]:focus,
.lmn-style-plain .lmn-field input[type="email"]:focus {
	outline: none;
	border-color: var( --lmn-accent, #2563eb );
	box-shadow: 0 0 0 3px rgba( 37, 99, 235, 0.18 );
}

.lmn-style-plain .lmn-submit {
	display: inline-block;
	padding: 0.7em 1.4em;
	border: 0;
	border-radius: 6px;
	background: var( --lmn-accent, #2563eb );
	color: #fff;
	font-size: 1em;
	cursor: pointer;
}

.lmn-style-plain .lmn-submit:hover {
	filter: brightness( 0.92 );
}

/* Theme-Stil: Felder volle Breite, Rest erbt vom Theme. */
.lmn-style-theme .lmn-field input[type="text"],
.lmn-style-theme .lmn-field input[type="email"] {
	width: 100%;
	box-sizing: border-box;
}

/* Hinweise. */
.lmn-notice {
	padding: 0.8em 1.1em;
	border-radius: 8px;
	border-left: 4px solid transparent;
	margin-bottom: 1em;
}

.lmn-notice-success {
	background: #ecfdf5;
	border: 1px solid #a7f3d0;
	border-left: 4px solid #10b981;
	color: #065f46;
}

.lmn-notice-error {
	background: #fef2f2;
	border: 1px solid #fecaca;
	border-left: 4px solid #ef4444;
	color: #991b1b;
}

.lmn-ajax-message:not(:empty) {
	margin-top: 0.75em;
	padding: 0.7em 1em;
	border-radius: 8px;
	border-left: 4px solid transparent;
}

.lmn-ajax-message.lmn-is-success {
	background: #ecfdf5;
	border-left-color: #10b981;
	color: #065f46;
}

.lmn-ajax-message.lmn-is-error {
	background: #fef2f2;
	border-left-color: #ef4444;
	color: #991b1b;
}

.lmn-form .lmn-submit:disabled {
	opacity: 0.65;
	cursor: not-allowed;
}

.lmn-form.lmn-loading {
	opacity: 0.75;
	pointer-events: none;
}

/* Lade-Spinner im Submit-Button (Farbe folgt dem Button-Text). */
.lmn-form.lmn-loading .lmn-submit {
	position: relative;
	padding-right: 2.6em;
}
.lmn-form.lmn-loading .lmn-submit::after {
	content: "";
	position: absolute;
	right: 0.9em;
	top: 50%;
	width: 14px;
	height: 14px;
	margin-top: -7px;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	opacity: 0.8;
	animation: lmn-spin 0.6s linear infinite;
}
@keyframes lmn-spin {
	to { transform: rotate( 360deg ); }
}

/* Einwilligungs-Zeile etwas ruhiger absetzen. */
.lmn-form .lmn-field-consent {
	font-size: 0.9em;
	color: inherit;
	opacity: 0.95;
}

/* ------------------------------------------------------------------ */
/* Fertige No-Code-Designs. Greifen unabhängig vom Basis-Stil und nutzen
 * die Akzentfarbe (--lmn-accent) aus den Einstellungen. */
/* ------------------------------------------------------------------ */

/* Gemeinsame Feld-/Button-Basis für alle Fertigdesigns. */
[class*="lmn-design-"] .lmn-field input[type="text"],
[class*="lmn-design-"] .lmn-field input[type="email"] {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7em 0.9em;
	border: 1px solid #cbd5e1;
	border-radius: 8px;
	font-size: 1em;
	background: #fff;
	color: #1f2937;
}
[class*="lmn-design-"] .lmn-field input:focus {
	outline: none;
	border-color: var( --lmn-accent, #2563eb );
	box-shadow: 0 0 0 3px color-mix( in srgb, var( --lmn-accent, #2563eb ) 25%, transparent );
}
[class*="lmn-design-"] .lmn-submit {
	display: inline-block;
	width: 100%;
	padding: 0.8em 1.4em;
	border: 0;
	border-radius: 8px;
	background: var( --lmn-accent, #2563eb );
	color: #fff;
	font-size: 1.02em;
	font-weight: 600;
	cursor: pointer;
	transition: filter 0.15s ease, transform 0.05s ease;
}
[class*="lmn-design-"] .lmn-submit:hover { filter: brightness( 0.92 ); }
[class*="lmn-design-"] .lmn-submit:active { transform: translateY( 1px ); }
[class*="lmn-design-"] .lmn-form-title { margin: 0 0 0.3em; }
[class*="lmn-design-"] .lmn-form-desc { margin: 0 0 1.1em; opacity: 0.8; }

/* Card: weiße Karte mit Schatten. */
.lmn-design-card {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	padding: 28px 26px;
	box-shadow: 0 10px 30px rgba( 0, 0, 0, 0.08 );
	max-width: 460px;
}

/* Rounded: pillenförmige Felder & Button. */
.lmn-design-rounded .lmn-field input,
.lmn-design-rounded .lmn-submit { border-radius: 999px; }
.lmn-design-rounded .lmn-field input { padding-left: 1.1em; padding-right: 1.1em; }

/* Bold: kräftige Ränder, große Schrift. */
.lmn-design-bold .lmn-field input { border-width: 2px; border-color: #111; border-radius: 6px; }
.lmn-design-bold .lmn-submit { border-radius: 6px; font-size: 1.1em; letter-spacing: 0.02em; text-transform: uppercase; }
.lmn-design-bold .lmn-form-title { font-weight: 800; }

/* Dark: dunkle Karte, helle Schrift. */
.lmn-design-dark {
	background: #0f172a;
	border-radius: 14px;
	padding: 28px 26px;
	max-width: 460px;
	color: #e2e8f0;
}
.lmn-design-dark .lmn-form-title,
.lmn-design-dark .lmn-field label { color: #f8fafc; }
.lmn-design-dark .lmn-field input { background: #1e293b; border-color: #334155; color: #f1f5f9; }
.lmn-design-dark .lmn-field-consent label { color: #cbd5e1; }

/* Gradient: moderner Verlaufs-Button. */
.lmn-design-gradient {
	background: #fff;
	border: 1px solid #eef2ff;
	border-radius: 14px;
	padding: 28px 26px;
	box-shadow: 0 10px 30px rgba( 79, 70, 229, 0.12 );
	max-width: 460px;
}
.lmn-design-gradient .lmn-submit {
	background: linear-gradient( 135deg, var( --lmn-accent, #2563eb ), color-mix( in srgb, var( --lmn-accent, #2563eb ) 55%, #a855f7 ) );
}
