/*
 * Bridges Elementor's markup to the prototype CSS (assets/css/<page>.css).
 *
 * Elementor's base CSS is loaded inside @layer elementor (functions.php), so the prototype CSS
 * and this file always outrank it. Per-element CSS from Elementor's style panels is not layered,
 * so edits made in the editor still win over the prototype defaults.
 */

/* Widget wrappers are transparent: widget content lays out as a direct child, as in the prototype.
   Kept as boxes inside the editor so widgets stay selectable. */
body:not(.elementor-editor-active) .elementor-widget,
.elementor-button-wrapper,
.elementor-button-content-wrapper,
.elementor-button-text,
.elementor-button-icon { display: contents; }

/* Button icon comes after the label (prototype arrow buttons). */
.elementor-button-icon > svg { order: 1; }

/* Plain-link defaults for Elementor buttons; the tx-btn-* classes add the real styling. */
:where(.elementor-button) {
	display: inline; padding: 0; border-radius: 0; background: none;
	color: inherit; fill: none; font-size: inherit; line-height: inherit; text-align: inherit; transition: none;
}

/* Containers start as plain blocks with no spacing. Values set in Elementor's panels override these. */
:where(.e-con) {
	--padding-top: 0; --padding-right: 0; --padding-bottom: 0; --padding-left: 0;
	--gap: 0; --row-gap: 0; --column-gap: 0;
	--width: auto; --position: static; --z-index: auto; --text-align: inherit;
	--background-transition: 0s; --border-transition: 0s; --overlay-transition: 0s; --e-con-transform-transition-duration: 0s;
	min-width: auto;
}
:where(.e-con)::before { left: auto; top: auto; width: auto; height: auto; }

/* Headings inherit line-height like a plain <hN> would. */
:where(.elementor-heading-title) { line-height: inherit; }

/* Scroll-reveal never fires inside the editor preview; show everything there. */
.elementor-editor-active .reveal { opacity: 1; transform: none; }

/* Contact form spam trap. */
.tx-hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* Decorative layers (rings, sparkles, glows, orbit) don't take up space in the editor either. */
.tx-deco { display: contents; }

/* Shortcode widget output ([tx_icon], [tx_part], [tx_insights]) sits in the layout like inline markup. */
.elementor-shortcode { display: contents; }
