/* ===========================
   PLAYER OPCION 7 (independiente)
=========================== */

#op7-player{
	width:100%;
	height:100%;
	background:#000;
	position:relative;
	border-radius:8px;
	overflow:hidden;
}

#op7-player video{
	width:100%;
	height:100%;
	display:block;
	background:#000;
	object-fit:contain;
}

#op7-player .op7-controls{
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	padding:12px 15px;
	background:linear-gradient(transparent, rgba(0,0,0,.85));
	display:flex;
	align-items:center;
	gap:10px;
}

#op7-player .op7-btn{
	width:38px;
	height:38px;
	min-width:38px;
	border:0;
	border-radius:50%;
	background:#e50914;
	color:#fff;
	font-size:16px;
	cursor:pointer;
	display:flex;
	align-items:center;
	justify-content:center;
	padding:0;
}

#op7-player .op7-seek{
	flex:1 1 auto;
	-webkit-appearance:none;
	appearance:none;
	height:4px;
	border-radius:2px;
	background:rgba(255,255,255,.3);
	outline:none;
	cursor:pointer;
}

#op7-player .op7-seek::-webkit-slider-thumb{
	-webkit-appearance:none;
	appearance:none;
	width:13px;
	height:13px;
	border-radius:50%;
	background:#e50914;
	cursor:pointer;
}

#op7-player .op7-seek::-moz-range-thumb{
	width:13px;
	height:13px;
	border:0;
	border-radius:50%;
	background:#e50914;
	cursor:pointer;
}

#op7-player .op7-time{
	color:#fff;
	font-size:12px;
	white-space:nowrap;
	min-width:42px;
	text-align:center;
}

/* ---- Overlay unificado: play / loading / error ---- */

#op7-player .op7-overlay{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	z-index:3;
	background:rgba(0,0,0,.35);
	opacity:1;
	transition:opacity .25s ease;
}

#op7-player .op7-overlay.op7-state-hidden{
	opacity:0;
	pointer-events:none;
}

#op7-player .op7-overlay-play,
#op7-player .op7-overlay-loading,
#op7-player .op7-overlay-error{
	display:none;
}

#op7-player .op7-overlay.op7-state-play .op7-overlay-play{ display:flex; }
#op7-player .op7-overlay.op7-state-loading .op7-overlay-loading{ display:flex; }
#op7-player .op7-overlay.op7-state-error .op7-overlay-error{ display:flex; }

/* Boton central de play */

#op7-player .op7-overlay-play{
	width:72px;
	height:72px;
	min-width:72px;
	border:0;
	border-radius:50%;
	background:rgba(229,9,20,.9);
	color:#fff;
	cursor:pointer;
	align-items:center;
	justify-content:center;
	box-shadow:0 4px 18px rgba(0,0,0,.5);
	transition:transform .15s ease, background .15s ease;
}

#op7-player .op7-overlay-play:hover{
	background:#e50914;
	transform:scale(1.06);
}

#op7-player .op7-overlay-play-icon{
	font-size:28px;
	line-height:1;
	margin-left:4px;
}

/* Bloque de carga: spinner + mensaje + subtitulo */

#op7-player .op7-overlay-loading{
	flex-direction:column;
	align-items:center;
	gap:10px;
	padding:0 20px;
	text-align:center;
}

#op7-player .op7-spinner{
	width:40px;
	height:40px;
	border:3px solid rgba(255,255,255,.25);
	border-top-color:#e50914;
	border-radius:50%;
	animation:op7-spin .8s linear infinite;
}

#op7-player .op7-overlay-text{
	color:#fff;
	font-size:15px;
	font-weight:600;
	margin:0;
}

#op7-player .op7-overlay-subtitle{
	color:rgba(255,255,255,.75);
	font-size:12.5px;
	margin:0;
	max-width:320px;
	line-height:1.4;
}

/* Bloque de error */

#op7-player .op7-overlay-error{
	flex-direction:column;
	align-items:center;
	gap:10px;
	padding:0 20px;
	text-align:center;
}

#op7-player .op7-overlay-icon-warning{
	font-size:32px;
	line-height:1;
	color:#ffb300;
}

#op7-player .op7-retry-btn{
	margin-top:4px;
	border:0;
	border-radius:20px;
	padding:8px 22px;
	background:#e50914;
	color:#fff;
	font-size:13px;
	font-weight:600;
	cursor:pointer;
}

#op7-player .op7-retry-btn:hover{
	background:#ff1f2b;
}

@media (max-width:480px){

	#op7-player .op7-overlay-play{
		width:56px;
		height:56px;
		min-width:56px;
	}

	#op7-player .op7-overlay-play-icon{
		font-size:22px;
	}

	#op7-player .op7-overlay-text{
		font-size:13.5px;
	}

	#op7-player .op7-overlay-subtitle{
		font-size:11.5px;
	}

}

@keyframes op7-spin{
	from{ transform:rotate(0deg); }
	to{ transform:rotate(360deg); }
}

/* ---- Dialogo "Continuar reproduccion" ---- */

#op7-player .op7-resume-dialog{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:5;
	display:flex;
	align-items:center;
	justify-content:center;
	background:rgba(0,0,0,.65);
	padding:16px;
}

#op7-player .op7-resume-box{
	background:#161616;
	border-radius:10px;
	padding:22px 24px;
	max-width:340px;
	width:100%;
	text-align:center;
	box-shadow:0 8px 30px rgba(0,0,0,.6);
}

#op7-player .op7-resume-title{
	color:#fff;
	font-size:16px;
	font-weight:700;
	margin:0 0 6px;
}

#op7-player .op7-resume-message{
	color:rgba(255,255,255,.75);
	font-size:13px;
	margin:0 0 16px;
}

#op7-player .op7-resume-buttons{
	display:flex;
	flex-direction:column;
	gap:8px;
}

#op7-player .op7-resume-btn{
	border:0;
	border-radius:20px;
	padding:10px 18px;
	font-size:13px;
	font-weight:600;
	cursor:pointer;
}

#op7-player .op7-resume-btn-primary{
	background:#e50914;
	color:#fff;
}

#op7-player .op7-resume-btn-primary:hover{
	background:#ff1f2b;
}

#op7-player .op7-resume-btn-secondary{
	background:transparent;
	color:rgba(255,255,255,.85);
	border:1px solid rgba(255,255,255,.3);
}

#op7-player .op7-resume-btn-secondary:hover{
	background:rgba(255,255,255,.08);
}

@media (max-width:480px){

	#op7-player .op7-resume-box{
		padding:18px 20px;
	}

	#op7-player .op7-resume-title{
		font-size:14.5px;
	}

	#op7-player .op7-resume-message{
		font-size:12px;
	}

}
