/* MailerLite Nieuwsbrief - formulierstyling in de branding van Zakelijk Groeien */

.mln-wrap {
	max-width: 420px;
}

/* Velden onder elkaar */
.mln-form {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.mln-field {
	display: flex;
	flex-direction: column;
}

/* Labels visueel verbergen (de tekst staat als placeholder in het veld),
   maar wel beschikbaar houden voor schermlezers. */
.mln-label {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* Tekstvelden: witte achtergrond, zelfde lettertype */
.mln-input {
	font-family: 'Shippori Antique B1', serif;
	background-color: #ffffff;
	color: #1d1d1d;
	border: 1px solid #d6d6d6;
	border-radius: 1000px;
	padding: 10px 14px;
	font-size: 15px;
	line-height: 1.5;
	width: 100%;
	box-sizing: border-box;
	transition-duration: 0.3s;
}

.mln-input:focus {
	outline: none;
	border-color: var(--mln-btn-hover, #a6415a);
	box-shadow: 0 0 0 2px rgba(166, 65, 90, 0.2);
}

/* De knop in de stijl van .btn uit de branding.
   Geschaald onder .mln-wrap zodat de witte tekst en kleuren ook winnen
   van thema's met agressieve knopstyling. */
.mln-wrap .mln-btn {
	font-family: 'Shippori Antique B1', serif;
	background-color: var(--mln-btn-bg, #800020);
	color: var(--mln-btn-text, #ffffff);
	border: none;
	cursor: pointer;
	border-radius: 1000px;
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 15px;
	padding-bottom: 15px;
	margin-bottom: 5px;
	font-size: 16px;
	transition-duration: 0.3s;
}

.mln-wrap .mln-btn:hover,
.mln-wrap .mln-btn:focus {
	transform: translateY(3px);
	background-color: var(--mln-btn-hover, #a6415a);
	color: var(--mln-btn-text, #ffffff);
	transition-duration: 0.3s;
}

.mln-wrap .mln-btn:disabled {
	opacity: 0.6;
	cursor: default;
	transform: none;
}

/* Meldingen */
.mln-message {
	font-family: 'Shippori Antique B1', serif;
	font-size: 15px;
	min-height: 1em;
}

.mln-message.mln-success {
	color: #1a7f37;
}

.mln-message.mln-error {
	color: var(--mln-btn-bg, #800020);
}