/* Обратный отсчёт до начала трансляции: заставка поверх плеера и компактный таймер у кнопки. */

/* ---------- заставка поверх плеера (страница трансляции) ---------- */
.live-cover {
	position: absolute;
	inset: 0;
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 24px;
	overflow: hidden;
	color: #fff;
	text-align: center;
	background: #14121c;
	font-family: "Manrope", sans-serif;
	opacity: 1;
	transition: opacity 0.6s ease, visibility 0.6s ease;
}
.live-cover.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.live-cover__bg {
	position: absolute;
	inset: 0;
	background-position: center;
	background-size: cover;
	filter: blur(18px) saturate(1.1);
	transform: scale(1.12);
	opacity: 0.55;
}
.live-cover__bg::after {
	content: "";
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse at center, rgba(20, 18, 28, 0.35) 0%, rgba(20, 18, 28, 0.85) 100%);
}
.live-cover__body {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	max-width: 640px;
}
.live-cover__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.12);
	font: 700 12px/1.2 "Manrope", sans-serif;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	backdrop-filter: blur(6px);
}
.live-cover__eyebrow::before {
	content: "";
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #00C3C8;
	box-shadow: 0 0 0 0 rgba(0, 195, 200, 0.6);
	animation: live-pulse 1.8s ease-out infinite;
}
.live-cover__title {
	font: 700 22px/1.25 "Manrope", sans-serif;
	text-wrap: balance;
	opacity: 0.92;
}
.live-cover__timer {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	margin-top: 4px;
	font-variant-numeric: tabular-nums;
}
.live-cover__unit {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 84px;
	padding: 14px 10px 12px;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.1);
	backdrop-filter: blur(8px);
}
.live-cover__value {
	font: 700 44px/1 "Manrope", sans-serif;
	letter-spacing: -0.02em;
}
.live-cover__label {
	margin-top: 8px;
	font: 600 11px/1 "Manrope", sans-serif;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	opacity: 0.6;
}
.live-cover__sep {
	align-self: center;
	padding-bottom: 20px;
	font: 700 36px/1 "Manrope", sans-serif;
	opacity: 0.35;
	animation: live-blink 1s steps(2, start) infinite;
}
.live-cover__date {
	font: 600 14px/1.4 "Manrope", sans-serif;
	opacity: 0.7;
}
.live-cover__date b {
	font-weight: 700;
	opacity: 1;
}
.live-cover__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-top: 6px;
}
.live-cover__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 20px;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, 0.22);
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
	font: 700 14px/1 "Manrope", sans-serif;
	cursor: pointer;
	transition: background 0.25s ease, border-color 0.25s ease;
}
.live-cover__btn:hover {
	background: rgba(255, 255, 255, 0.16);
	border-color: rgba(255, 255, 255, 0.4);
	color: #fff;
	text-decoration: none;
}
.live-cover__btn svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
}
.live-cover__btn.is-done {
	background: rgba(0, 195, 200, 0.18);
	border-color: rgba(0, 195, 200, 0.5);
	cursor: default;
}
.live-cover__btn.is-loading {
	opacity: 0.6;
	pointer-events: none;
}
.live-cover__hint {
	font: 500 12px/1.4 "Manrope", sans-serif;
	opacity: 0.55;
}

/* последняя минута — крупные секунды */
.live-cover.is-final .live-cover__unit--d,
.live-cover.is-final .live-cover__unit--h,
.live-cover.is-final .live-cover__sep--d,
.live-cover.is-final .live-cover__sep--h {
	display: none;
}
.live-cover.is-final .live-cover__value {
	font-size: 64px;
}
.live-cover.is-final .live-cover__eyebrow::before {
	background: #FF1950;
	box-shadow: 0 0 0 0 rgba(255, 25, 80, 0.6);
	animation-duration: 0.9s;
}

