.bc-cart {
	lost-center: 1140px;
	opacity: 1;
	transition: var(--transition);

	&.bc-updating-cart {
		opacity: 0.4;
	}
}

.bc-cart__empty {
	width: 100%;
	text-align: center;
	border-top: 1px solid var(--color-bc-light-grey);
	border-bottom: 1px solid var(--color-bc-light-grey);
	padding: 40px 0;
}

.bc-coupon-code {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	margin: 20px 0;

	> * {
		flex: 0 0 auto;
	}
}

input[type="text"].bc-coupon-code__input {
	width: auto;
}

.bc-coupon-code__submit {
	margin-left: 15px;
}

.bc-cart-header {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;

	> div {
		padding: 20px 0;
		font-size: var(--font-size-content-m);
		font-weight: var(--font-weight-bold);

		@media (--viewport-medium) {
			padding: 40px 0;
		}
	}

	&__item {
		flex: 1 1 auto;
	}

	&__qty {
		flex: 0 0 42px;

		@media (--viewport-medium) {
			flex: 0 0 70px;
		}

		@media (--viewport-full) {
			flex: 0 0 120px;
		}
	}

	&__price {
		flex: 0 0 70px;

		@media (--viewport-full) {
			flex: 0 0 120px;
		}
	}
}

.bc-cart-body {
	width: 100%;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
}

.bc-cart-item {
	lost-column: 1/1 1 0;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	position: relative;
	border-top: 1px solid var(--color-bc-light-grey);
	padding: 30px 0;

	@media (--viewport-medium) {
		font-size: var(--font-size-content);
	}

	@media (--viewport-full) {
		padding: 44px 0;
	}

	&:last-child {
		border-bottom: 1px solid var(--color-bc-light-grey);
	}
}

.bc-cart-item__remove-button {
	display: block;
	background: transparent;
	color: var(--color-primary);
	font-size: var(--font-size-content-xxs);
	text-transform: none;
	padding: 5px 0;
	font-weight: var(--font-weight-bold);

	@media (--viewport-medium) {
		font-size: var(--font-size-content);
		margin: 0 auto;
	}

	&:hover,
	&:focus {
		background: transparent;
		color: var(--color-bc-grey-medium);

		&[disabled] {
			text-transform: none;
			background: transparent;
			color: var(--color-bc-grey-medium);
			padding: 5px;
			opacity: 0.4;
		}
	}
}

.bc-cart-item-image {
	flex: 0 0 60px;
	margin-right: 10px;
	align-self: flex-start;

	@media (--viewport-full) {
		flex: 0 0 110px;
		margin-right: 30px;
	}

	img {
		max-width: 50px;
		width: 100%;
		height: auto;

		@media (--viewport-medium) {
			max-width: 110px;
		}
	}
}

.bc-cart-item-meta {
	flex: 1 1 auto;
	padding-right: 5px;
	align-self: flex-start;

	.bc-cart-item__product-title {
		margin: 0;
		font-size: var(--font-size-content);
		line-height: 1.125;

		@media (--viewport-medium) {
			font-size: var(--font-size-content-lg);
			line-height: var(--line-height-ss);
		}

		@media (--viewport-full) {
			font-size: var(--font-size-content-xl);
		}

		@media (--viewport-large) {
			font-size: var(--font-size-content-xxl);
			line-height: var(--line-height-s);
		}
	}
}

.bc-cart-item__product-brand {
	display: block;
	font-weight: var(--font-weight-bold);
	margin-top: 10px;
	font-size: var(--font-size-content-m);
}

.bc-cart-item__product-option {
	display: block;
	font-size: var(--font-size-content-xs);
	line-height: var(--line-height-base);
	margin-top: 10px;
	color: var(--color-bc-grey);
}

.bc-cart-item__product-option-label {
	font-weight: var(--font-weight-semibold);
}

.bc-cart-item__product-option-value {
	font-weight: var(--font-weight-light);
}

.bc-cart-item-quantity {
	flex: 0 0 70px;

	@media (--viewport-full) {
		flex: 0 0 120px;
	}

	input.bc-cart-item__quantity-input {
		text-align: center;
		background: var(--color-white);
		border: 1px solid var(--color-bc-light-grey);
		font-size: var(--font-size-content-s);
		width: 70px;

		@media (--viewport-medium) {
			font-size: var(--font-size-content);
		}

		&:focus {
			box-shadow: 0 0 0 1px var(--color-bc-light-grey);
		}
	}
}

.bc-cart-item-total-price {
	flex: 0 0 70px;
	margin-left: 10px;
	font-weight: var(--font-weight-bold);
	font-size: var(--font-size-content-m);

	@media (--viewport-full) {
		flex: 0 0 120px;
		font-size: var(--font-size-content-xl);
	}
}

.bc-cart-footer {
	width: 100%;
}

.bc-cart-subtotal,
.bc-cart-tax,
.bc-cart-total {
	text-align: right;
	padding: 25px 0 0;
	display: flex;
	flex-direction: row;
	align-items: flex-end;
}

.bc-cart-tax {
	padding-top: 0;
}

.bc-cart-subtotal__label,
.bc-cart-tax__label,
.bc-cart-total__label {
	font-size: var(--font-size-content-s);
	margin-right: 14px;
	text-align: right;
	padding-right: 15px;
	flex: 1 1 auto;
}

.bc-cart-subtotal__amount,
.bc-cart-tax__amount,
.bc-cart-total__amount {
	font-weight: var(--font-weight-bold);
	text-align: left;
	flex: 0 0 70px;

	@media (--viewport-full) {
		font-size: var(--font-size-content-xl);
		flex: 0 0 120px;
	}
}

.bc-cart-tax__amount {
	font-size: var(--font-size-content);
}

.bc-cart-total {
	align-items: center;
}

.bc-cart-total__label {
	font-weight: var(--font-weight-bold);
}

.bc-cart-actions {
	text-align: right;
	margin-top: 30px;
}

.bc-cart-error {
	width: 100%;
	display: none;

	&.message-active {
		display: block;
	}
}

.bc-cart-error__message {
	background: #ff8383;
	font-size: var(--font-size-content-xs);
	margin: 0;

	.message-active & {
		padding: 10px;
	}
}
