/**
 * Page Preview - Admin Styles
 */
@import url("@wpmudev/shared-ui/dist/css/shared-ui.css");


.page-preview-img {
	aspect-ratio: 16/9;
	border: 1px solid #d5d5d5;
	display: block;
	height: 100px;
	overflow: hidden;
	position: relative;
	text-align: center;
	transition: transform 0.2s, box-shadow 0.2s; /* Smooth transitions for transformations */
}

.zoom:hover {
	border: 1px solid #d5d5d5;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
	cursor: pointer;
	overflow: visible; /* Allow the image to overflow during zoom */
	transform: scale(3); /* Scale the container */
	z-index: 100; /* Ensure the zoomed image is above others */
}