/* Rugby Player Profiles — front-end styling for the [rpp_player_videos],
   [rpp_coach_videos] and [rpp_coach_history] shortcodes.
   Feel free to override any of this from your theme / Elementor's custom CSS. */

.rpp-video-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 20px;
	margin: 20px 0;
}

.rpp-video-grid__frame {
	position: relative;
	width: 100%;
	padding-top: 56.25%; /* 16:9 */
	border-radius: 8px;
	overflow: hidden;
	background: #000;
}

.rpp-video-grid__frame iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

/* [rpp_player_gallery] — a fixed 3-across grid (per the client's explicit
   "three photos next to each other" spec) rather than the auto-fit grid used
   for videos, so 3 or 6 photos read as one or two clean rows. Collapses to
   fewer columns on narrower viewports since a rigid 3-up grid gets cramped on
   mobile — the "two rows" guidance is about the intended desktop layout, a
   phone showing 2-up instead doesn't break that intent. */
.rpp-player-gallery {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 12px;
	margin: 20px 0;
}

@media (max-width: 640px) {
	.rpp-player-gallery {
		grid-template-columns: repeat(2, 1fr);
	}
}

.rpp-player-gallery__item {
	display: block;
	position: relative;
	padding-top: 100%;
	border-radius: 8px;
	overflow: hidden;
	background: #000;
}

.rpp-player-gallery__item img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.2s ease;
}

.rpp-player-gallery__item:hover img {
	transform: scale(1.04);
}

.rpp-history-timeline {
	list-style: none;
	margin: 20px 0;
	padding: 0;
	border-left: 3px solid #c9a227;
}

.rpp-history-timeline__item {
	position: relative;
	padding: 0 0 18px 22px;
}

.rpp-history-timeline__item::before {
	content: "";
	position: absolute;
	left: -8px;
	top: 4px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: #1a5632;
	border: 2px solid #fff;
}

.rpp-history-timeline__years {
	display: block;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #8a8f8c;
	margin-bottom: 2px;
}

.rpp-history-timeline__detail {
	display: block;
	font-size: 15px;
}

/* Training Program — weekly schedule */
.rpp-program {
	font-family: inherit;
}

.rpp-program-empty {
	padding: 16px;
	background: #f7f8f7;
	border-radius: 8px;
	color: #767b78;
}

.rpp-program__title {
	margin: 0 0 6px;
}

.rpp-program__intro {
	margin: 0 0 20px;
	color: #55605c;
}

.rpp-program-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 14px;
	align-items: start;
}

.rpp-program-day {
	background: #fbfbfa;
	border: 1px solid #e5e8e5;
	border-radius: 10px;
	overflow: hidden;
}

.rpp-program-day__name {
	background: #3D3E85;
	color: #fff;
	font-weight: 700;
	font-size: 13px;
	letter-spacing: 0.03em;
	text-transform: uppercase;
	text-align: center;
	padding: 10px 8px;
}

.rpp-program-day__slots {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 10px;
}

.rpp-slot-card {
	border-left: 4px solid #94a3ad;
	border-radius: 6px;
	padding: 8px 10px;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.rpp-slot-card.is-empty {
	opacity: 0.65;
}

.rpp-slot-card__time {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #55605c;
}

.rpp-slot-card__title {
	font-size: 14px;
	font-weight: 600;
	color: #1f2724;
}

.rpp-slot-card__coach {
	font-size: 12px;
	color: #6b716e;
}

.rpp-program-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 18px;
	padding-top: 14px;
	border-top: 1px solid #e5e8e5;
}

.rpp-program-legend__item {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 12px;
	color: #55605c;
}

.rpp-program-legend__dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	display: inline-block;
}

.rpp-program-contacts {
	margin-top: 18px;
	padding-top: 14px;
	border-top: 1px solid #e5e8e5;
}

.rpp-program-contacts__title {
	margin: 0 0 8px;
	font-size: 14px;
}

.rpp-program-contacts__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 24px;
	font-size: 13px;
	color: #55605c;
}

/* ==========================================================================
   Colour & font controls for the [rpp_player_name] / [rpp_player_stats]
   SHORTCODES only. If you're using the imported single-player template, the
   name is a native Heading widget and the stats are the native "Player
   Stats" widget — both styled directly from Elementor's own Style tab, and
   these CSS variables have no effect on them. This block only matters if
   you've deliberately used the raw shortcodes instead (see SETUP-GUIDE.md).

   Every value below has a sensible default, but is driven by a CSS variable
   so you can override just the colours you want — paste new values for any
   of these into Elementor's Site Settings -> Custom CSS (or a page's Advanced
   -> Custom CSS in Elementor Pro) without touching this file. Example:

     :root {
       --rpp-name-first-color: #ffffff;
       --rpp-name-last-color: #c9a227;
       --rpp-stat-label-color: rgba(255, 255, 255, 0.75);
       --rpp-stat-value-color: #ffffff;
     }
   ========================================================================== */
:root {
	--rpp-name-first-color: #ffffff;
	--rpp-name-last-color: #c9a227;
	--rpp-name-font-family: inherit;

	--rpp-stat-card-bg: rgba(0, 0, 0, 0.28);
	--rpp-stat-card-border: rgba(255, 255, 255, 0.18);
	--rpp-stat-label-color: rgba(255, 255, 255, 0.75);
	--rpp-stat-value-color: #ffffff;
}

/* Player hero — full-bleed photo with a gradient overlay and the name sitting
   on top of the image, sports-card style (photo + name are two shortcodes
   stacked in one Elementor column tagged "rpp-hero-col" — see the imported
   single-player template). Falls back gracefully to a plain stacked layout
   anywhere the "rpp-hero-col" wrapper isn't present. */
.rpp-hero-col {
	position: relative;
	overflow: hidden;
	min-height: 560px;
	display: flex;
	align-items: flex-end;
}

.rpp-hero-col::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to bottom, rgba(18, 61, 35, 0) 35%, rgba(10, 20, 14, 0.55) 70%, rgba(6, 14, 10, 0.88) 100%);
	pointer-events: none;
	z-index: 1;
}

.rpp-hero-col .rpp-player-photo {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.rpp-hero-col .rpp-player-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	max-width: none;
}

.rpp-hero-col .rpp-player-photo--placeholder {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	aspect-ratio: auto;
}

/* The hero name is two separate native Heading widgets (first name, surname)
   stacked in the hero column — this just keeps them above the gradient
   overlay, removes the browser's default heading margins so they sit snugly
   together, and adds breathing room below the last one. Color, size and
   weight are all set on each Heading widget's own Style tab in Elementor. */
.rpp-hero-col .elementor-widget-heading {
	position: relative;
	z-index: 2;
	padding: 0 40px;
}

.rpp-hero-col .elementor-widget-heading:last-child {
	padding-bottom: 32px;
}

.rpp-hero-col .elementor-heading-title {
	margin: 0;
	line-height: 1.05;
}