/* момент старта */
.live-cover.is-starting .live-cover__timer,
.live-cover.is-starting .live-cover__date,
.live-cover.is-starting .live-cover__actions,
.live-cover.is-starting .live-cover__hint {
	display: none;
}
.live-cover__starting {
	display: none;
	flex-direction: column;
	align-items: center;
	gap: 14px;
}
.live-cover.is-starting .live-cover__starting {
	display: flex;
}
.live-cover__spinner {
	width: 44px;
	height: 44px;
	border: 3px solid rgba(255, 255, 255, 0.18);
	border-top-color: #00C3C8;
	border-radius: 50%;
	animation: live-spin 0.9s linear infinite;
}

@keyframes live-pulse {
	0% { box-shadow: 0 0 0 0 rgba(0, 195, 200, 0.6); }
	70% { box-shadow: 0 0 0 10px rgba(0, 195, 200, 0); }
	100% { box-shadow: 0 0 0 0 rgba(0, 195, 200, 0); }
}
@keyframes live-blink {
	to { opacity: 0.1; }
}
@keyframes live-spin {
	to { transform: rotate(360deg); }
}

/* ---------- компактный таймер у кнопки (страница мероприятия) ---------- */
.live-badge {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 10px 16px;
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.18);
	color: #fff;
	font: 600 14px/1.2 "Manrope", sans-serif;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	backdrop-filter: blur(6px);
}
.live-badge__dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #00C3C8;
	animation: live-pulse 1.8s ease-out infinite;
	flex-shrink: 0;
}
.live-badge__value {
	font-weight: 700;
	letter-spacing: 0.02em;
}
.live-badge.is-live {
	background: #FF1950;
	border-color: #FF1950;
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 0.06em;
}
.live-badge.is-live .live-badge__dot {
	background: #fff;
	animation-name: live-pulse-white;
}
.live-badge.is-hidden {
	display: none;
}
@keyframes live-pulse-white {
	0% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
	70% { box-shadow: 0 0 0 8px rgba(255, 255, 255, 0); }
	100% { box-shadow: 0 0 0 0 rgba(255, 255, 255, 0); }
}

/* кнопка «Смотреть трансляцию» подсвечивается, когда эфир идёт */
.projects-block-main__button.is-live-now {
	background-color: #FF1950;
	animation: live-glow 2s ease-in-out infinite;
}
@keyframes live-glow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(255, 25, 80, 0); }
	50% { box-shadow: 0 0 0 8px rgba(255, 25, 80, 0.25); }
}

/* ---------- адаптив ---------- */
@media (max-width: 1190px) {
	.live-cover__value { font-size: 36px; }
	.live-cover__unit { min-width: 68px; padding: 12px 8px 10px; }
	.live-cover__sep { font-size: 28px; padding-bottom: 18px; }
	.live-cover__title { font-size: 18px; }
	.live-cover.is-final .live-cover__value { font-size: 52px; }
}
@media (max-width: 640px) {
	/* на телефоне 16:9-контейнер слишком низкий: заставка берёт высоту по контенту, плеер под ней всё равно скрыт */
	.lecture-page__video.has-live-cover { padding-bottom: 0 !important; height: auto; }
	.live-cover { position: relative; inset: auto; min-height: 240px; padding: 20px 16px; border-radius: 12px; }
	.lecture-page__video.has-live-cover iframe { display: none; }
	.live-cover.is-hidden { display: none; }
	.live-cover__body { gap: 12px; }
	.live-cover__eyebrow { font-size: 10px; padding: 5px 10px; }
	.live-cover__title { font-size: 15px; }
	.live-cover__timer { gap: 4px; }
	.live-cover__unit { min-width: 54px; padding: 8px 6px 7px; border-radius: 10px; }
	.live-cover__value { font-size: 24px; }
	.live-cover__label { font-size: 9px; margin-top: 5px; }
	.live-cover__sep { font-size: 20px; padding-bottom: 14px; }
	.live-cover__date { font-size: 12px; }
	.live-cover__actions { gap: 8px; }
	.live-cover__btn { padding: 10px 12px; font-size: 12px; }
	.live-cover__hint { display: none; }
	.live-cover.is-final .live-cover__value { font-size: 40px; }
	.live-badge { padding: 8px 12px; font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
	.live-cover__eyebrow::before, .live-cover__sep, .live-badge__dot, .projects-block-main__button.is-live-now { animation: none; }
}
