/* -----------------------------------------------
 * # ASSETS/CSS/PRODUCT-3D.CSS
 * [lh_3d_ansicht] – Bild mit 3D-Button bzw. 3D-Ansicht (includes/product-3d.php)
 * ----------------------------------------------- */

.lh-3d {
	position: relative;
	width: 100%;
	overflow: hidden;
	background: var(--white, #fff);
}

.lh-3d__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.lh-3d__placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--base-3, #F6F6F6);
	color: var(--contrast-3, #a5a5ae);
}

.lh-3d__frame {
	display: block;
	width: 100%;
	height: 100%;
	border: 0;
}

.lh-3d__button {
	position: absolute;
	left: 50%;
	bottom: 20px;
	transform: translateX(-50%);
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border: 0;
	border-radius: 0;
	background: var(--contrast, #000);
	color: var(--white, #fff);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	white-space: nowrap;
}

.lh-3d__button:hover,
.lh-3d__button:focus-visible {
	background: var(--contrast-2, #545c69);
}