/* Prometheus PeerTube Embed v0.3.0 */
.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;
	/* `inherit` = pick up the host theme's text color. Override in child
	 * theme if the inherited color is wrong (e.g., the host applies a
	 * forced color on <details> that doesn't match its body text). */
	--ppt-description-color: inherit;
}

.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;
}

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