//Cart
.Cart__wrapper {
	background-color: $c-g100;
	border: 1px solid $c-g100;
}

//Cart Header
.Cart__header {
	padding: 1.5rem;
	background: $c-g100;
	border-radius: 3px 3px 0 0;
}

.Cart__header p {
	margin: 0;
}

.Cart__header h3 {
	margin-bottom: 0.25em;
}

.Cart__heading {
	margin: 0;
	font-weight: $t-bold;
}

//Cart Steps
.Cart__step {
	transition: all 0.1s ease-in-out;
	background-color: $c-w100;
	position: relative;
	margin: 1px 0;
	padding: 1.5rem 1.5rem 1.5rem 4rem;
	word-wrap: break-word;

	&:before {
		content: "";
		vertical-align: middle;
		position: absolute;
		top: 50%;
		left: 2em;
		height: 16px;
		width: 16px;
		margin: -8px 0 0 -8px;
		background-position: 50%;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5.6 27.1L15.9 16 5.6 4.9 12.2 0 27 16 12.2 32l-6.6-4.9z' fill='%23E0E4E8'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
	}

	&:after {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		height: 100%;
		width: 0px;
		background: $c-b300;
		transition: all 0.1s ease-out;
	}

	&:hover,
	&:active {

		&:before {
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M5.6 27.1L15.9 16 5.6 4.9 12.2 0 27 16 12.2 32l-6.6-4.9z' fill='%230073EC'/%3E%3C/svg%3E");
		}

		&:after {
			width: 8px;
		}
	}

	&.Cart__step--complete {
		background: $c-b100;

		a {
			color: $c-g400;

			&:first-of-type {
				display: inline-block;
				margin-right: 1rem;
			}
		}

		&:before {
			background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M10.4 18.8l14-15.4c1.7-1.8 4.5-1.9 6.3-.1 1.7 1.7 1.8 4.5.2 6.3L14.3 27.9c-1.3 2.1-4 2.8-6.1 1.4-.4-.3-.8-.6-1.1-1l-5.8-6c-1.7-1.8-1.6-4.7.1-6.5 1.7-1.7 4.4-1.7 6.2 0l2.8 3z' fill='%230073EC' /%3E%3C/svg%3E");
		}
	}

	&.Cart__step--next, &.Cart__step--incomplete {

		.Cart__heading { font-weight: $t-regular; }
		span { color: $c-g400; }

		&:before { background-image: none; }
		&:hover, &:active { &:before { background-image: none; }}

	}

	&.Cart__step--incomplete {
		color: $c-g300;
		&:after {
			width: 0px;
		}
	}
}

//Cart Step Price
.Cart__actions {
	width: 70%;
	display: inline-block;
}

.Cart__step-price {
	width: 30%;
	display: inline-block;
	text-align: right;
	margin: 0;
}

.Cart__step-price span {
	display: block;
	color: $c-g500;
}

//Cart Footer
.Cart__footer {
	padding: 1.5rem;
	background: $c-g100;
	font-weight: $t-bold;
	border-radius: 0 0 3px 3px;
}

.Cart__total-price {
	margin: 0;
	padding: 0;

	p {
		width: 50%;
		display: inline-block;
		margin: 0;
		padding: 0;
	}

	span { text-align: right; width: 50%; display: inline-block; }
}