/* =========================================================
   Hyplux Shape Divider — osnovni styli
   Barve, prosojnost in višina se urejajo prek Elementor Style
   taba (glej selectors v class-hyplux-shape-divider-widget.php).
   Tu je le pozicioniranje in strukturna logika.
========================================================= */

/* Elementorjev avtomatski wrapper div okrog tega widgeta (class
   .elementor-widget-hplx-shape-divider) se v novih Flexbox/Atomic
   containerjih lahko skrči na 0x0 - position:absolute otrok (spodaj)
   ne prispeva k velikosti flex itema, zato ta "izgine" (širina 0).
   Prisilimo ga na polno širino, ne glede na flex kontekst starša. */
.elementor-widget-hplx-shape-divider {
	width: 100%;
	max-width: 100%;
	align-self: stretch;
	position: relative;
}

.elementor-widget-hplx-shape-divider .elementor-widget-container {
	width: 100%;
	position: relative;
}

.hyplux-shape-divider {
	position: absolute;
	left: 0;
	width: 100%;
	height: 80px;
	overflow: hidden;
	line-height: 0;
	pointer-events: none;
	z-index: 1;
}

.hyplux-shape-divider--top {
	top: 0;
}

.hyplux-shape-divider--bottom {
	bottom: 0;
}

.hyplux-shape-divider--front {
	z-index: 3;
}

.hyplux-shape-divider svg {
	display: block;
	width: 100%;
	height: 100%;
}

.hyplux-shape-divider__main {
	fill: #241609;
}

.hyplux-shape-divider__second {
	fill: #ab8148;
	opacity: 0.45;
}

.hyplux-shape-divider--flip-h svg {
	transform: scaleX(-1);
}

.hyplux-shape-divider--flip-v svg {
	transform: scaleY(-1);
}

.hyplux-shape-divider--flip-h.hyplux-shape-divider--flip-v svg {
	transform: scale(-1, -1);
}