/**
 * All text elements that can be added by the user through a CMS
 */


.s-text {

	h1, h2, h3 {
		color: palette(neutral, 800);
	}

	strong {
		color: palette(neutral, 800);
	}

	// First the owl selector for setting a default vertical rhythm
	& > * + * {
		margin-top: space(4);
	}

	& > h2 + p,
	& > h3 + p,
	& > h4 + p {
		margin-top: 0;
	}

	// Make sure first item in scoped text has no margin on top
	& > :first-child {
		margin-top: 0 !important;
	}

	& > ul:not([class]) {
		list-style: none;

		& > li {
			position: relative;
			margin-left: -1.125em;
			padding-left: 1.125em;

			&::before {
				@include font-size(l);
				content: "\2022";
				position: absolute;
				top: -4px;
				left: 0;
			}
		}
	}

	& > ol:not([class]) {
		list-style: none;
		counter-reset: ol-counter;
		margin-left: 0;

		& > li {
			counter-increment: ol-counter;
			position: relative;
			margin-left: space(6);
			padding-left: 0;

			&::before {
				@include font-size(xl);
				@include font-weight(bold);
				content: counter(ol-counter) "";
				position: absolute;
				top: -4px;
				left: space(-6);
				text-align: right;
				color: palette(neutral, 800);
			}

			& + li {
				margin-top: space(4);
			}

			// a level deeper
			& ol {
				list-style: none;
				counter-reset: ol-subcounter;
				margin-left: 0;

				li {
					counter-increment: ol-subcounter;
					position: relative;
					margin-left: space(4);
					padding-left: 0;

					&:before {
						content: counter(ol-subcounter, lower-alpha) ". ";
						font-weight: bold;
						position: absolute;
						top: 0;
						left: space(-4);
					}
				}
			}
		}
	}
}

.s-text--on-dark {
	h1, h2, h3, h4, h5, h6 {
		color: palette(neutral, 0);
	}
}