/*
 * Styles for the two components that replaced WordPress plugins:
 * the contact form (was WPForms) and the location map (was WP Google Maps).
 * Inputs, labels and buttons inherit the theme's own form styling.
 */

/* ---- <picture> wrappers ----
 * The header and logo images are wrapped in <picture> to serve WebP. A picture
 * box is inline by default, which would add baseline whitespace under the logo
 * and shift the branding down. display:contents removes the box entirely so the
 * theme's rules apply to the <img> exactly as they did without the wrapper.
 */

.custom-header-media picture,
.custom-logo-link picture {
	display: contents;
}

/* ---- Contact form ---- */

.milae-form {
	max-width: 500px;
	margin: 24px auto;
	text-align: left;
}

.milae-field {
	margin: 0;
	padding: 10px 0;
}

/* Label and button typography carried over verbatim from the site's own
   Customizer CSS, which targeted the old form plugin's classes. 'Lato' was
   never actually loaded, so it falls back exactly as it did before. */
.milae-field label {
	display: block;
	font-family: 'Lato';
	font-weight: 700;
	font-style: normal;
	font-size: 20px;
	line-height: 1.3;
	margin-bottom: 4px;
}

/* Field metrics match the form plugin this replaced, so the block keeps its
   original height rather than inheriting the theme's roomier input padding. */
.milae-field input,
.milae-field select,
.milae-field textarea {
	width: 100%;
	padding: 6px;
	font-size: 16px;
	line-height: 1.3;
}

.milae-field textarea {
	height: 110px;
}

.milae-required {
	color: #d0262f;
}

.milae-submit {
	margin: 0;
	text-align: center;
}

.milae-submit button {
	background: #ba8954;
	border-color: #ba8954;
	font-family: 'Lato';
	font-size: 22px;
	cursor: pointer;
}

.milae-submit button:hover,
.milae-submit button:focus {
	background: #a3743f;
	border-color: #a3743f;
}

/* ---- Location map ---- */

.milae-map {
	margin: 0;
}

.milae-map iframe {
	display: block;
	width: 100%;
	border: 0;
	margin: 0;
}


