header {
	// row box-shadow
	[data-row] {
		position: relative;
		box-shadow: var(--boxShadow);
	}

	[data-row='top'] {
		z-index: 3;
	}

	[data-row='middle'] {
		z-index: 2;
	}

	[data-row='bottom'] {
		z-index: 1;
	}

	// border top & bottom
	[data-border] {
		&:before,
		&:after {
			position: absolute;
			content: '';
			left: 0;
			right: 0;
		}

		&:before {
			top: 0;
			border-top: var(--border);
		}

		&:after {
			bottom: 0;
			border-bottom: var(--border);
		}
	}

	div:not([data-border*='top-full']):before,
	div:not([data-border*='bottom-full']):after {
		@include container-width(
			(
				width: fixed
			)
		);
	}

	[data-border*='top-full']:before,
	[data-border*='bottom-full']:after {
		width: 100%;
	}
}