/* 公开课页面新样式------------start */

.video {
	position: fixed;
	z-index: 99;
	top: 0;
	left: 0;
}

.live-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background-image: url('../images/livebg.png');
	background-position: top center;
	background-size: cover;
	z-index: 10;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.coupon-buttons {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	align-items: center;
}

.coupon-btn, .no-coupon-btn {
	width: 8rem;
	height: 2.5rem;
	border: none;
	border-radius: 0.5rem;
	font-size: 0.9rem;
	font-weight: 600;
	cursor: pointer;
}

.coupon-btn {
	background: #FF6B35;
	color: #FFFFFF;
}

.no-coupon-btn {
	background: #CCCCCC;
	color: #666666;
}

/* 优惠券弹窗样式 */
.coupon-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: none;
	justify-content: center;
	align-items: center;
}

.modal-content {
	width: 15.15rem;
	height: 26.4rem;
	background: #FFFFFF;
	border-radius: 0.5rem;
	overflow: hidden;
	position: relative;
}

.modal-header {
	width: 100%;
	height: 7.85rem;
	background-image: url('../images/yhqtop.png');
	background-size: 100% 100%;
	padding: 1rem;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.modal-title {
	font-size: 0.8rem;
	color: #FFFFFF;
	line-height: 1.1rem;
	margin-bottom: 0.5rem;
}

.modal-desc {
	font-size: 0.6rem;
	color: #FFFFFF;
	line-height: 0.9rem;
}

.coupon-list {
	height: 13rem;
    overflow-x: hidden;
	overflow-y: auto;
	padding: 0.5rem;
	box-sizing: border-box;
    margin-top: .85rem;
}

.coupon-item {
	width: 14.65rem;
	height: 5.4rem;
	background-image: url('../images/yhqbg.png');
	background-size: 100% 100%;
	margin-bottom: 0.5rem;
	position: relative;
	display: flex;
	align-items: center;
	/* padding: 0 1rem; */
	box-sizing: border-box;
}

.coupon-amount {
	font-size: 1.2rem;
	font-weight: bold;
	color: #FFFFFF;
	margin-right: .5rem;
    width: 5rem;
    text-align: center;
}

.coupon-info {
	flex: 1;
    display: flex;
    height: 100%;
    flex-direction: column;
    box-sizing: border-box;
    padding: .5rem 0;
}

.coupon-name {
	font-weight: 500;
	font-size: 0.7rem;
	color: #000000;
	margin-bottom: 0.2rem;
     flex: 1;
}

.coupon-type {
	font-size: 0.6rem;
	color: #E1131C;
	margin-bottom: 0.2rem;
   
}

.coupon-status {
	font-size: 0.6rem;
	color: #626262;
}

.receive-btn {
	position: absolute;
	bottom: 1.4rem;
	right: 0.6rem;
	width: 2.74rem;
    height: 1.05rem;
    background: #FF2A06;
    border-radius: 0.1rem;
	color: #FFFFFF;
	border: none;
	font-size: 0.5rem;
	cursor: pointer;
}

.received-btn {
	background: #CCCCCC;
	color: #fff;
	cursor: not-allowed;
}

/* 成功弹窗样式 */
.success-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: none;
	justify-content: center;
	align-items: center;
}

.success-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.success-content {
	width: 8rem;
	height: 8rem;
	background: white;
	border-radius: 0.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
}

.success-content img {
	width: 1.85rem;
	height: 1.85rem;
	margin-bottom: 0.5rem;
}

.success-text {
	font-size: 0.6rem;
	color: #000;
	text-align: center;
	line-height: 1.2;
}

.success-close-btn {
	width: 1.6rem;
	height: 1.6rem;
	margin-top: 0.65rem;
	cursor: pointer;
}

/* 失败弹窗样式 */
.fail-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: none;
	justify-content: center;
	align-items: center;
}

