/* ==========================================================================
   Shape Divider — novafolio/shape-divider
   Standalone + Section integration.
   v1.1 — overlap mechanism, responsive, opacity, position support
   ========================================================================== */

/* ── Standalone wrapper ──────────────────────────────────────────────── */
.nvf-shape-divider-wrapper {
	line-height: 0;
	overflow: hidden;
	position: relative;	z-index: 1;	pointer-events: none;
}

/* Overlap: negative margin pulls divider into adjacent section */
.nvf-shape-divider-wrapper--bottom {
	margin-bottom: calc(-1 * var(--nvf-sd-h, 80px));
}
.nvf-shape-divider-wrapper--top {
	margin-top: calc(-1 * var(--nvf-sd-h, 80px));
}

/* ── Core divider ────────────────────────────────────────────────────── */
.nvf-shape-divider {
	position: relative;
	width: 100%;
	line-height: 0;
	overflow: hidden;
}
.nvf-shape-divider__svg {
	display: block;
	width: 100%;
	height: 100%;
}

/* ── Section integration — top / bottom ──────────────────────────────── */
.nvf-section {
	position: relative;
}
.nvf-section > .nvf-shape-divider--top {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	pointer-events: none;
}
.nvf-section > .nvf-shape-divider--bottom {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	pointer-events: none;
}

/* ── Stacking fix ─────────────────────────────────────────────────────
   The divider section must paint ABOVE neighbouring non-divider sections.
   z-index:1 + position:relative (inherited from .nvf-section) creates a
   stacking context — the shape-divider (inline z:1) and the inner (z:2,
   set in section.css) are now both contained and correctly layered.
   Non-divider sections stay at z-index:auto so they never occlude the
   divider in the overlap zone. */
.nvf-section--has-dividers {
	z-index: 1;
}

/* ── Editor preview ──────────────────────────────────────────────────── */
.nvf-shape-divider-editor-preview {
	line-height: 0;
	overflow: hidden;
}
.nvf-shape-divider-editor-preview svg {
	display: block;
	width: 100%;
}
