/* WooCommerce Review Manager Pro — Frontend Styles */

.wrmp-review-media {
	margin-top: 10px;
}

.wrmp-review-images {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.wrmp-layout-carousel .wrmp-review-images {
	flex-wrap: nowrap;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	padding-bottom: 4px;
}

.wrmp-layout-list .wrmp-review-images {
	flex-direction: column;
}

.wrmp-review-thumb {
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 6px;
	border: 1px solid #e2e4e7;
	scroll-snap-align: start;
}

.wrmp-review-videos {
	margin-top: 8px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.wrmp-review-video {
	max-width: 260px;
	width: 100%;
	border-radius: 6px;
}

@media (max-width: 600px) {
	.wrmp-review-thumb {
		width: 64px;
		height: 64px;
	}
	.wrmp-review-video {
		max-width: 100%;
	}
}

/* Lightbox overlay (progressively enhanced by frontend.js) */
.wrmp-lightbox-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.85);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99999;
}

.wrmp-lightbox-overlay img {
	max-width: 90vw;
	max-height: 90vh;
	border-radius: 4px;
}

.wrmp-lightbox-close {
	position: absolute;
	top: 20px;
	right: 30px;
	color: #fff;
	font-size: 32px;
	cursor: pointer;
	background: none;
	border: none;
	line-height: 1;
}