/*
 * The product gallery is capped at 320px on phones so the buy controls are
 * not pushed below the fold. That put WooCommerce's zoom trigger, which
 * anchors to the top right of the gallery, directly on top of the status
 * pill in the artwork. Moved to the bottom right, where the artwork is
 * plain, and given a legible chip behind it.
 */

.woocommerce div.product .woocommerce-product-gallery__trigger {
	top: auto !important;
	bottom: 10px !important;
	right: 10px !important;
	left: auto !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .92) !important;
	box-shadow: 0 2px 10px rgba(16, 18, 40, .28);
	color: #1c0c42 !important;
	text-indent: 0;
}

.woocommerce div.product .woocommerce-product-gallery__trigger:hover {
	background: #ffffff !important;
}

.woocommerce div.product .woocommerce-product-gallery__trigger:focus-visible {
	outline: 3px solid #5e33df !important;
	outline-offset: 2px;
}