/* =========================================================
SNIPPET: 50 - Stack Utilities (Vertikaler Rhythmus)
WOFÜR:
- Gleichmäßige Abstände zwischen direkten Kindern in einem Container/Widget.
KLASSEN:
- stack-{0|xxs|xs|s|m|l|xl|xxl|xxxl}
WIE ES FUNKTIONIERT:
- Jedes direkte Kind nach dem ersten bekommt margin-top.
- Im Elementor-Backend werden Editor-Elemente (Overlay/Shapes) ignoriert,
  damit der erste "echte" Inhalt kein Margin bekommt.
WERTE KOMMEN VON:
- Tokens: var(--stack-*) (stack-factor kompatibel)
HINWEIS:
- Wir targeten: Element selbst + .e-con-inner + .elementor-container (robust).
========================================================= */

/* Apply Stack auf echte Inhalte (Overlay/Shape ignorieren) */
.elementor .elementor-element[class*="stack-"] > :where(
  :not(.elementor-element-overlay):not(.elementor-shape) +
  :not(.elementor-element-overlay):not(.elementor-shape)
),
.elementor .elementor-element[class*="stack-"] > .e-con-inner > :where(
  :not(.elementor-element-overlay):not(.elementor-shape) +
  :not(.elementor-element-overlay):not(.elementor-shape)
),
.elementor .elementor-element[class*="stack-"] > .elementor-container > :where(
  :not(.elementor-element-overlay):not(.elementor-shape) +
  :not(.elementor-element-overlay):not(.elementor-shape)
){
  margin-top: var(--stack-current) !important;
}

/* Token Mapping */
.elementor .stack-0    { --stack-current: var(--stack-0); }
.elementor .stack-xxs  { --stack-current: var(--stack-xxs); }
.elementor .stack-xs   { --stack-current: var(--stack-xs); }
.elementor .stack-s    { --stack-current: var(--stack-s); }
.elementor .stack-m    { --stack-current: var(--stack-m); }
.elementor .stack-l    { --stack-current: var(--stack-l); }
.elementor .stack-xl   { --stack-current: var(--stack-xl); }
.elementor .stack-xxl  { --stack-current: var(--stack-xxl); }
.elementor .stack-xxxl { --stack-current: var(--stack-xxxl); }