/*-------全流程有礼活动弹窗样式--------*/
.gdrModalOut {
	display: none;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.8);
	align-items: center;
	justify-content: center;
	z-index: 10001;
	font-family: PingFang SC, Source Han Sans CN, Source Han Serif SC;
	letter-spacing: 1.2px;
	user-select: none;
}

.gdrModalCon {
	position: relative;
	width: 768px;
	max-width: 92%;
	max-height: 92%;
	overflow-y: auto;
	padding: 24px 24px 22px;
	background: #FFFFFF;
	border-radius: 4px;
	box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
	text-align: center;
}

/*右上角关闭按钮*/
.gdrRemove {
	height: 30px;
	width: 30px;
	position: absolute;
	right: 10px;
	top: 10px;
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
	-ms-border-radius: 50%;
	-o-border-radius: 50%;
	background: #FFFFFF;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 2;
}

.gdrRemove:hover {
	background: #EEEEEE;
	cursor: pointer;
}

.gdrRemove img {
	width: 14px;
	height: 14px;
}

/*活动图片 720px * 480px，作为领取按钮的定位参照*/
.gdrModalImgWrap {
	position: relative;
	display: flex;
	justify-content: center;
}

.gdrModalImg {
	width: 720px;
	height: 480px;
	max-width: 100%;
	border-radius: 4px;
	display: block;
	object-fit: cover;
}

/*领取按钮容器，绝对定位叠加在活动图片底部居中，沿用全流程有礼活动按钮的渐变与高光风格*/
.gdrModalBtns {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 4.5%;
	display: flex;
	justify-content: center;
	z-index: 2;
}

.gdrReceiveBtn {
	height: 34px;
	padding: 0 32px;
	border: none;
	border-radius: 4px;
	/*background: linear-gradient(135deg, #FF6A48 0%, #DF2D26 100%);*/
	background: linear-gradient(135deg, #EC6B30 0%, #FFDD57 100%);
	color: #FFFFFF;
	font-size: 14px;
	letter-spacing: 2px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	box-shadow: 0 1px 4px rgba(223, 45, 38, 0.3);
	transition: background 0.25s ease, transform 0.25s ease;
	animation: gdrGiftGlow 2.4s ease-in-out infinite;
	display: none;
}

.gdrReceiveBtn:hover {
	background: linear-gradient(135deg, #E8502F 0%, #C4231D 100%);
	transform: translateY(-1px);
}

/*高光扫过，营造活动氛围*/
.gdrReceiveBtn::after {
	content: '';
	position: absolute;
	top: 0;
	left: -70%;
	width: 45%;
	height: 100%;
	background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.4) 50%, rgba(255,255,255,0) 100%);
	transform: skewX(-20deg);
	animation: gdrGiftShine 3s ease-in-out infinite;
	pointer-events: none;
}

/*已领取状态*/
.gdrReceiveBtnReceived,
.gdrReceiveBtnReceived:hover {
	background: #C2C2C2;
	color: #FFFFFF;
	cursor: default;
	transform: none;
	box-shadow: none;
	animation: none;
}

.gdrReceiveBtnReceived::after {
	animation: none;
	display: none;
}

@keyframes gdrGiftGlow {
	0%, 100% { box-shadow: 0 1px 4px rgba(223, 45, 38, 0.3); }
	50% { box-shadow: 0 1px 9px rgba(223, 45, 38, 0.55); }
}

@keyframes gdrGiftShine {
	0% { left: -70%; }
	55%, 100% { left: 130%; }
}

/*响应式：窄屏下图片自适应高度，按钮随图片等比缩放定位*/
@media (max-width: 800px) {
	.gdrModalCon {
		padding: 16px 12px 16px;
	}
	.gdrModalImg {
		width: 100%;
		height: auto;
	}
	.gdrReceiveBtn {
		height: 30px;
		padding: 0 20px;
		font-size: 12px;
		letter-spacing: 1px;
	}
}
/*-------全流程有礼活动弹窗样式 end--------*/