@import "../bootstrap/scss/functions";
@import "../base/functions";
@import "../base/variables";
@import "../bootstrap/scss/variables";
@import "../base/mixins";
@import "../bootstrap/scss/mixins";


// Base
.list {
	.list,
	> .list-item + .list-item {
		margin-top: .02em;
	}
}

.list-md {
	.list-md,
	> .list-item + .list-item {
		margin-top: px-to-rem( 15px );
	}
}

.list-link {
	color: inherit;

	&:hover {
		color: $primary;
	}
}


// Modifying
.list-xs {
	.list,
	> .list-item + .list-item {
		margin-top: 0;
	}
}

.list-sm {}

.list-lg {
	.list,
	> .list-item + .list-item {
		margin-top: .48em;
	}
}

.list-xl {
	.list,
	> .list-item + .list-item {
		margin-top: .64em;
	}
}

.list-xxl {
	.list,
	> .list-item + .list-item {
		margin-top: 1.23em;
	}
}


// List marked
.list-marked {
	> .list-item {
		&::before {
			display: inline-block;
			vertical-align: middle;
			content: '';
			width: .34em;
			height: .33em;
			margin-right: .62em;
			border-radius: 50%;
			background-color: $gray-900;
		}
	}

	.list-marked {
		margin-left: 3em;
	}
}


// List marked arrow
.list-marked-arrow {
	> .list-item {
		&::before {
			display: inline-block;
			content: '\e901';
			margin-right: 1.29em;
			font-size: .88em;
			font-family: 'Intense Icons';
			text-indent: 0;
		}
	}

	.list-marked-arrow {
		margin-left: 2.9em;
	}
}


// Ordered
.list-ordered {
	counter-reset: li;

	> .list-item {
		&::before {
			content: counters(li,".")".";
			counter-increment: li;
			margin-right: .8em;
		}
	}

	.list-ordered {
		margin-left: 2.3em;
	}
}


// Spacing
* + .list {
	margin-top: 15px;
}

h2 + .list-marked-arrow {
	margin-top: 15px;
}

.list + h6 {
	margin-top: px-to-rem( 30px );
}


// List contact
.list-contact {
	font-weight: 400;
	color: $gray-900;

	.list-contact-link {
		color: inherit;
	}
}

.list-contact-link {
	white-space: nowrap;

	&:hover {
		color: $primary;
	}
}


// List divided
.list-divided {
	> .list-item + .list-item {
		margin-top: 9px;
		padding-top: 8px;
		border-top: 1px solid $border-color;
	}
}


// Contexts
.context-dark {
	.list-marked {
		> .list-item::before {
			background: $white;
		}
	}

	.list-contact {
		color: inherit;
	}
}


// Media
@include media-breakpoint-up( lg ) {

	* + .list {
		margin-top: px-to-rem( 25px );
	}

	.list + h6 {
		margin-top: px-to-rem( 40px );
	}
}

@include media-breakpoint-up( xxl ) {
	.list + h6 {
		margin-top: px-to-rem( 60px );
	}

	h2 + .list-marked-arrow {
		margin-top: 37px;
	}
}