.fail-wrapper {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.fail-content {
	width: 8rem;
	height: 8rem;
	background: white;
	border-radius: 0.5rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
}

.fail-content img {
	width: 1.85rem;
	height: 1.85rem;
	margin-bottom: 0.5rem;
}

.fail-text {
	font-size: 0.6rem;
	color: #000;
	text-align: center;
	line-height: 1.2;
}

.fail-close-btn {
	width: 1.6rem;
	height: 1.6rem;
	margin-top: 0.65rem;
	cursor: pointer;
}

.modal-footer {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #FFFFFF;
	border-top: 1px solid #EEEEEE;
}

.close-modal {
	width: 8rem;
	height: 2rem;
	/* background: #CCCCCC; */
	font-size: 0.8rem;
    color: #F7502E;
	border: none;
	border-radius: 0.5rem;
	font-size: 0.8rem;
	cursor: pointer;
}

/* 暂无优惠券弹窗样式 */
.no-coupon-modal {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
	z-index: 1000;
	display: none;
	visibility: hidden;
	justify-content: center;
	align-items: center;
}

.no-coupon-content {
	width: 17rem;
	height: 22.85rem;
	background: #FFFFFF;
	border-radius: 0.5rem;
	overflow: hidden;
	position: relative;
}

.no-coupon-header {
	width: 100%;
	height: 10rem;
	background: linear-gradient(135deg, #FF6B35 0%, #FF8A65 100%);
	border-radius: 0.5rem 0.5rem 0 0;
	position: relative;
}

.close-icon {
	position: absolute;
	top: 1rem;
	right: 1rem;
	width: 1.5rem;
	height: 1.5rem;
	color: #FFFFFF;
	font-size: 1.2rem;
	font-weight: bold;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
}

.no-coupon-body {
	padding: 2rem;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.info-icon {
	width: 3rem;
	height: 3rem;
	background: #FFA726;
	color: #FFFFFF;
	border-radius: 50%;
	font-size: 1.5rem;
	font-weight: bold;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 1.5rem;
}

.no-coupon-text {
	font-size: 0.7rem;
    color: #000000;
    line-height: 1rem;
    letter-spacing: 1px;
}

.main-text {
	font-size: 0.9rem;
	color: #222;
	margin-bottom: 0.4rem;
}

.sub-text {
	font-size: 0.9rem;
	color: #222;
}

/* 公开课页面优惠券新样式------------end */

/* 公开课页面在线人数新样式------------start */
.live-participants {
	display: flex;
	align-items: center;
	padding: 0.5rem;
	z-index: 999;
	position: relative;
	width: 172px;
	margin: 0 auto;
}

.view-icon {
	width: 0.85rem;
	height: 0.65rem;
	margin-right: 0.3rem;
}

.participants-text {
	font-size: 0.8rem;
	color: #00FFFF;
	line-height: 1.1rem;
}

.live-content {
	display: flex;
	flex-direction: column;
	align-items: center;
/* 	margin-top: 8.5rem; */
}

.live-image {
	width: 5.9rem;
	height: 5rem;
}

.live-status {
	font-weight: 600;
	font-size: 1.4rem;
	color: #FFFFFF;
	line-height: 2rem;
	margin-top: 1.5rem;
	text-align: center;
}
/* 公开课页面在线人数新样式------------end */

/* 顶部倒计时区域样式 */
.top-countdown-bar {
    position: absolute;
    top: 43.2px;
    left: 0;
    width: 100%;
    height: 4.8rem;
    background: linear-gradient(270deg, #012C6B 0%, rgba(1,44,107,0.7) 50%, #012C6B 100%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 11;
    padding: 0 1rem;
    box-sizing: border-box;
}

.countdown-title {
    color: #FFFFFF;
    font-size: 1rem;
    font-weight: bold;
    text-align: center;
    margin-bottom: 0.5rem;
}

.countdown-display {
    display: flex;
    align-items: center;
    justify-content: center;
}

.top-countdown-bar .time-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 2.3rem;
    height: 2.5rem;
    background: linear-gradient(270deg, #F8D08C 0%, #F3AF3D 100%);
    border-radius: 0.5rem;
    margin: 0 0.2rem;
}

.top-countdown-bar .time-number {
    font-size: 1.2rem;
    font-weight: bold;
    color: #012C6B;
    line-height: 1;
    margin-bottom: 0.1rem;
}

.top-countdown-bar .time-unit {
    font-size: 0.7rem;
    color: #012C6B;
    line-height: 1;
    font-weight: bold;
}

.top-countdown-bar .time-separator {
    font-size: 1.2rem;
    color: #FFFFFF;
    font-weight: bold;
    margin: 0 0.2rem;
}

.viewnum {
    width: 2.2rem;
    height: 1.2rem;
    z-index: 999;
    position: fixed;
    top: 10.5rem;
    left: 3.3rem;
    color: #fff;
    line-height: 1rem;
    font-size: .4rem;
    text-align: center;
    background: url(../images/viewnum.png) no-repeat center center;
    background-size: contain;
    box-sizing: border-box;
    padding-top: .38rem;
}