/**
 * video_player 组件样式
 *
 * 替代 Bootstrap .embed-responsive .embed-responsive-16by9，
 * 通过 padding-top 实现 16:9 宽高比，兼容旧版浏览器。
 */
.rfzj_video_player {
	display: block;
	width: 100%;
}

/* 16:9 视频帧容器（用于 <video> 和 iframe） */
.rfzj_video_player__frame {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	overflow: hidden;
	background-color: #000;
	background-position: center;
	/* 16:9 = 56.25% */
	padding-top: 56.25%;
}

.rfzj_video_player__frame video,
.rfzj_video_player__frame iframe,
.rfzj_video_player__frame embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
	object-fit: contain;
}

/* 视频链接封面 */
.rfzj_video_player__link {
	position: relative;
	display: block;
	width: 100%;
	overflow: hidden;
	background: #000;
	text-align: center;
	text-decoration: none;
	/* 16:9 = 56.25% */
	padding-top: 56.25%;
}

.rfzj_video_player__thumb {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

.rfzj_video_player__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 播放按钮覆盖 */
.rfzj_video_player__play {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	font-size: 64px;
	color: rgba(255, 255, 255, 0.9);
	text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
	pointer-events: none;
	line-height: 1;
}

.rfzj_video_player__play .fa,
.rfzj_video_player__play-icon {
	font-size: inherit;
	width: 1em;
	height: 1em;
}

.rfzj_video_player__link:hover .rfzj_video_player__play {
	color: #fff;
}

@media (max-width: 640px) {
	.rfzj_video_player__play {
		font-size: 48px;
	}
}
