/*
 * Separator — "Stripes" block style (opt-in via the Editor's Styles panel).
 * A stack of eight 4px stripes: primary / base / contrast / base, repeated
 * twice (32px tall total), painted as a single linear-gradient on the <hr> —
 * one element, no extra markup. Colours use palette presets, so the stack
 * tracks the active style variation. Spans the content width by default;
 * top/bottom margins stay editable per block, and wide/full alignments work.
 *
 * The default Separator is intentionally NOT styled here, so it remains a
 * standard, fully editable block.
 */
.wp-block-separator.is-style-stripes {
	height: 32px; /* 8 rows x 4px */
	border: 0;
	opacity: 1;
	background: linear-gradient(
		to bottom,
		var(--wp--preset--color--primary) 0, var(--wp--preset--color--primary) 4px,
		var(--wp--preset--color--base) 4px, var(--wp--preset--color--base) 8px,
		var(--wp--preset--color--contrast) 8px, var(--wp--preset--color--contrast) 12px,
		var(--wp--preset--color--base) 12px, var(--wp--preset--color--base) 16px,
		var(--wp--preset--color--primary) 16px, var(--wp--preset--color--primary) 20px,
		var(--wp--preset--color--base) 20px, var(--wp--preset--color--base) 24px,
		var(--wp--preset--color--contrast) 24px, var(--wp--preset--color--contrast) 28px,
		var(--wp--preset--color--base) 28px, var(--wp--preset--color--base) 32px
	);
}

/*
 * Default (unaligned) stripes span the content width. Core gives default
 * separators an explicit width:100px (specificity 0,3,0) and theme.json caps
 * them at 10rem; this rule (0,4,0) overrides both. alignwide / alignfull are
 * excluded so those alignments keep their own width.
 */
.wp-block-separator.is-style-stripes:not(.alignwide):not(.alignfull) {
	width: 100%;
	max-width: var(--wp--style--global--content-size);
}