/* Prometheus PeerTube Embed v0.4.2 */
.prometheus-peertube {
	/* Theme-overridable knobs. Avada exposes --awb-color* on :root in v7+. */
	--ppt-aspect: 16 / 9;
	--ppt-bg: var(--awb-color1, #000);
	--ppt-fg: var(--awb-color8, #fff);
	--ppt-gap: 0.75rem;

	display: flex;
	flex-direction: column;
	gap: var(--ppt-gap);
	color: var(--ppt-fg);
	max-width: 100%;
}

.prometheus-peertube .ppt-player-wrap {
	position: relative;
	aspect-ratio: var(--ppt-aspect);
	background: var(--ppt-bg);
	border-radius: 0.25rem;
	overflow: hidden;
}

.prometheus-peertube .ppt-player {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	border: 0;
	background: #000;
}

/* Theme override hooks. Child themes set these on `.prometheus-peertube`
 * (or any ancestor) to restyle the description toggle and body without
 * having to touch the plugin's stylesheet. Defaults below produce a
 * readable, theme-agnostic light pill that works on any host. */
.prometheus-peertube {
	--ppt-toggle-bg: #fff;
	--ppt-toggle-color: #000;
	--ppt-toggle-border: rgba(0, 0, 0, 0.15);
	--ppt-toggle-bg-hover: #f4f4f4;
	--ppt-toggle-focus-ring: #1851b4;
	--ppt-toggle-radius: 0.3rem;
	/* Description body reads as slightly-dim gray against dark themes so
	 * that white anchor links pop against it. Override in child theme if
	 * the site's body color scheme conflicts. */
	--ppt-description-color: #c8c8c8;
	--ppt-description-link-color: #ffffff;
}

.prometheus-peertube .ppt-description {
	border-top: 1px solid rgba(127, 127, 127, 0.25);
	padding-top: 0.75rem;
	/* Centers the inline-block <summary> beneath the player. Body text
	 * is realigned left below so paragraph copy reads normally. */
	text-align: center;
}

/* Description toggle — self-contained button driven by CSS vars above.
 * Per-site styling lives in the child theme; plugin ships sensible
 * cross-theme defaults. */
.prometheus-peertube .ppt-description summary {
	cursor: pointer;
	font-weight: 600;
	padding: 0.4rem 0.85rem;
	list-style: none;
	background: var(--ppt-toggle-bg);
	color: var(--ppt-toggle-color);
	border: 1px solid var(--ppt-toggle-border);
	border-radius: var(--ppt-toggle-radius);
	display: inline-block;
	line-height: 1.2;
	user-select: none;
	transition: background 150ms ease, border-color 150ms ease;
}

.prometheus-peertube .ppt-description summary:hover {
	background: var(--ppt-toggle-bg-hover);
}

.prometheus-peertube .ppt-description summary:focus-visible {
	outline: 2px solid var(--ppt-toggle-focus-ring);
	outline-offset: 1px;
}

.prometheus-peertube .ppt-description summary::-webkit-details-marker {
	display: none;
}

.prometheus-peertube .ppt-description summary::before {
	content: "▸";
	display: inline-block;
	margin-right: 0.5rem;
	color: var(--ppt-toggle-color);
	transition: transform 150ms ease;
}

.prometheus-peertube .ppt-description[open] summary::before {
	transform: rotate(90deg);
}

.prometheus-peertube .ppt-description-body {
	padding: 0.75rem 0 0;
	line-height: 1.5;
	/* Reset the centered alignment inherited from .ppt-description so
	 * the prose underneath reads as normal body copy, not a centered block. */
	text-align: left;
	color: var(--ppt-description-color);
}

.prometheus-peertube .ppt-description-body p:last-child {
	margin-bottom: 0;
}

/* Anchors inside the dropdown body: white so they pop against the dimmer
 * body copy, underlined for affordance, underline drops on hover/focus. */
/*.prometheus-peertube .ppt-description-body a,
.prometheus-peertube .ppt-description-body a:visited {
	color: var(--ppt-description-link-color);
	text-decoration: underline;
}*/

.prometheus-peertube .ppt-description-body a:hover,
.prometheus-peertube .ppt-description-body a:focus {
	text-decoration: none;
}

.prometheus-peertube-error {
	font-family: monospace;
	font-size: 0.85rem;
}