/**
 * Minty Media Elementor Forms Addon - heading, frontend.
 *
 * @package MintyMedia\ElementorFormsAddon
 * @version 1.40.1
 */

.elementor-field-type-mmefa_heading {
	/* Nothing to start with. What a heading looks like is decided on the Style
	   tab of the form and nowhere else. */
	--mmefa-heading-top: 0;
	--mmefa-heading-bottom: 0;
}

/* A browser and a theme both have something to say about h1 to h6: a weight, a
   line height, room above and below. None of that is asked for here, and it
   would sit on top of whatever is set on the Style tab. So it is all handed
   back: a heading starts out looking like the text around it and becomes a
   heading through the settings, not through where it happens to stand.

   The width stays: without it the heading would not take up the row it is in
   and the fields around it would move up beside it. */
.elementor-field-type-mmefa_heading .mmefa-heading {
	width: 100%;
	margin: var(--mmefa-heading-top) 0 var(--mmefa-heading-bottom);
	padding: 0;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
	letter-spacing: inherit;
	line-height: inherit;
	text-transform: inherit;
}

/* The room above is dropped for a heading that stands at the top of the form or
   at the top of a step: there is nothing above it to be pushed away from. The
   step marker and a hidden field are field groups as well but show nothing, so
   they are stepped over. */
.elementor-field-type-mmefa_heading:first-child .mmefa-heading,
.elementor-field-type-step + .elementor-field-type-mmefa_heading .mmefa-heading,
.elementor-field-type-step + .elementor-field-type-hidden + .elementor-field-type-mmefa_heading .mmefa-heading {
	margin-top: 0;
}

/* The field group holds nothing else, so it needs no room of its own. */
.elementor-field-type-mmefa_heading {
	margin-bottom: 0;
}

/* Iets buiten deze plugin kan een kop focusbaar maken: Elementor zet daar een
   tabindex op om er na een stapwissel naartoe te kunnen springen. Dat laten we
   staan, want het helpt een schermlezer. Alleen te zien hoeft het niet: een kop
   is niets om te bedienen, dus er komt geen randje omheen - ook niet vanuit een
   thema, vandaar dat de schaduw er ook af gaat. */
.elementor-field-type-mmefa_heading:focus,
.elementor-field-type-mmefa_heading:focus-visible,
.elementor-field-type-mmefa_heading .mmefa-heading:focus,
.elementor-field-type-mmefa_heading .mmefa-heading:focus-visible {
	outline: none !important;
	box-shadow: none !important;
}