/* Player hero photo — fallback styling when used outside .rpp-hero-col
   (e.g. if you rebuild the hero manually with photo/name in separate columns) */
.rpp-player-photo img {
	display: block;
	width: 100%;
	max-width: 420px;
	height: auto;
}

.rpp-player-photo--placeholder {
	width: 100%;
	max-width: 420px;
	aspect-ratio: 3 / 4;
	background: rgba(255, 255, 255, 0.08);
	display: flex;
	align-items: center;
	justify-content: center;
}

.rpp-player-photo--placeholder .dashicons {
	font-size: 96px;
	width: 96px;
	height: 96px;
	color: rgba(255, 255, 255, 0.35);
}

/* Player hero name — an <h1>, so it inherits your theme's own heading font,
   weight and size automatically. Only the two name colours are set here
   (via --rpp-name-first-color / --rpp-name-last-color, see the :root block
   above) — no outline/stroke effect, no forced font, so it matches your
   theme's typography by default no matter what background colour you use. */
.rpp-player-name {
	display: inline-block;
	line-height: 1.15;
	margin: 0;
	font-family: var(--rpp-name-font-family);
}

.rpp-player-name__first {
	color: var(--rpp-name-first-color);
	display: block;
}

.rpp-player-name__last {
	color: var(--rpp-name-last-color);
	display: block;
}

.rpp-player-name--single {
	color: var(--rpp-name-last-color);
}

/* Player stat-card row (Age / Position / Height / Weight / Caps / Points).
   Cards use a dark semi-transparent overlay (not a light one), so the white
   label/value text stays readable regardless of what colour the section
   behind it is — navy, gold, dark green, all work without extra tweaking.
   Override --rpp-stat-card-bg / --rpp-stat-label-color / --rpp-stat-value-color
   in the :root block above if you want a light-card look instead.

   Sizing is deliberately NOT a fixed width per card. Every card starts with
   equal grow/shrink (flex: 1 1 0%) and no min-width override, so the browser
   falls back to its default "auto" minimum — which is each card's own text
   width (thanks to white-space: nowrap on the label/value below). A short
   value like "24" settles to a narrow card; a long one like "Loose Forward"
   or "Blindside Flanker" simply claims the width it actually needs, and its
   neighbours share whatever's left — without ever overlapping or wrapping
   onto a second line. On narrow screens, flex-wrap lets cards that no longer
   fit drop to a new row instead of getting squeezed unreadably thin, and the
   label/value font sizes scale down slightly with viewport width. */
.rpp-player-stats {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 24px 0;
}

.rpp-player-stats__card {
	background: var(--rpp-stat-card-bg);
	border: 1px solid var(--rpp-stat-card-border);
	border-radius: 10px;
	padding: 14px 20px;
	flex: 1 1 0%;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.rpp-player-stats__label {
	font-size: clamp(10px, 1.6vw, 11px);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	white-space: nowrap;
	color: var(--rpp-stat-label-color);
}

.rpp-player-stats__value {
	font-size: clamp(16px, 2.6vw, 22px);
	font-weight: 800;
	color: var(--rpp-stat-value-color);
	text-transform: uppercase;
	white-space: nowrap;
}

@media (max-width: 480px) {
	.rpp-player-stats {
		gap: 8px;
	}

	.rpp-player-stats__card {
		padding: 10px 14px;
	}
}

/* [rpp_player_background] — same card language and CSS variables as
   .rpp-player-stats (re-skins together automatically), but its own class so
   the two can still be positioned/styled independently — this one is meant
   to sit further down the page, below Bio & Highlights. Values here are
   free text (school/club names) rather than short stats, so — unlike
   .rpp-player-stats__value — this does NOT force uppercase/nowrap, since a
   longer school name needs to wrap normally instead of overflowing. */
.rpp-player-background {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 24px 0;
}

.rpp-player-background__card {
	background: var(--rpp-stat-card-bg);
	border: 1px solid var(--rpp-stat-card-border);
	border-radius: 10px;
	padding: 14px 20px;
	flex: 1 1 200px;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.rpp-player-background__label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--rpp-stat-label-color);
}

.rpp-player-background__value {
	font-size: 16px;
	font-weight: 700;
	color: var(--rpp-stat-value-color);
}

/* [rpp_player_career_primary] / [rpp_player_career_high] / [rpp_player_career_pro]
   — a plain From/To/Position/Info table. On narrow screens it drops the
   header row and relabels each cell from its data-label attribute instead,
   since a 4-column table doesn't fit a phone width, but a career résumé still
   reads naturally as a stack of labelled rows. */
.rpp-career-table {
	width: 100%;
	border-collapse: collapse;
	margin: 16px 0;
	background: var(--rpp-stat-card-bg);
	border-radius: 10px;
	overflow: hidden;
}

.rpp-career-table th,
.rpp-career-table td {
	padding: 10px 14px;
	text-align: left;
	border-bottom: 1px solid var(--rpp-stat-card-border);
	color: var(--rpp-stat-value-color);
	font-size: 14px;
}

.rpp-career-table th {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--rpp-stat-label-color);
	border-bottom: 2px solid var(--rpp-stat-card-border);
}

.rpp-career-table tr:last-child td {
	border-bottom: none;
}

@media (max-width: 600px) {
	.rpp-career-table thead {
		display: none;
	}

	.rpp-career-table,
	.rpp-career-table tbody,
	.rpp-career-table tr,
	.rpp-career-table td {
		display: block;
		width: 100%;
	}

	.rpp-career-table tr {
		padding: 10px 14px;
		border-bottom: 1px solid var(--rpp-stat-card-border);
	}

	.rpp-career-table td {
		border-bottom: none;
		padding: 3px 0;
	}

	.rpp-career-table td::before {
		content: attr(data-label) ": ";
		font-weight: 700;
		text-transform: uppercase;
		font-size: 10px;
		letter-spacing: 0.05em;
		color: var(--rpp-stat-label-color);
	}
}

/* [rpp_player_career_summary] — the redesigned career layout (2026-09-02):
   Primary School / High School / Current Club as three balanced responsive
   columns, Professional Career as its own section below. Reuses the same
   --rpp-stat-* variables as the stat cards / background cards / career table
   above so it matches whatever colours those have already been customised
   to, without introducing a fourth set of colour variables to keep in sync. */
.rpp-career-summary {
	margin: 20px 0;
}

.rpp-career-summary__columns {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
	gap: 16px;
}

.rpp-career-summary__column {
	background: var(--rpp-stat-card-bg);
	border: 1px solid var(--rpp-stat-card-border);
	border-radius: 10px;
	padding: 16px;
}

.rpp-career-summary__column-title {
	margin: 0 0 12px;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--rpp-stat-label-color);
}

.rpp-career-summary__entry {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-bottom: 10px;
}

.rpp-career-summary__entry:last-child {
	margin-bottom: 0;
}

.rpp-career-summary__entry-name {
	font-size: 15px;
	font-weight: 700;
	color: var(--rpp-stat-value-color);
}

