.pdp-lens-simulator {
	margin: 48px 0 64px;
}

.pdp-lens-simulator--empty {
	margin: 0;
}

.pdp-lens-simulator__eyebrow {
	margin: 0;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 28px;
	font-weight: 500;
	line-height: 1.02;
	color: #858585;
}

.pdp-lens-simulator__title {
	margin: 0 0 16px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 28px;
	line-height: 1.1;
	font-weight: 700;
	color: #111111;
}

.pdp-lens-simulator__description {
	margin: 0 0 40px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 15px;
	line-height: 1.4;
	color: #111111;
	max-width: 680px;
}

.pdp-lens-simulator__view {
	position: relative;
	overflow: hidden;
	background: #ccc;
	/* border-radius: 16px; */
}

.pdp-lens-simulator__view:before {
	padding-top: 80%;
}

.pdp-lens-simulator__views {
	height: 100%;
	margin: 0 auto;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}

.pdp-lens-simulator__views .view {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 0;
	background-repeat: no-repeat;
	background-position: left center;
	background-size: cover;
}

.pdp-lens-simulator__views .view.right-view {
	background-position: right center;
	overflow: hidden;
	z-index: 1;
	left: auto;
	right: 0;
	width: 50%;
}

#pdp-simulator-dragger-boundary {
	position: absolute;
	overflow: hidden;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
}

#pdp-simulator-dragger {
	position: absolute;
	cursor: pointer;
	z-index: 4;
	width: 78px;
	height: 100%;
	left: calc(50% - 39px);
}

#pdp-simulator-dragger .dragger {
	position: absolute;
	cursor: pointer;
	z-index: 4;
	top: 50%;
	margin-top: -39px;
	left: 50%;
	margin-left: -39px;
	background: #fff;
	width: 78px;
	height: 78px;
	border-radius: 999px;
}

#pdp-simulator-dragger .arrow {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-150%, -50%);
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 7px 7px 0;
	border-color: transparent #141414 transparent transparent;
}

#pdp-simulator-dragger .arrow.right {
	transform: translate(50%, -50%);
	border-width: 7px 0 7px 7px;
	border-color: transparent transparent transparent #141414;
}

#pdp-simulator-dragger .divider {
	position: absolute;
	z-index: 3;
	top: 0;
	left: 50%;
	background: #fff;
	width: 4px;
	height: 100%;
	transform: translateX(-50%);
}

.pdp-lens-simulator .lens-label {
	color: #fff;
    background:rgba(0,0,0,0.5);
    padding: 10px 20px;
    border-radius: 50px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    position: absolute;
    bottom: 24px;
    z-index: 4;
}

.pdp-lens-simulator .lens-label.no-lens {
	left: 16px;
}

.pdp-lens-simulator .lens-label.current-lens {
	right: 16px;
}

.pdp-lens-simulator__views[data-id="course-tint"] .left-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Course-Tint-No.jpg);
}

.pdp-lens-simulator__views[data-id="course-tint"] .right-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Course-Tint-Yes.jpg);
}

.pdp-lens-simulator__views[data-id="road-tint"] .left-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Nike-Max-Road-Without.jpg);
}

.pdp-lens-simulator__views[data-id="road-tint"] .right-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Nike-Max-Road-With.jpg);
}

.pdp-lens-simulator__views[data-id="terrain-tint"] .left-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Terrain-Tint-No.jpg);
}

.pdp-lens-simulator__views[data-id="terrain-tint"] .right-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Terrain-Tint-Yes.jpg);
}

.pdp-lens-simulator__views[data-id="field-tint"] .left-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Field-Tint-No.jpg);
}

.pdp-lens-simulator__views[data-id="field-tint"] .right-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Field-Tint-Yes.jpg);
}

.pdp-lens-simulator__views[data-id="low-light-tint"] .left-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Orange-LowLight-No.jpg);
}

.pdp-lens-simulator__views[data-id="low-light-tint"] .right-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Orange-LowLight-Yes.jpg);
}

.pdp-lens-simulator__views[data-id="polarized"] .left-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Polarized-No.jpg);
}

.pdp-lens-simulator__views[data-id="polarized"] .right-view {
	background-image: url(/resources/img/lens-simulator-2025/views/_mobile/Polarized-Yes.jpg);
}

@media (min-width: 960px) {
	.pdp-lens-simulator__inner > .container {
		padding: 0;
	}

	.pdp-lens-simulator {
		margin: 64px 0 96px;
	}

	.pdp-lens-simulator__title, .pdp-lens-simulator__eyebrow {
		font-size: 32px;
	}

	.pdp-lens-simulator__description {
		margin-bottom: 80px;
		font-size: 16px;
	}

	.pdp-lens-simulator__view {
		border-radius: 24px;
	}

	.pdp-lens-simulator__view:before {
		padding-top: 46%;
	}

	.pdp-lens-simulator__views[data-id="course-tint"] .left-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Course-Tint-No.jpg);
	}

	.pdp-lens-simulator__views[data-id="course-tint"] .right-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Course-Tint-Yes.jpg);
	}

	.pdp-lens-simulator__views[data-id="road-tint"] .left-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Nike-Max-Road-Without.jpg);
	}

	.pdp-lens-simulator__views[data-id="road-tint"] .right-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Nike-Max-Road-With.jpg);
	}

	.pdp-lens-simulator__views[data-id="terrain-tint"] .left-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Terrain-Tint-No.jpg);
	}

	.pdp-lens-simulator__views[data-id="terrain-tint"] .right-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Terrain-Tint-Yes.jpg);
	}

	.pdp-lens-simulator__views[data-id="field-tint"] .left-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Field-Tint-No.jpg);
	}

	.pdp-lens-simulator__views[data-id="field-tint"] .right-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Field-Tint-Yes.jpg);
	}

	.pdp-lens-simulator__views[data-id="low-light-tint"] .left-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Orange-LowLight-No.jpg);
	}

	.pdp-lens-simulator__views[data-id="low-light-tint"] .right-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Orange-LowLight-Yes.jpg);
	}

	.pdp-lens-simulator__views[data-id="polarized"] .left-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Polarized-No.jpg);
	}

	.pdp-lens-simulator__views[data-id="polarized"] .right-view {
		background-image: url(/resources/img/lens-simulator-2025/views/Polarized-Yes.jpg);
	}
}