/* Mulberry sidecart picker — mirrors components/extend/extend.css.
 * Class names stay the same as the Extend version so cart_contents.php and
 * sidecart.js don't need to switch selectors based on the active provider. */

.cart_item_extend {
	display: none;
}

.extend_cart {
	margin-top: 20px;
}

.extend_cart p {
	margin-bottom: 5px;
}

.extend_cart_item {
	display: inline-block;
	width: calc(33% - 6px);
	border: 1px solid #000;
	margin-top: 10px;
	padding: 6px;
	cursor: pointer;
}

.extend_cart_item:nth-of-type(3) {
	margin-left: 10px;
	margin-right: 10px;
}

.extend_cart_item:hover,
.extend_cart_item.selected {
	background: var(--onyx);
	color: var(--pearl);
}

@media (max-width: 992px) {
	.extend_cart_item:hover {
		background: unset;
		color: unset;
	}
	.extend_cart_item.selected:hover {
		background: var(--onyx);
		color: var(--pearl);
	}
}