/* papion-ap-tv single views (Serie + episode): designer series intro, episode card, related list. Needs base.css. */
.aptv-view {
	--aptv-w-body: 400;
	--aptv-w-head: 600;
	--aptv-w-label: 850;
	min-width: 0;
}
.aptv-view__empty { color: var(--aptv-muted); }
.aptv-view__episodes { margin-top: 32px; }

/* Serie intro. */
.aptv-intro {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, min(44%, 420px));
	grid-template-areas: "brand cover" "copy cover";
	grid-template-rows: auto 1fr;
	gap: 36px 32px;
	padding: 20px 20px 24px;
	overflow: hidden;
	border-radius: 12px;
	background: var(--aptv-header-gradient);
	box-shadow: 0 14px 35px #0d2b5020;
	color: #fff;
}
.aptv-intro--noimage { grid-template-columns: minmax(0, 1fr); grid-template-areas: "brand" "copy"; }
.aptv-intro__brand { grid-area: brand; display: flex; align-items: flex-start; min-width: 0; }
.aptv-intro__copy { grid-area: copy; display: flex; flex-direction: column; gap: 18px; align-items: flex-start; align-self: stretch; min-width: 0; }
.aptv-intro__image {
	grid-area: cover;
	align-self: end;
	justify-self: end;
	position: relative;
	width: 100%;
	max-width: 420px;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border: 1px solid #ffffff24;
	border-radius: 8px;
	background: var(--aptv-blue);
	box-shadow: 0 12px 32px #031a3a30;
}
.aptv-intro__img { position: absolute; inset: 0; display: block; width: 100%; max-width: none; height: 100%; object-fit: contain; }
.aptv-scope .aptv-intro__title {
	display: inline-block;
	max-width: 100%;
	margin: 0;
	padding: 4px 9px 6px;
	color: #fff;
	font-family: var(--aptv-font-head);
	font-size: 20px;
	font-weight: var(--aptv-w-head);
	line-height: 1.2;
	letter-spacing: .3px;
	text-transform: uppercase;
	overflow-wrap: anywhere;
}
.aptv-scope .aptv-intro__summary {
	margin: 0;
	color: #fff;
	font-family: var(--aptv-font-head);
	font-size: clamp(24px, 2.6cqi, 30px);
	font-weight: var(--aptv-w-head);
	line-height: 1.12;
	overflow-wrap: anywhere;
}
.aptv-scope .aptv-intro__description { max-width: 65ch; color: #c8dce7; font-size: 14px; line-height: 1.5; }
.aptv-scope .aptv-intro__description p { margin: 0 0 .6em; }
.aptv-scope .aptv-intro__count {
	display: inline-block;
	margin-top: auto;
	padding: 3px 8px 5px;
	color: #fff;
	font-family: var(--aptv-font-head);
	font-size: 16px;
	font-weight: var(--aptv-w-head);
	line-height: 1.1;
	text-transform: uppercase;
	white-space: nowrap;
}
@container (max-width: 680px) {
	.aptv-intro { grid-template-columns: minmax(0, 1fr); grid-template-areas: "brand" "cover" "copy"; grid-template-rows: auto; padding: 16px; gap: 20px; }
	.aptv-intro__image { justify-self: start; }
	.aptv-scope .aptv-intro__title { font-size: 18px; }
	.aptv-scope .aptv-intro__description { font-size: 13px; }
}
@container (max-width: 500px) {
	.aptv-scope .aptv-intro__summary { font-size: 26px; line-height: 1.12; }
}

/* Episode card. */
.aptv-episode {
	min-width: 0;
	overflow: hidden;
	border: 1px solid var(--aptv-line);
	border-radius: 10px;
	background: var(--aptv-surface);
}
.aptv-episode__brandbar { display: flex; align-items: center; padding: 20px; background: var(--aptv-header-gradient); color: #fff; }
.aptv-episode .aptv-player { border-radius: 0; background: #071d33; }
.aptv-episode__info { padding: 22px; border-top: 4px solid var(--aptv-teal); }
.aptv-episode__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin-bottom: 16px;
	color: var(--aptv-blue);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.4;
}
.aptv-scope .aptv-episode__meta .aptv-label { font-size: 14px; padding: 6px 10px; }
.aptv-episode__facts {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 8px 10px;
	max-width: 100%;
	margin-left: auto;
	color: var(--aptv-muted);
	font-weight: 600;
}
.aptv-episode__facts time { padding: 5px 10px; border-radius: 3px; background: var(--aptv-soft); font-variant-numeric: tabular-nums; }
.aptv-scope .aptv-episode__title {
	margin: 0;
	color: var(--aptv-blue);
	font-family: var(--aptv-font-head);
	font-size: clamp(26px, 3.8cqi, 36px);
	font-weight: 500;
	line-height: 1.2;
	letter-spacing: -.3px;
	text-transform: none;
	overflow-wrap: anywhere;
}
.aptv-episode__description { padding: 0 22px 24px; color: var(--aptv-ink); font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; }
.aptv-episode__description > :first-child { margin-top: 0; }
.aptv-episode__description > :last-child { margin-bottom: 0; }
.aptv-scope .aptv-episode__description p { margin: 0 0 1em; }
.aptv-scope .aptv-episode__description a { color: var(--aptv-teal-dark); text-decoration: underline; }
@container (max-width: 680px) {
	.aptv-episode__info { padding: 16px; }
	.aptv-episode__meta { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
	.aptv-scope .aptv-episode__meta .aptv-label { align-self: center; justify-self: start; min-width: 0; max-width: 100%; margin-left: 0; padding: 5px 6px; font-size: 11px; letter-spacing: .2px; }
	.aptv-episode__meta .aptv-label > span { display: block; overflow: visible; }
	.aptv-episode__facts { grid-column: 2; flex-wrap: nowrap; gap: 5px; margin-left: 0; font-size: 12px; white-space: nowrap; }
	.aptv-episode__facts time { padding: 5px 6px; }
	.aptv-episode__brandbar { padding: 16px; }
	.aptv-episode__description { padding: 0 16px 20px; }
}

/* Related episodes (compact rows). Also used standalone below the content of block themes. */
.aptv-related { padding: 20px 22px 22px; border-top: 1px solid var(--aptv-line); background: var(--aptv-soft); }
.aptv-related__heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-bottom: 24px; }
.aptv-related__heading::after { content: ""; flex: 1; min-width: 24px; height: 2px; background: linear-gradient(90deg, var(--aptv-teal), var(--aptv-line)); }
.aptv-scope .aptv-related__title {
	margin: 0;
	padding: 4px 9px 6px;
	color: #fff;
	font-family: var(--aptv-font-head);
	font-size: 22px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: .2px;
	text-transform: uppercase;
}
.aptv-list--related { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.aptv-list--related .aptv-card--episodio {
	display: grid;
	grid-template-columns: minmax(0, 30%) minmax(0, 1fr);
	align-items: stretch;
	height: auto;
	box-shadow: none;
}
.aptv-list--related .aptv-card__media { aspect-ratio: auto; min-height: 88px; min-width: 0; }
.aptv-list--related .aptv-card__body { justify-content: center; gap: 0; padding: 10px 12px; }
.aptv-scope .aptv-list--related .aptv-card__title { font-size: 24px; font-weight: 600; -webkit-line-clamp: 3; }
.aptv-list--related .aptv-card__duration { bottom: 4px; left: 4px; }
.aptv-list--related .aptv-play--small { --aptv-play-size: 28px; right: 4px; bottom: 4px; padding: 2px; }
.aptv-list--related .aptv-play--small svg { width: 13px; height: 13px; }
@container (max-width: 950px) {
	.aptv-scope .aptv-list--related .aptv-card__title { font-size: 21px; }
}
@container (max-width: 680px) {
	.aptv-related { padding: 16px; }
	.aptv-scope .aptv-related__title { font-size: 20px; }
	.aptv-list--related { grid-template-columns: minmax(0, 1fr); gap: 10px; }
	.aptv-list--related .aptv-card--episodio { grid-template-columns: minmax(0, 28%) minmax(0, 1fr); }
	.aptv-list--related .aptv-card__media { min-height: 78px; }
	.aptv-list--related .aptv-card__body { padding: 10px; }
	.aptv-scope .aptv-list--related .aptv-card__title { display: block; overflow: visible; font-size: 20px; line-height: 1.25; }
}
@container (max-width: 370px) {
	.aptv-scope .aptv-list--related .aptv-card__title { font-size: 19px; }
}