/**
 * Front-end-only styles.
 *
 * These intentionally do NOT load in the block editor: they hide elements that
 * theme JS reveals at runtime, and set document-level overflow. editor.css
 * keeps the same elements visible so they stay editable.
 */

/* Full-bleed sections and the horizontally-scrolling media track can push the
   document wider than the viewport. `clip` (not `hidden`) contains it without
   creating a scroll container, so position: sticky keeps working. */
html,
body {
	overflow-x: clip;
	max-width: 100%;
}

/* Reserve the scrollbar gutter permanently so locking scroll for a modal does
   not shift the layout sideways when the bar disappears. */
html {
	scrollbar-gutter: stable;
}

/* Scroll lock for the team profile modal.
   The document scrolls on <html>, and a body-level `overflow: hidden` only
   propagates to the viewport while html's overflow is `visible` - which the
   `overflow-x: clip` above prevents. So the lock has to sit on the scrolling
   element itself. Scroll position is preserved (unlike a position:fixed lock). */
html.rga-modal-open,
html.rga-modal-open body {
	overflow: hidden;
}

.rga-media-scroller { overflow-y: hidden; }

/* The player is revealed by theme JS when the poster is clicked. */
.rga-video__player { display: none; }

.rga-video.is-playing .rga-video__poster { display: none; }

.rga-video.is-playing .rga-video__player { display: block; }

/* The dropdown is revealed by theme JS when the toggle is tapped. Geometry
   lives in blocks.css; only the resting state is front-end-only. */
.rga-menu-panel {
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	/* visibility is delayed on close so the fade is seen, but flips instantly on
	   open - otherwise it is still `hidden` when the script moves focus to the
	   first link, and focus into a hidden subtree is silently dropped. */
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0.25s;
}

.is-menu-open .rga-menu-panel {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0s linear 0s;
}

/* The controls stay put in the new design - the toggle itself becomes the
   close button, so nothing is hidden behind the dropdown. */