.rpp-career-summary__entry-meta {
	font-size: 13px;
	color: var(--rpp-stat-label-color);
}

.rpp-career-summary__professional {
	margin-top: 20px;
}

.rpp-career-summary__professional .rpp-career-table {
	margin-top: 12px;
}

/* Player search — [rpp_player_search] filter bar + live results grid.
   Every colour is a CSS variable (defaults below) so you can match your own
   brand without touching this file — paste overrides into Elementor's Site
   Settings -> Custom CSS. Card defaults are navy/gold to match the rest of
   the site; the old green defaults elsewhere in this file were left over
   from an early template and don't apply here.

     :root {
       --rpp-search-card-bg: #1b1f3b;
       --rpp-search-card-bg-2: #12142b;
       --rpp-search-accent: #c9a227;
     }
*/
:root {
	--rpp-search-card-bg: #1b1f3b;
	--rpp-search-card-bg-2: #12142b;
	--rpp-search-accent: #c9a227;
	--rpp-search-bar-bg: #f7f8f7;
}

.rpp-player-search {
	--rpp-field-height: 42px;
}

.rpp-player-search__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 20px;
	margin-bottom: 28px;
	padding: 18px 20px;
	background: var(--rpp-search-bar-bg);
	border: 1px solid rgba(0, 0, 0, 0.06);
	border-radius: 10px;
	box-sizing: border-box;
}

.rpp-player-search__field {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	gap: 6px;
	flex: 0 0 auto;
}

.rpp-player-search__field label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: #55605c;
}

.rpp-player-search__field input,
.rpp-player-search__field select {
	box-sizing: border-box;
	height: var(--rpp-field-height);
	padding: 0 12px;
	border: 1px solid #d8dbd8;
	border-radius: 6px;
	font-size: 14px;
	line-height: var(--rpp-field-height);
	background: #fff;
	color: #1f2724;
}

.rpp-player-search__field input:focus,
.rpp-player-search__field select:focus {
	outline: none;
	border-color: var(--rpp-search-accent);
	box-shadow: 0 0 0 3px rgba(201, 162, 39, 0.15);
}

.rpp-player-search__field--name {
	flex: 1 1 220px;
	min-width: 180px;
}

.rpp-player-search__field--name input {
	width: 100%;
}

.rpp-player-search__field--position select {
	min-width: 190px;
}

.rpp-player-search__age-range {
	display: flex;
	align-items: center;
	gap: 8px;
}

.rpp-player-search__age-range input {
	width: 64px;
	text-align: center;
}

.rpp-player-search__age-range span {
	color: #9aa19d;
}

.rpp-player-search__reset {
	height: var(--rpp-field-height);
	padding: 0 18px;
	border: 1px solid #d8dbd8;
	border-radius: 6px;
	background: #fff;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: #55605c;
	cursor: pointer;
	align-self: flex-end;
}

.rpp-player-search__reset:hover {
	background: #f0f1f0;
	border-color: #c3c7c3;
}

.rpp-player-search__results[aria-busy="true"] {
	opacity: 0.6;
	transition: opacity 0.15s ease;
}

.rpp-player-search__empty {
	color: #767b78;
	padding: 24px 0;
}

.rpp-player-search__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
	gap: 18px;
}

.rpp-player-search__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	background: linear-gradient(160deg, var(--rpp-search-card-bg) 0%, var(--rpp-search-card-bg-2) 100%);
	border-radius: 12px;
	padding: 20px 14px;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

a.rpp-player-search__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.rpp-player-search__photo {
	width: 88px;
	height: 88px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.1);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 14px;
	border: 2px solid var(--rpp-search-accent);
	flex-shrink: 0;
}

.rpp-player-search__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	max-width: none;
}

.rpp-player-search__photo-placeholder {
	font-size: 36px;
	color: rgba(255, 255, 255, 0.6);
}

