/* =====================================================================
 * Premium match card (2026-10-12, approved mockup "1 · Premium match
 * card — every state"). Matches inside a paid tournament only; free
 * matches keep the ordinary cards. Rendered by
 * Proace_Shortcodes::render_premium_card().
 *
 * Every selector starts with .proace-pcard.proace-pcard so the theme's
 * ordinary-card rules (.proace-prediction__option, .proace-contest__team …,
 * loaded later) never restyle it. The card stays dark in light mode too —
 * gold on navy is its identity.
 * ===================================================================== */

.proace-pcard.proace-pcard {
	--pc-gold: #e9b44c;
	--pc-gold-hi: #ffd27a;
	--pc-amber: #ffb020;
	--pc-ink: #eaf4ff;
	--pc-muted: #8fa6c4;
	--pc-sand: #c6ad7a;
	--pc-green: #4fd18b;
	--pc-red: #ff7878;
	--pc-mono: 'JetBrains Mono', ui-monospace, monospace;
	--pc-head: 'Outfit', 'PT Sans', sans-serif;
	--pc-body: 'Plus Jakarta Sans', 'PT Sans', sans-serif;
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0 0 22px;
	padding: 0;
	border: 0;
	border-radius: 22px;
	background: linear-gradient( 180deg, #15243e 0%, #0b1a31 100% );
	box-shadow: 0 0 0 1.5px var( --pc-gold ), 0 0 0 5px rgba( 233, 180, 76, 0.1 ), 0 26px 50px -24px rgba( 233, 180, 76, 0.35 );
	overflow: hidden;
	color: var( --pc-ink );
	font-family: var( --pc-body );
	text-align: left;
	isolation: isolate;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.proace-pcard.proace-pcard::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 130px;
	background: radial-gradient( 380px 120px at 25% -25%, rgba( 255, 210, 122, 0.24 ), transparent 70% );
	pointer-events: none;
	z-index: -1;
}
@media ( hover: hover ) {
	.proace-pcard.proace-pcard:hover {
		transform: translateY( -2px );
		box-shadow: 0 0 0 1.5px var( --pc-gold-hi ), 0 0 0 6px rgba( 233, 180, 76, 0.14 ), 0 30px 56px -24px rgba( 233, 180, 76, 0.45 );
	}
}
.proace-pcard.proace-pcard a { text-decoration: none; }
.proace-pcard.proace-pcard :is( b, strong ) { font-weight: 800; }

/* Band ------------------------------------------------------------- */
.proace-pcard.proace-pcard .proace-pcard__band {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 18px;
	background: linear-gradient( 90deg, rgba( 233, 180, 76, 0.16 ), rgba( 233, 180, 76, 0.04 ) );
	border-bottom: 1px solid rgba( 233, 180, 76, 0.25 );
}
.proace-pcard.proace-pcard .proace-pcard__seal {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 10px 5px 6px;
	border-radius: 999px;
	background: linear-gradient( 180deg, #ffe2a1, var( --pc-gold ) );
	color: #2a1a00;
	font: 800 10.5px/1 var( --pc-head );
	letter-spacing: 0.1em;
	text-transform: uppercase;
	box-shadow: 0 4px 14px -4px rgba( 233, 180, 76, 0.6 );
}
.proace-pcard.proace-pcard .proace-pcard__seal svg { width: 14px; height: 14px; }
.proace-pcard.proace-pcard .proace-pcard__cup { flex: 1; min-width: 0; color: inherit; }
.proace-pcard.proace-pcard .proace-pcard__cup b {
	display: block;
	font: 800 13.5px/1.2 var( --pc-head );
	color: #ffe9be;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.proace-pcard.proace-pcard .proace-pcard__cup:hover b { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.proace-pcard.proace-pcard .proace-pcard__cup span {
	display: block;
	margin-top: 2px;
	font: 600 11px/1.25 var( --pc-mono );
	color: var( --pc-sand );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.proace-pcard.proace-pcard .proace-pcard__rank { flex: none; text-align: right; }
.proace-pcard.proace-pcard .proace-pcard__rank b { display: block; font: 700 15px/1 var( --pc-mono ); color: #fff; }
.proace-pcard.proace-pcard .proace-pcard__rank span { display: block; margin-top: 3px; font: 600 10.5px/1 var( --pc-body ); color: var( --pc-sand ); }

/* Strip ------------------------------------------------------------ */
.proace-pcard.proace-pcard .proace-pcard__strip {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	padding: 14px 18px 0;
}
.proace-pcard.proace-pcard .proace-pcard__comp {
	min-width: 0;
	font: 700 10.5px/1.2 var( --pc-mono );
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var( --pc-muted );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.proace-pcard.proace-pcard .proace-pcard__pill {
	flex: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 5px 9px;
	border-radius: 999px;
	font: 800 10.5px/1 var( --pc-head );
	letter-spacing: 0.07em;
	text-transform: uppercase;
	white-space: nowrap;
}
.proace-pcard.proace-pcard .proace-pcard__pill time { font: inherit; color: inherit; }
.proace-pcard.proace-pcard .proace-pcard__pill--open { background: rgba( 79, 209, 139, 0.14 ); color: #7ee3a8; border: 1px solid rgba( 79, 209, 139, 0.45 ); }
.proace-pcard.proace-pcard .proace-pcard__pill--live { background: rgba( 255, 92, 92, 0.14 ); color: #ff9a9a; border: 1px solid rgba( 255, 92, 92, 0.5 ); }
.proace-pcard.proace-pcard .proace-pcard__pill--res { background: rgba( 233, 180, 76, 0.14 ); color: var( --pc-gold-hi ); border: 1px solid rgba( 233, 180, 76, 0.45 ); max-width: 62%; overflow: hidden; text-overflow: ellipsis; }
.proace-pcard.proace-pcard .proace-pcard__dot { width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.proace-pcard.proace-pcard .proace-pcard__pill--live .proace-pcard__dot { animation: pcPulse 1.4s ease-in-out infinite; }
@keyframes pcPulse { 50% { opacity: 0.25; } }

/* Matchup ---------------------------------------------------------- */
.proace-pcard.proace-pcard .proace-pcard__vs {
	display: grid;
	grid-template-columns: minmax( 0, 1fr ) auto minmax( 0, 1fr );
	align-items: center;
	gap: 8px;
	padding: 16px 18px 12px;
}
.proace-pcard.proace-pcard .proace-contest__team {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	min-width: 0;
	margin: 0;
	padding: 0;
	text-align: center;
	background: none;
	border: 0;
}
.proace-pcard.proace-pcard .proace-contest__crest {
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	margin: 0;
	border-radius: 50%;
	background-size: cover;
	background-position: center;
	font: 800 14px/1 var( --pc-head );
	color: #fff;
	box-shadow: inset 0 0 0 2px rgba( 255, 255, 255, 0.2 ), 0 0 0 3px rgba( 233, 180, 76, 0.25 );
	transform: none;
}
.proace-pcard.proace-pcard .proace-contest__team-name {
	max-width: 100%;
	font: 800 17px/1.1 var( --pc-head );
	color: var( --pc-ink );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.proace-pcard.proace-pcard .proace-pcard__clock { text-align: center; }
.proace-pcard.proace-pcard .proace-pcard__clock b { display: block; font: 700 22px/1 var( --pc-mono ); color: #fff; }
.proace-pcard.proace-pcard .proace-pcard__clock b.is-live { color: #ff9a9a; }
.proace-pcard.proace-pcard .proace-pcard__clock b.is-gold { color: var( --pc-gold-hi ); }
.proace-pcard.proace-pcard .proace-pcard__clock b time { font: inherit; color: inherit; }
.proace-pcard.proace-pcard .proace-pcard__clock span { display: block; margin-top: 5px; font: 600 10.5px/1.2 var( --pc-body ); color: var( --pc-muted ); white-space: nowrap; }
.proace-pcard.proace-pcard .proace-pcard__clock span time { font: inherit; color: inherit; }

/* ProAce call -------------------------------------------------------- */
.proace-pcard.proace-pcard .proace-pcard__call {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0 18px;
	padding: 9px 12px;
	border-radius: 12px;
	background: rgba( 233, 180, 76, 0.08 );
	border: 1px solid rgba( 233, 180, 76, 0.28 );
}
.proace-pcard.proace-pcard .proace-pcard__call-lb { font: 800 10px/1 var( --pc-head ); letter-spacing: 0.12em; color: var( --pc-gold-hi ); text-transform: uppercase; white-space: nowrap; }
.proace-pcard.proace-pcard .proace-pcard__call-w { font: 800 14px/1 var( --pc-head ); white-space: nowrap; }
.proace-pcard.proace-pcard .proace-pcard__meter { flex: 1; min-width: 40px; height: 6px; border-radius: 99px; background: rgba( 234, 244, 255, 0.1 ); overflow: hidden; }
.proace-pcard.proace-pcard .proace-pcard__meter i { display: block; height: 100%; border-radius: 99px; background: linear-gradient( 90deg, var( --pc-gold ), var( --pc-gold-hi ) ); }
.proace-pcard.proace-pcard .proace-pcard__call-pc { font: 700 12px/1 var( --pc-mono ); color: #ffe9be; }

/* Picks -------------------------------------------------------------- */
.proace-pcard.proace-pcard .proace-pcard__picks {
	position: relative;
	flex: 1;
	padding: 14px 18px 16px;
}
.proace-pcard.proace-pcard .proace-pcard__rows { display: flex; flex-direction: column; gap: 12px; }
.proace-pcard.proace-pcard--locked .proace-pcard__rows {
	min-height: 168px;
	filter: blur( 3px );
	opacity: 0.42;
	pointer-events: none;
	user-select: none;
}
.proace-pcard.proace-pcard .proace-pcard__q {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
}
.proace-pcard.proace-pcard .proace-pcard__ql {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	font: 800 10.5px/1 var( --pc-head );
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var( --pc-muted );
}
.proace-pcard.proace-pcard .proace-pcard__ql em {
	font: 700 10.5px/1 var( --pc-mono );
	font-style: normal;
	letter-spacing: 0;
	text-transform: none;
	color: var( --pc-sand );
}
.proace-pcard.proace-pcard .proace-pcard__opts { display: grid; grid-template-columns: repeat( 2, minmax( 0, 1fr ) ); gap: 8px; }
.proace-pcard.proace-pcard .proace-pcard__opts--extra { grid-template-columns: repeat( auto-fit, minmax( 90px, 1fr ) ); }

.proace-pcard.proace-pcard .proace-pcard__o {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 6px;
	width: 100%;
	min-height: 50px;
	margin: 0;
	padding: 0 13px;
	border-radius: 13px;
	border: 1px solid rgba( 234, 244, 255, 0.18 );
	background: rgba( 234, 244, 255, 0.04 );
	color: var( --pc-ink );
	font: 800 14.5px/1.1 var( --pc-head );
	text-align: left;
	text-transform: none;
	letter-spacing: 0;
	overflow: hidden;
	cursor: pointer;
	box-shadow: none;
	transform: none;
	opacity: 1;
	transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
}
.proace-pcard.proace-pcard .proace-pcard__opts--extra .proace-pcard__o { min-height: 38px; font-size: 13px; border-style: dashed; }
.proace-pcard.proace-pcard .proace-pcard__o::before,
.proace-pcard.proace-pcard .proace-pcard__o::after { content: none; display: none; }
.proace-pcard.proace-pcard .proace-pcard__o:hover:not( :disabled ) { border-color: var( --pc-gold ); transform: translateY( -1px ); }
.proace-pcard.proace-pcard .proace-pcard__o:active:not( :disabled ) { transform: scale( 0.98 ); }
.proace-pcard.proace-pcard .proace-pcard__o:focus-visible { outline: 2px solid var( --pc-gold-hi ); outline-offset: 2px; }
.proace-pcard.proace-pcard .proace-pcard__o:disabled { cursor: default; }
.proace-pcard.proace-pcard .proace-pcard__fill {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	background: rgba( 234, 244, 255, 0.07 );
	transition: width 0.5s ease;
}
.proace-pcard.proace-pcard :is( .is-voted, .proace-prediction--locked ) .proace-pcard__fill { width: var( --proace-pct, 0% ); }
.proace-pcard.proace-pcard .proace-pcard__n,
.proace-pcard.proace-pcard .proace-pcard__s { position: relative; min-width: 0; }
.proace-pcard.proace-pcard .proace-pcard__n { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.proace-pcard.proace-pcard .proace-pcard__s { flex: none; font: 700 11.5px/1 var( --pc-mono ); color: #9fb3cf; opacity: 1; }

.proace-pcard.proace-pcard .proace-prediction__option--mine { border-color: var( --pc-amber ); background: rgba( 255, 176, 32, 0.13 ); box-shadow: inset 0 0 0 1px var( --pc-amber ); }
.proace-pcard.proace-pcard .proace-prediction__option--mine .proace-pcard__fill { background: rgba( 255, 176, 32, 0.24 ); }
.proace-pcard.proace-pcard .proace-prediction__option--mine .proace-pcard__s { color: var( --pc-gold-hi ); }
.proace-pcard.proace-pcard .proace-prediction__option--mine .proace-pcard__n::before { content: "✓ "; }
.proace-pcard.proace-pcard .proace-prediction__option--pending { opacity: 0.7; }
.proace-pcard.proace-pcard .proace-pcard__o.is-ok { border-color: var( --pc-green ); background: rgba( 79, 209, 139, 0.13 ); box-shadow: none; }
.proace-pcard.proace-pcard .proace-pcard__o.is-ok .proace-pcard__s { color: #8ff0b7; }
.proace-pcard.proace-pcard .proace-pcard__o.is-ok .proace-pcard__fill,
.proace-pcard.proace-pcard .proace-pcard__o.is-no .proace-pcard__fill { display: none; }
.proace-pcard.proace-pcard .proace-pcard__o.is-no { border-color: rgba( 255, 120, 120, 0.55 ); background: rgba( 255, 120, 120, 0.06 ); color: #ffb7b7; box-shadow: none; }
.proace-pcard.proace-pcard .proace-pcard__o.is-no .proace-pcard__n::before { content: "✕ "; }
.proace-pcard.proace-pcard .proace-pcard__o.is-no .proace-pcard__s { color: #ffb7b7; }
.proace-pcard.proace-pcard .proace-pcard__o.is-dim { opacity: 0.5; }

.proace-pcard.proace-pcard .proace-prediction__feedback {
	display: block;
	margin: 0;
	min-height: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: none;
	font: 700 12px/1.3 var( --pc-body );
	color: #7ee3a8;
	animation: none;
}
.proace-pcard.proace-pcard .proace-prediction__feedback::before { content: none; }
.proace-pcard.proace-pcard .proace-prediction__feedback--submitting { color: #8ec1ff; }
.proace-pcard.proace-pcard .proace-prediction__feedback--error { color: #ffb7b7; }
.proace-pcard.proace-pcard .proace-prediction__feedback:empty { display: none; }
/* The growth "Share my pick" button stays off the premium card (no layout jump). */
.proace-pcard.proace-pcard .proace-share-pick { display: none !important; }

/* Lock overlay (not entered / payment being checked) ------------------ */
.proace-pcard.proace-pcard .proace-pcard__lock {
	position: absolute;
	inset: 8px 12px 10px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px;
	border-radius: 16px;
	text-align: center;
	background: rgba( 8, 18, 35, 0.78 );
	-webkit-backdrop-filter: blur( 6px );
	backdrop-filter: blur( 6px );
	border: 1px dashed rgba( 233, 180, 76, 0.6 );
	color: var( --pc-gold );
	animation: pcLockIn 0.4s ease both;
}
.proace-pcard.proace-pcard .proace-pcard__lock.is-pending { border-style: solid; border-color: rgba( 58, 134, 224, 0.5 ); color: #8ec1ff; }
.proace-pcard.proace-pcard .proace-pcard__lock h4 { margin: 0; padding: 0; font: 800 16px/1.2 var( --pc-head ); color: #fff; letter-spacing: 0; text-transform: none; border: 0; }
.proace-pcard.proace-pcard .proace-pcard__lock h4::before,
.proace-pcard.proace-pcard .proace-pcard__lock h4::after { content: none; }
.proace-pcard.proace-pcard .proace-pcard__lock p { margin: 0; font: 500 12.5px/1.45 var( --pc-body ); color: #cdbb95; }
.proace-pcard.proace-pcard .proace-pcard__lock.is-pending p { color: #a9c2e0; }
@keyframes pcLockIn { from { opacity: 0; transform: scale( 0.97 ); } }
.proace-pcard.proace-pcard .proace-pcard__gold {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 46px;
	padding: 0 22px;
	border-radius: 12px;
	background: linear-gradient( 180deg, var( --pc-gold-hi ), var( --pc-amber ) );
	color: #1a1200;
	font: 800 15px/1 var( --pc-head );
	box-shadow: 0 10px 22px -10px rgba( 255, 176, 32, 0.85 );
	transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.proace-pcard.proace-pcard .proace-pcard__gold:hover { transform: translateY( -1px ); box-shadow: 0 14px 26px -10px rgba( 255, 176, 32, 0.95 ); color: #1a1200; }

/* Footer --------------------------------------------------------------- */
.proace-pcard.proace-pcard .proace-pcard__ft {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 10px;
	padding: 12px 18px 15px;
	border-top: 1px solid rgba( 233, 180, 76, 0.18 );
	font: 600 12px/1.35 var( --pc-body );
	color: #b6a684;
}
.proace-pcard.proace-pcard .proace-pcard__ft b { color: #fff; }
.proace-pcard.proace-pcard .proace-pcard__ft time { font: inherit; color: inherit; }
.proace-pcard.proace-pcard .proace-pcard__ft a { flex: none; font-weight: 700; color: var( --pc-gold-hi ); white-space: nowrap; }
.proace-pcard.proace-pcard .proace-pcard__ft a:hover { color: #fff; }
.proace-pcard.proace-pcard .proace-pcard__crown { color: var( --pc-gold-hi ); }

/* Narrow (sidebar / phone) -------------------------------------------- */
.proace-pcard.proace-pcard--compact .proace-pcard__vs { padding: 12px 14px 8px; }
.proace-pcard.proace-pcard--compact .proace-contest__crest { width: 44px; height: 44px; font-size: 12px; }
.proace-pcard.proace-pcard--compact .proace-contest__team-name { font-size: 15px; }
@media ( max-width: 420px ) {
	.proace-pcard.proace-pcard .proace-pcard__band,
	.proace-pcard.proace-pcard .proace-pcard__picks,
	.proace-pcard.proace-pcard .proace-pcard__ft { padding-left: 14px; padding-right: 14px; }
	.proace-pcard.proace-pcard .proace-pcard__strip { padding: 12px 14px 0; }
	.proace-pcard.proace-pcard .proace-pcard__call { margin: 0 14px; }
	.proace-pcard.proace-pcard .proace-contest__crest { width: 46px; height: 46px; }
	.proace-pcard.proace-pcard .proace-contest__team-name { font-size: 15px; }
	.proace-pcard.proace-pcard .proace-pcard__clock b { font-size: 19px; }
	.proace-pcard.proace-pcard .proace-pcard__o { min-height: 46px; font-size: 14px; }
}

@media ( prefers-reduced-motion: reduce ) {
	.proace-pcard.proace-pcard,
	.proace-pcard.proace-pcard * { animation: none !important; transition: none !important; }
	.proace-pcard.proace-pcard:hover { transform: none; }
}

/* 2026-10-12: tighter compact card for the post sidebar slider. */
.proace-pcard.proace-pcard--compact .proace-pcard__band { padding: 11px 12px; gap: 8px; }
.proace-pcard.proace-pcard--compact .proace-pcard__seal { padding: 4px 8px 4px 5px; font-size: 9.5px; }
.proace-pcard.proace-pcard--compact .proace-pcard__strip { padding: 12px 12px 0; }
.proace-pcard.proace-pcard--compact .proace-pcard__vs { padding: 12px 10px 8px; gap: 4px; }
.proace-pcard.proace-pcard--compact .proace-contest__crest { width: 40px; height: 40px; font-size: 11px; }
.proace-pcard.proace-pcard--compact .proace-contest__team-name { font-size: 13px; white-space: normal; text-align: center; line-height: 1.15; }
.proace-pcard.proace-pcard--compact .proace-pcard__clock b { font-size: 17px; }
.proace-pcard.proace-pcard--compact .proace-pcard__picks { padding: 12px; }
.proace-pcard.proace-pcard--compact .proace-pcard__o { min-height: 42px; padding: 0 10px; font-size: 13px; }
.proace-pcard.proace-pcard--compact .proace-pcard__ft { padding: 10px 12px 12px; font-size: 11.5px; }

/* 2026-10-12: Predictions page — keep the page's compact Match/Toss layout
   and rainbow rims off the premium card (higher specificity than
   .cricket-predictions-page .proace-predictions-grid … rules). */
.cricket-predictions-page .proace-predictions-grid > .proace-pcard.proace-pcard {
	padding: 0;
	border-radius: 22px;
	background: linear-gradient( 180deg, #15243e 0%, #0b1a31 100% );
	box-shadow: 0 0 0 1.5px #e9b44c, 0 0 0 5px rgba( 233, 180, 76, 0.1 ), 0 26px 50px -24px rgba( 233, 180, 76, 0.35 );
	animation: none;
	filter: none;
}
.cricket-predictions-page .proace-predictions-grid .proace-pcard.proace-pcard .proace-contest__team,
.cricket-predictions-page .proace-predictions-grid .proace-pcard.proace-pcard .proace-contest__team:first-child { flex-direction: column; justify-content: flex-start; align-items: center; gap: 8px; text-align: center; }
.cricket-predictions-page .proace-predictions-grid .proace-pcard.proace-pcard .proace-contest__crest { width: 50px; height: 50px; font-size: 13px; }
.cricket-predictions-page .proace-predictions-grid .proace-pcard.proace-pcard .proace-contest__team-name { font-size: 16px; color: #eaf4ff; }
.proace-pcard.proace-pcard .proace-pcard__comp { flex: 1; }