.rpp-player-search__name {
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.rpp-player-search__meta {
	color: var(--rpp-search-accent);
	font-size: 12px;
	margin-top: 6px;
}

.rpp-player-search__team {
	color: rgba(255, 255, 255, 0.6);
	font-size: 11px;
	margin-top: 3px;
}

@media (max-width: 560px) {
	.rpp-player-search__bar {
		flex-direction: column;
		align-items: stretch;
	}

	.rpp-player-search__field--name,
	.rpp-player-search__field--position,
	.rpp-player-search__reset {
		width: 100%;
	}
}

/* Coach bio — [rpp_coach_bio] paragraph. Inherits your theme's body text by
   default; this just adds a little breathing room. */
.rpp-coach-bio {
	line-height: 1.6;
	margin: 0 0 20px;
}

/* Coach Info widget (Age/Role/Team/Hometown/Experience) — sane defaults for
   before you've touched the Style tab. Deliberately its own class namespace
   (not shared with .rpp-player-stats) so the two widgets never interfere. */
.rpp-coach-info {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 24px 0;
}

.rpp-coach-info__card {
	background: rgba(0, 0, 0, 0.28);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 10px;
	padding: 14px 20px;
	flex: 1 1 0%;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.rpp-coach-info__label {
	font-size: clamp(10px, 1.6vw, 11px);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	white-space: nowrap;
	color: rgba(255, 255, 255, 0.75);
}

.rpp-coach-info__value {
	font-size: clamp(15px, 2.4vw, 20px);
	font-weight: 800;
	color: #ffffff;
}

/* Related players — other players who share the current player's exact position */
.rpp-related-players {
	margin: 32px 0;
}

.rpp-related-players__title {
	margin: 0 0 16px;
	font-size: 20px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: #123d23;
}

.rpp-related-players__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 16px;
}

.rpp-related-players__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	background: linear-gradient(160deg, #1a5632 0%, #123d23 100%);
	border-radius: 12px;
	padding: 18px 12px;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.rpp-related-players__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(18, 61, 35, 0.25);
}

.rpp-related-players__photo {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
	border: 2px solid #c9a227;
}

.rpp-related-players__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rpp-related-players__photo-placeholder {
	font-size: 36px;
	color: rgba(255, 255, 255, 0.6);
}

.rpp-related-players__name {
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.rpp-related-players__team {
	color: #c9a227;
	font-size: 12px;
	margin-top: 4px;
}

/* [rpp_sponsors] — one Main sponsor shown large + a row/grid of Associated
   sponsors below. CSS variables so a client can re-skin without touching code. */
:root {
	--rpp-sponsor-bg: rgba(0, 0, 0, 0.04);
	--rpp-sponsor-border: rgba(0, 0, 0, 0.1);
	--rpp-sponsor-text: #1a1a1a;
}

.rpp-sponsors {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 28px;
	margin: 32px 0;
	text-align: center;
}

.rpp-sponsor {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	text-decoration: none;
	color: var(--rpp-sponsor-text);
}

.rpp-sponsor--main {
	padding: 20px 32px;
}

.rpp-sponsor--main .rpp-sponsor__logo {
	max-height: 120px;
	width: auto;
}

.rpp-sponsor--main .rpp-sponsor__name {
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.rpp-sponsors__associated {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 24px;
}

.rpp-sponsor--associated {
	background: var(--rpp-sponsor-bg);
	border: 1px solid var(--rpp-sponsor-border);
	border-radius: 8px;
	padding: 14px 18px;
	min-width: 120px;
}

.rpp-sponsor--associated .rpp-sponsor__logo {
	max-height: 56px;
	width: auto;
}

.rpp-sponsor--associated .rpp-sponsor__name {
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	opacity: 0.85;
}

.rpp-sponsor__logo--placeholder {
	font-size: 40px;
	opacity: 0.35;
}

/* [rpp_fixtures] / [rpp_results] — card grid grouped by month, modeled on
   springboks.rugby/match-centre (team badges either side of a VS/score,
   kickoff time, venue, competition name). CSS variables so a client can
   re-skin without touching code. */
:root {
	--rpp-fixture-card-bg: #12142b;
	--rpp-fixture-card-border: rgba(255, 255, 255, 0.12);
	--rpp-fixture-accent: #c9a227;
	--rpp-fixture-text: #ffffff;
	--rpp-fixture-text-muted: rgba(255, 255, 255, 0.65);
}

.rpp-fixtures__month {
	margin: 0 0 32px;
}

.rpp-fixtures__month-title {
	font-size: 15px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	margin: 0 0 14px;
	color: var(--rpp-fixture-text);
}

.rpp-fixtures__list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.rpp-fixture-card {
	background: var(--rpp-fixture-card-bg);
	border: 1px solid var(--rpp-fixture-card-border);
	border-radius: 10px;
	padding: 16px 22px;
	display: flex;
	align-items: center;
	gap: 24px;
	flex-wrap: wrap;
}

.rpp-fixture-card__date {
	display: flex;
	flex-direction: column;
	min-width: 76px;
	font-weight: 700;
	color: var(--rpp-fixture-text);
	font-size: 13px;
	text-transform: uppercase;
}

.rpp-fixture-card__time {
	font-weight: 400;
	color: var(--rpp-fixture-text-muted);
	font-size: 12px;
	margin-top: 2px;
}

.rpp-fixture-card__match {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	flex: 1 1 300px;
}

.rpp-fixture-card__team {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1 1 0;
	min-width: 0;
}

.rpp-fixture-card__team:last-child {
	flex-direction: row-reverse;
	text-align: right;
}

.rpp-fixture-card__logo {
	width: 32px;
	height: 32px;
	object-fit: contain;
	flex-shrink: 0;
}

.rpp-fixture-card__team-name {
	color: var(--rpp-fixture-text);
	font-weight: 600;
	font-size: 14px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.rpp-fixture-card__score {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 800;
	font-size: 18px;
	min-width: 70px;
	justify-content: center;
}

.rpp-fixture-card__score-num {
	color: var(--rpp-fixture-text);
}

.rpp-fixture-card__vs {
	color: var(--rpp-fixture-accent);
}

.rpp-fixture-card--played .rpp-fixture-card__score-num {
	color: var(--rpp-fixture-accent);
}

.rpp-fixture-card__meta {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 2px;
	font-size: 11px;
	color: var(--rpp-fixture-text-muted);
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin-left: auto;
}

.rpp-fixtures__empty {
	color: var(--rpp-fixture-text-muted, #666);
}

@media (max-width: 640px) {
	.rpp-fixture-card {
		flex-direction: column;
		align-items: stretch;
	}
	.rpp-fixture-card__meta {
		align-items: flex-start;
		margin-left: 0;
	}
}

/* [rpp_downloads] */
.rpp-downloads {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 24px 0;
}

.rpp-download {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 18px;
	background: var(--rpp-sponsor-bg, rgba(0, 0, 0, 0.04));
	border: 1px solid var(--rpp-sponsor-border, rgba(0, 0, 0, 0.1));
	border-radius: 8px;
	text-decoration: none;
	color: var(--rpp-sponsor-text, #1a1a1a);
	transition: background 0.15s ease;
}

.rpp-download:hover {
	background: rgba(0, 0, 0, 0.08);
}

.rpp-download__icon {
	font-size: 22px;
	opacity: 0.7;
}

.rpp-download__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.rpp-download__name {
	font-weight: 700;
}

.rpp-download__desc {
	font-size: 13px;
	opacity: 0.75;
}

/* [rpp_squad] — gold-accent card language shared with [rpp_related_players]
   (own class namespace so the two never collide), showing Position + Age
   instead of Current Team since a squad listing reads more like a team
   sheet. Sorted server-side into position order.
   Card background was a hardcoded green gradient until 2026-09-02 — now uses
   this Team's own configured colour (--rpp-team-color / --rpp-team-text,
   set inline per render_squad_markup(), see RPP_Helpers::get_team_color() /
   readable_text_color()) so every team shows in its own colour instead of
   all looking the same. Falls back to the plugin's navy default via the
   var()'s second argument if a template ever renders this markup without
   the inline style (shouldn't happen via the shortcode/widget, but keeps
   this rule safe standalone). */
.rpp-squad {
	margin: 24px 0;
	--rpp-team-color: #12142b;
	--rpp-team-text: #ffffff;
}

.rpp-squad__title {
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin: 0 0 16px;
}

.rpp-squad__grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
	gap: 16px;
}

.rpp-squad__card {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	text-decoration: none;
	background: var(--rpp-team-color, #12142b);
	border-radius: 12px;
	padding: 18px 12px;
	transition: transform 0.15s ease, box-shadow 0.15s ease;
}

a.rpp-squad__card:hover {
	transform: translateY(-3px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

/* Same theme-link-colour override issue as .rpp-game-team__player below —
   .rpp-squad__card is an <a>, so its text needs !important to stay pinned to
   this Team's own text colour rather than the active theme's link colour. */
.rpp-squad__card .rpp-squad__name,
.rpp-squad__card .rpp-squad__meta {
	color: var(--rpp-team-text, #ffffff) !important;
}

.rpp-squad__photo {
	width: 84px;
	height: 84px;
	border-radius: 50%;
	overflow: hidden;
	background: rgba(255, 255, 255, 0.12);
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 12px;
	border: 2px solid #c9a227;
}

.rpp-squad__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rpp-squad__photo-placeholder {
	font-size: 36px;
	color: rgba(255, 255, 255, 0.6);
}

.rpp-squad__name {
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

.rpp-squad__meta {
	color: #c9a227;
	font-size: 12px;
	margin-top: 4px;
}

.rpp-squad__empty {
	opacity: 0.7;
}

/* [rpp_trial_round] — rebuilt 2026-08-27 for the real Round/Team structure.
   Deliberately its OWN heading classes rather than reusing .rpp-squad__title,
   because the client's live Trials pages have a light background and the
   white .rpp-squad__title text was invisible there — these default to a dark
   navy instead. Override via --rpp-trial-round-heading-color if the client's
   page background ever changes to something dark again. */
:root {
	--rpp-trial-round-heading-color: #12142b;
}

.rpp-trial-round {
	margin: 24px 0;
}

.rpp-trial-round__title {
	color: var(--rpp-trial-round-heading-color);
	font-size: 22px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin: 0 0 20px;
}

.rpp-trial-round__game-heading {
	color: var(--rpp-trial-round-heading-color);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.02em;
	margin: 28px 0 14px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--rpp-search-accent, #c9a227);
}

.rpp-trial-round__game-heading:first-of-type {
	margin-top: 0;
}

/* Two-team side-by-side cards, per Round+Game (revised 2026-09-09 after
   Riaan reviewed the live output against his own reference photos): the
   WHOLE card is now a solid fill in that Team's own colour — not just a
   header strip — with matching light/dark text so it stays readable no
   matter which colour a client picks (--rpp-team-color / --rpp-team-text,
   set inline per team from RPP_Helpers::get_team_color() /
   readable_text_color()). Every border/muted-text tone below is derived
   from --rpp-team-text via color-mix() rather than a hardcoded white, so it
   automatically works whether the team's text colour is white (Red/Blue/
   Green) or near-black (a bright colour like Yellow). */
.rpp-game-teams {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	align-items: start;
}

@media (max-width: 640px) {
	.rpp-game-teams {
		grid-template-columns: 1fr;
	}
}

.rpp-game-team {
	background: var(--rpp-team-color, #12142b);
	color: var(--rpp-team-text, #ffffff);
	border-radius: 10px;
	border: 1px solid color-mix(in srgb, var(--rpp-team-text, #fff) 30%, transparent);
	overflow: hidden;
}

.rpp-game-team__crest {
	display: flex;
	justify-content: center;
	padding: 14px 16px 0;
}

.rpp-game-team__crest img {
	max-width: 90px;
	max-height: 90px;
	object-fit: contain;
}

.rpp-game-team__header {
	padding: 12px 16px;
	margin: 14px 0 0;
	border-bottom: 1px solid color-mix(in srgb, var(--rpp-team-text, #fff) 25%, transparent);
}

.rpp-game-team__name {
	margin: 0 0 6px;
	font-size: 16px;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	text-align: center;
	color: var(--rpp-team-text, #ffffff);
}

.rpp-game-team__staff-row {
	font-size: 12px;
	text-align: center;
	color: var(--rpp-team-text, #ffffff);
	opacity: 0.92;
}

.rpp-game-team__game-time {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	margin: -1px 0 12px;
	color: var(--rpp-team-text, #ffffff);
}

.rpp-game-team__game-time span {
	font-weight: 800;
}

.rpp-game-team__staff-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 4px 10px;
}

.rpp-game-team__staff-label {
	font-weight: 700;
}

.rpp-game-team__empty {
	color: var(--rpp-team-text, #ffffff);
	opacity: 0.75;
	font-size: 13px;
	margin: 0;
	padding: 14px 16px;
}

.rpp-game-team__roster {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 12px;
	padding: 12px 16px;
}

.rpp-game-team__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

/* Player rows render as <a> tags (linking to the profile) whenever $linked
   isn't disabled — that anchor competes with the active theme's own global
   link-colour rule (e.g. Elementor global colours, ".entry-content a", or an
   "a:link"/"a:visited" pseudo-class selector, several of which out-specificity
   a plain class selector). Found 2026-09-09 from Riaan's live screenshot: the
   Red card's player names rendered in a dark theme link colour instead of the
   intended white, unreadable against the red background. !important pins the
   colour to this Team's own text colour regardless of what the theme does
   elsewhere — scoped to just these card elements, not a site-wide override. */
.rpp-game-team__player,
a.rpp-game-team__player,
a.rpp-game-team__player:link,
a.rpp-game-team__player:visited,
a.rpp-game-team__player:active {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 4px;
	text-decoration: none;
	color: var(--rpp-team-text, #ffffff) !important;
	border-radius: 6px;
	transition: background 0.15s ease;
}

a.rpp-game-team__player:hover {
	color: var(--rpp-team-text, #ffffff) !important;
	background: color-mix(in srgb, var(--rpp-team-text, #fff) 12%, transparent);
}

.rpp-game-team__player .rpp-game-team__player-name,
.rpp-game-team__player .rpp-game-team__number {
	color: var(--rpp-team-text, #ffffff) !important;
}

.rpp-game-team__number {
	flex: 0 0 auto;
	min-width: 16px;
	font-size: 12px;
	font-weight: 800;
	text-align: right;
	color: var(--rpp-team-text, #ffffff) !important;
	opacity: 0.85;
}

.rpp-game-team__photo {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	overflow: hidden;
	background: color-mix(in srgb, var(--rpp-team-text, #fff) 15%, transparent);
	display: flex;
	align-items: center;
	justify-content: center;
}

.rpp-game-team__photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rpp-game-team__photo-placeholder {
	font-size: 13px;
	color: color-mix(in srgb, var(--rpp-team-text, #fff) 70%, transparent) !important;
}

.rpp-game-team__info {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.25;
}

.rpp-game-team__player-name {
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rpp-game-team__badge {
	font-weight: 800;
	opacity: 0.9;
}

.rpp-game-team__player-position {
	font-size: 10px;
	color: color-mix(in srgb, var(--rpp-team-text, #fff) 80%, transparent) !important;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/* Mobile team cards use one continuous roster: starting XV first, then the
   reserves below. Keeping the inner roster at two columns made long reserve
   names establish a wide grid track and push that entire column off-screen. */
@media (max-width: 640px) {
	.rpp-game-team__roster {
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}

	.rpp-game-team__list {
		min-width: 0;
	}

	.rpp-game-team__list--bench {
		padding-top: 8px;
		border-top: 1px solid color-mix(in srgb, var(--rpp-team-text, #fff) 25%, transparent);
	}

	.rpp-game-team__player-name,
	.rpp-game-team__player-position {
		white-space: normal;
		overflow: visible;
		text-overflow: clip;
	}
}

/* The logistics info block (Date/Venue/Arrival/Opening/Kickoffs/etc.) below
   the roster — same solid team colour as the rest of the card, plain
   label/value rows with a subtle alternating shade for readability. */
.rpp-game-team__info-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 11px;
	margin-top: 4px;
}

.rpp-game-team__info-table th,
.rpp-game-team__info-table td {
	text-align: left;
	padding: 5px 16px;
	border-top: 1px solid color-mix(in srgb, var(--rpp-team-text, #fff) 15%, transparent);
	vertical-align: top;
	color: var(--rpp-team-text, #ffffff);
}

.rpp-game-team__info-table th {
	width: 44%;
	font-weight: 700;
	color: color-mix(in srgb, var(--rpp-team-text, #fff) 80%, transparent);
}

.rpp-game-team__info-table tr:nth-child(even) {
	background: color-mix(in srgb, var(--rpp-team-text, #fff) 6%, transparent);
}

/* Each Team has its own print button. The selected card becomes a full-width
   A4 team sheet in print while both cards remain side-by-side on screen. */
.rpp-round-game {
	margin-bottom: 28px;
}

.rpp-game-team__print-btn {
	display: block;
	margin: 14px auto 0;
	padding: 10px 28px;
	background: transparent;
	color: var(--rpp-team-text, #ffffff);
	border: 2px solid var(--rpp-search-accent, #c9a227);
	border-radius: 6px;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	cursor: pointer;
}

.rpp-game-team__print-btn:hover {
	background: var(--rpp-search-accent, #c9a227);
	color: #1a1a1a;
}

/* [rpp_player_trial_history] — a single player's own round-by-round record,
   meant for the single Player template. Plain list, styled to sit quietly
   below the Bio/Highlights area like the other profile-detail shortcodes. */
.rpp-trial-history {
	margin: 24px 0;
}

.rpp-trial-history__title {
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	margin: 0 0 12px;
	color: var(--rpp-stat-label-color, #55605c);
}

.rpp-trial-history__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.rpp-trial-history__row {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 14px;
	padding: 10px 14px;
	background: var(--rpp-stat-card-bg, rgba(0, 0, 0, 0.28));
	border: 1px solid var(--rpp-stat-card-border, rgba(255, 255, 255, 0.18));
	border-radius: 8px;
}

.rpp-trial-history__round {
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	color: var(--rpp-stat-value-color, #fff);
	font-size: 13px;
}

.rpp-trial-history__team {
	font-weight: 600;
	color: var(--rpp-stat-value-color, #fff);
	font-size: 13px;
}

.rpp-trial-history__meta {
	font-size: 12px;
	color: var(--rpp-stat-label-color, rgba(255, 255, 255, 0.75));
	margin-left: auto;
}

/* Print stylesheet. Two different print modes live here, plus the formal
   Team Sheet's own print rules further below:
   1. [rpp_squad] — plain black-on-white handout (unchanged since Phase 4).
   2. [rpp_trial_round] — the "printable selected-player overview" (spec
      section 11): grouped by game/team, starters-then-reserves, COLOURED by
      team (unlike the plain squad handout — the client's own reference is a
      dark, branded card, so the printed output keeps the same navy card +
      team-colour header instead of flattening to black-on-white), site
      chrome hidden. This is intentionally different from the formal A4 Team
      Sheet below — it's "print whatever's currently on screen", not a fixed
      document.
      A second, more targeted mode lives here too (revised 2026-09-09): each
      team card has its own "Print This Team" button (rppPrintTeamCard() in
      class-rpp-shortcodes.php's render_trial_round_print_script()) that adds
      .rpp-printing-single-team to <body> and .rpp-print-focus to only that
      card. The rules below isolate and format one team on one A4 page.

      Isolation technique (rewritten 2026-09-09 — see the big comment right
      below for why): hide everything with display:none rather than the old
      visibility:hidden + position:absolute trick. display:none removes an
      element from layout entirely, so hidden siblings/ancestors stop taking
      up vertical space — visibility:hidden alone keeps their space reserved,
      which is exactly what caused the bug below. */
@media print {
	/* Found live on recklessbearbarbarians.co.za/trials/applicants-profiles/,
	   2026-09-09: the earlier round printout showed one entirely
	   blank page before the actual card content appeared. Root cause: the
	   OLD rule here used position:absolute;top:0 on .rpp-trial-round to pin
	   it to the page's top-left after hiding everything else with
	   visibility:hidden — but position:absolute is positioned relative to
	   the nearest ANCESTOR that itself has position:relative/absolute/fixed/
	   sticky, not necessarily the actual page. Elementor (and most page
	   builders) routinely sets position:relative on its own section/widget
	   wrapper divs — confirmed live: the wrapper around this plugin's
	   [rpp_trial_round] widget on that page is position:relative and sits
	   ~1144px down the page (below the site's header/hero). So "top:0" was
	   pinning our content to the TOP OF THAT WRAPPER, not the page — and
	   because visibility:hidden does NOT remove elements from layout, the
	   invisible header/hero above the wrapper still occupied a full page's
	   worth of space before the wrapper (and our content) began.
	   display:none has no such escape-hatch problem: it removes an element
	   from the layout algorithm entirely regardless of any ancestor's
	   positioning context, so this can't recur no matter how a client's page
	   is built. :has() (well-supported across current browsers) lets one
	   rule hide every truly-unrelated element while leaving the ancestors of
	   our target — and the target itself — untouched, so this plugin's own
	   flex/grid layout inside the card is never disturbed. Verified live
	   against the actual page before shipping: .rpp-trial-round's rendered
	   top position moved from ~1168px down to ~59px after applying this. */
	/* Only activate this isolation rule when the page actually contains one
	   of its targets. Without the body guard, the selector matched every
	   element on unrelated pages and made normal browser printing blank. */
	body:has(.rpp-squad, .rpp-trial-round) *:not(.rpp-squad):not(.rpp-squad *):not(.rpp-trial-round):not(.rpp-trial-round *):not(:has(.rpp-squad)):not(:has(.rpp-trial-round)) {
		display: none !important;
	}

	/* 2026-09-09, second pass — the display:none + :has() rewrite above was
	   verified live (rendered top position, total height) and still didn't
	   fix Riaan's real-world blank-first-page report, confirmed broken on
	   both v1.13.3 and v1.13.4. New root cause found: getBoundingClientRect()
	   measurements only describe ordinary (unpaginated) screen layout — they
	   can't reveal how Chrome's PRINT PAGINATOR handles the page, which is a
	   different code path. Elementor's own wrapper divs around this widget
	   (its "Container" system: .e-con / .e-con-inner, and the older
	   .elementor-row / .elementor-column / .elementor-widget-wrap) use
	   display:flex (confirmed live: the widget's own .e-con-inner and
	   .e-con.e-parent ancestors both compute to flex). Those ancestors are
	   kept on the page by :has() above (so our card stays in the DOM) but
	   keep their original flex display — and Chrome has a long-standing
	   print-pagination bug with flex/grid formatting contexts: when a
	   flex/grid item is taller than the space left on the current page,
	   Chrome doesn't split it — it pushes the WHOLE item to the next page,
	   while the flex container itself still starts on the current page.
	   That produces exactly Riaan's symptom: one blank printed page, then
	   all the real content starting on page 2. Since every sibling of our
	   card is already display:none, there is nothing left needing flex/grid
	   alignment here, so forcing plain block layout on these wrapper
	   ancestors costs nothing and lets Chrome paginate normal flow content
	   instead of an unfragmentable flex/grid item. NOTE: unlike the previous
	   fix, this could not be verified against a real print render in this
	   environment (window.print() blocks browser automation and can't be
	   dismissed programmatically) — please test and confirm on your end. */
	body :is(.e-con, .e-con-inner, .e-parent, .e-child, .elementor-row, .elementor-column, .elementor-widget-wrap, .elementor-container):has(.rpp-squad),
	body :is(.e-con, .e-con-inner, .e-parent, .e-child, .elementor-row, .elementor-column, .elementor-widget-wrap, .elementor-container):has(.rpp-trial-round) {
		display: block !important;
	}
	.rpp-squad__card {
		background: #fff !important;
		border: 1px solid #999;
		color: #000;
		break-inside: avoid;
	}
	.rpp-squad__name,
	.rpp-squad__title {
		color: #000 !important;
	}
	.rpp-squad__meta {
		color: #333 !important;
	}

	.rpp-trial-round__title,
	.rpp-trial-round__game-heading {
		color: #000 !important;
	}
	.rpp-round-game {
		break-inside: avoid;
	}
	.rpp-game-teams {
		break-inside: avoid;
	}
	.rpp-game-team,
	.rpp-game-team * {
		-webkit-print-color-adjust: exact;
		print-color-adjust: exact;
	}
	.rpp-game-team {
		break-inside: avoid;
		border: 1px solid #999;
		/* Hello Elementor and several other themes remove backgrounds in
		   print. That left the intended white player text on a white card, so
		   only the theme-generated link URL remained visible. Keep the same
		   configured Team colour and contrast colour used on screen. */
		background: var(--rpp-team-color, #12142b) !important;
		background-color: var(--rpp-team-color, #12142b) !important;
		color: var(--rpp-team-text, #ffffff) !important;
	}
	.rpp-game-team__name,
	.rpp-game-team__staff-row,
	.rpp-game-team__staff-label,
	.rpp-game-team__info-table th,
	.rpp-game-team__info-table td {
		color: var(--rpp-team-text, #ffffff) !important;
	}
	.rpp-game-team__player,
	.rpp-game-team__info-table tr {
		break-inside: avoid;
	}
	a.rpp-game-team__player {
		text-decoration: none;
	}
	/* Themes commonly append " (https://...)" to every printed link. Player
	   cards remain clickable on screen, but a printed team list must contain
	   only the number, photo, name and playing position. */
	a.rpp-game-team__player::after,
	a.rpp-game-team__player[href]::after {
		content: none !important;
		display: none !important;
	}
	.rpp-game-team__print-btn {
		display: none !important;
	}

	/* One selected Team becomes the entire printed document. The other game
	   and Team cards collapse completely, leaving no Elementor or sibling
	   spacing ahead of the A4 sheet. */
	body.rpp-printing-single-team .rpp-round-game:not(:has(.rpp-game-team.rpp-print-focus)),
	body.rpp-printing-single-team .rpp-game-team:not(.rpp-print-focus),
	body.rpp-printing-single-team .rpp-trial-round__title,
	body.rpp-printing-single-team .rpp-trial-round__game-heading {
		display: none !important;
	}
	body.rpp-printing-single-team .rpp-game-teams {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 0 !important;
	}
	body.rpp-printing-single-team .rpp-game-team.rpp-print-focus {
		width: 100% !important;
		max-width: none !important;
		min-height: 0 !important;
		break-inside: avoid !important;
		border: 1px solid color-mix(in srgb, var(--rpp-team-color, #12142b) 72%, #000) !important;
		border-radius: 10px;
		padding-bottom: 12px;
		overflow: hidden;
	}
	body.rpp-printing-single-team .rpp-game-team__crest {
		padding: 4px 8px 0;
	}
	body.rpp-printing-single-team .rpp-game-team__crest img {
		max-width: 58px;
		max-height: 58px;
	}
	body.rpp-printing-single-team .rpp-game-team__header {
		padding: 12px 16px 14px;
		margin-top: 6px;
		border-bottom: 0;
	}
	body.rpp-printing-single-team .rpp-game-team__name {
		font-size: 16px;
		margin-bottom: 8px;
	}
	body.rpp-printing-single-team .rpp-game-team__game-time {
		font-size: 12px;
		margin: -1px 0 9px;
	}
	body.rpp-printing-single-team .rpp-game-team__staff-grid {
		display: flex;
		align-items: stretch;
		justify-content: center;
		gap: 0;
		max-width: 680px;
		margin: 0 auto;
	}
	body.rpp-printing-single-team .rpp-game-team__staff-row {
		flex: 1 1 0;
		font-size: 9.5px;
		text-align: center;
		padding: 4px 8px;
		border-left: 1px solid color-mix(in srgb, var(--rpp-team-text, #fff) 25%, transparent);
	}
	body.rpp-printing-single-team .rpp-game-team__staff-row:first-child {
		border-left: 0;
	}
	body.rpp-printing-single-team .rpp-game-team__staff-label {
		display: block;
	}
	body.rpp-printing-single-team .rpp-game-team__roster {
		grid-template-columns: 3fr 2fr;
		gap: 0 24px;
		margin: 0 12px 12px;
		padding: 12px 16px;
		background: #fff !important;
		color: #111 !important;
		border-radius: 8px;
		box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
	}
	body.rpp-printing-single-team .rpp-game-team__list {
		gap: 0;
	}
	body.rpp-printing-single-team .rpp-game-team__list li:not(:last-child) .rpp-game-team__player {
		border-bottom: 1px solid #ececec;
		border-radius: 0;
	}
	body.rpp-printing-single-team .rpp-game-team__player {
		gap: 5px;
		padding: 3px 3px 5px;
		min-height: 34px;
		color: #111 !important;
	}
	body.rpp-printing-single-team a.rpp-game-team__player,
	body.rpp-printing-single-team a.rpp-game-team__player:link,
	body.rpp-printing-single-team a.rpp-game-team__player:visited,
	body.rpp-printing-single-team .rpp-game-team__player .rpp-game-team__player-name,
	body.rpp-printing-single-team .rpp-game-team__player .rpp-game-team__number {
		color: #111 !important;
	}
	body.rpp-printing-single-team .rpp-game-team__photo {
		display: flex !important;
		flex: 0 0 25px;
		width: 25px;
		height: 25px;
		border: 1px solid #dedede;
		background: #f2f2f2;
	}
	body.rpp-printing-single-team .rpp-game-team__number {
		min-width: 18px;
		font-size: 10px;
	}
	body.rpp-printing-single-team .rpp-game-team__player-name {
		font-size: 10.5px;
	}
	body.rpp-printing-single-team .rpp-game-team__player-position {
		font-size: 8.5px;
		color: #555 !important;
	}
	body.rpp-printing-single-team .rpp-game-team__info-table {
		width: calc(100% - 24px);
		font-size: 9px;
		margin: 0 12px;
		background: #fff !important;
		color: #111 !important;
		border: 1px solid var(--rpp-team-color, #12142b);
		border-radius: 8px;
		border-collapse: separate;
		border-spacing: 0;
		overflow: hidden;
	}
	body.rpp-printing-single-team .rpp-game-team__info-table tr,
	body.rpp-printing-single-team .rpp-game-team__info-table tr:nth-child(even) {
		background: #fff !important;
	}
	body.rpp-printing-single-team .rpp-game-team__info-table th,
	body.rpp-printing-single-team .rpp-game-team__info-table td {
		padding: 4px 8px;
		color: #111 !important;
		border-top-color: color-mix(in srgb, var(--rpp-team-color, #12142b) 35%, #fff);
	}
}

/* [rpp_team_sheet] — the formal, purpose-built A4 printable Team Sheet (spec
   section 12), matching the client's reference PDF structure. Two states:
   - On screen: a boxed preview (so Riaan/coaches can check it before
     printing) plus a "Print This Team Sheet" button.
   - In @media print: the button disappears, everything outside the sheet
     is hidden the same way as the other print modes above, and @page fixes
     the sheet to real A4 portrait with sane margins so "Save as PDF" from
     the browser's print dialog produces a correctly-sized document.
   Team colour is used only as a thin accent (the lineup bar, a left border)
   rather than a full-bleed background fill, so the sheet stays low-ink and
   still fully legible even if the browser's "print background graphics"
   option is off — nothing essential depends on that setting. */
.rpp-team-sheet {
	--rpp-team-color: #12142b;
	--rpp-team-text: #ffffff;
	margin: 24px 0;
}

.rpp-team-sheet__print-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 14px;
	padding: 10px 18px;
	background: var(--rpp-team-color);
	color: var(--rpp-team-text);
	border: none;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.rpp-team-sheet__page {
	background: #fff;
	color: #1a1a1a;
	max-width: 720px;
	margin: 0 auto;
	padding: 28px 32px;
	border: 1px solid #ddd;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
	font-family: Arial, Helvetica, sans-serif;
}

.rpp-team-sheet__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	gap: 16px;
	border-bottom: 3px solid var(--rpp-team-color);
	padding-bottom: 12px;
	margin-bottom: 14px;
}

.rpp-team-sheet__competition {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: #666;
}

.rpp-team-sheet__round {
	margin: 2px 0 4px;
	font-size: 22px;
	font-weight: 800;
	color: #1a1a1a;
}

.rpp-team-sheet__sub {
	font-size: 13px;
	color: #444;
}

.rpp-team-sheet__logo img {
	max-height: 56px;
	width: auto;
}

.rpp-team-sheet__info-table {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 14px;
	font-size: 13px;
}

.rpp-team-sheet__info-table th,
.rpp-team-sheet__info-table td {
	border: 1px solid #ccc;
	padding: 6px 10px;
	text-align: left;
}

.rpp-team-sheet__info-table th {
	width: 16%;
	background: #f4f4f4;
	font-weight: 700;
	white-space: nowrap;
}

.rpp-team-sheet__lineup-bar {
	background: var(--rpp-team-color);
	color: var(--rpp-team-text);
	-webkit-print-color-adjust: exact;
	print-color-adjust: exact;
	padding: 8px 14px;
	font-size: 14px;
	font-weight: 800;
	letter-spacing: 0.04em;
	border-radius: 4px;
	margin-bottom: 14px;
}

.rpp-team-sheet__players {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px 14px;
	margin-bottom: 18px;
}

@media (max-width: 640px) {
	.rpp-team-sheet__players {
		grid-template-columns: 1fr;
	}
}

.rpp-team-sheet__player {
	display: flex;
	align-items: center;
	gap: 8px;
	border-bottom: 1px solid #eee;
	padding-bottom: 6px;
}

.rpp-team-sheet__player-photo {
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	overflow: hidden;
	background: #eee;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--rpp-team-color);
}

.rpp-team-sheet__player-photo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rpp-team-sheet__player-info {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.25;
}

.rpp-team-sheet__player-slot {
	font-size: 10px;
	font-weight: 700;
	text-transform: uppercase;
	color: #777;
}

.rpp-team-sheet__player-name {
	font-size: 12px;
	font-weight: 700;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rpp-team-sheet__player-dob {
	font-size: 10px;
	color: #777;
}

.rpp-team-sheet__certification {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 12px;
	font-size: 12px;
}

.rpp-team-sheet__certification th,
.rpp-team-sheet__certification td {
	border: 1px solid #ccc;
	padding: 6px 10px;
	text-align: left;
	vertical-align: top;
}

.rpp-team-sheet__certification th {
	background: #f4f4f4;
	font-weight: 700;
}

.rpp-team-sheet__cert-label {
	font-weight: 700;
	color: #777;
}

.rpp-team-sheet__cert-blank-row td {
	font-size: 11px;
	color: #444;
	line-height: 1.8;
}

.rpp-team-sheet__note {
	font-size: 12px;
	color: #444;
	margin: 0 0 16px;
}

.rpp-team-sheet__footer {
	display: flex;
	justify-content: space-between;
	font-size: 10px;
	color: #999;
	border-top: 1px solid #eee;
	padding-top: 8px;
}

.rpp-team-sheet__empty {
	opacity: 0.7;
}

@media print {
	@page {
		size: A4 portrait;
		margin: 12mm;
	}

	/* Same "hide everything except this block" approach as the .rpp-squad /
	   .rpp-trial-round print modes above, and same 2026-09-09 display:none +
	   :has() rewrite (see the big comment there for the full story — the old
	   visibility:hidden + position:absolute version only escapes to the true
	   page top when no ancestor has position:relative/absolute/fixed/sticky,
	   which a real page-builder page can't guarantee). If a page ever mixed a
	   Team Sheet with one of those other shortcodes (unusual, but not
	   prevented), the last matching rule wins; in practice a Team Sheet is
	   placed on its own dedicated page/URL per Round+Team, same convention as
	   the client's existing per-round Trial pages. */
	/* CRITICAL: keep this rule gated to an actual Team Sheet page. Previously
	   it ran on Trial Round pages too; because those pages contain no
	   .rpp-team-sheet, every body descendant matched and Chrome produced a
	   completely empty one-page PDF. */
	body:has(.rpp-team-sheet) *:not(.rpp-team-sheet):not(.rpp-team-sheet *):not(:has(.rpp-team-sheet)) {
		display: none !important;
	}

	/* 2026-09-09 — same Elementor flex/grid pagination fix as the .rpp-squad /
	   .rpp-trial-round print mode above (see the long comment there for the
	   full explanation). Applied here too so a Team Sheet print never hits
	   the same blank-first-page bug if its Elementor wrapper is flex too. */
	body :is(.e-con, .e-con-inner, .e-parent, .e-child, .elementor-row, .elementor-column, .elementor-widget-wrap, .elementor-container):has(.rpp-team-sheet) {
		display: block !important;
	}

	.rpp-team-sheet__print-btn {
		display: none !important;
	}
	.rpp-team-sheet__page {
		max-width: 100%;
		border: none;
		box-shadow: none;
		padding: 0;
	}
	.rpp-team-sheet__player,
	.rpp-team-sheet__info-table tr,
	.rpp-team-sheet__certification tr {
		break-inside: avoid;
	}
}