/* Shining Awards ↔ TotalPoll colour bridge (THEME-SIDE ONLY).
 *
 * The TotalPoll plugin is a read-only referenced dependency — we NEVER edit it.
 * So the coupling lives here: this sheet feeds the plugin's own design-token
 * API (--tp-* on the poll, and the profile/leaderboard tokens) from our brand
 * palette (--sa-*, see tokens.css), so the voting UI + idol pages adopt the
 * Shining Awards identity without touching the plugin.
 *
 * Why `!important`: the plugin declares --tp-* at high specificity
 * (`div#totalpoll.totalpoll-wrapper[totalpoll-uid="…"]`) and profile.css sets its
 * tokens on `.tp-profile-page`. A plain `:root`/class rule would lose the cascade,
 * and with LiteSpeed combining stylesheets we can't rely on source order. Marking
 * only these custom-property declarations `!important` wins deterministically. We
 * touch ONLY colour tokens — never the plugin's geometry, layout, or markup.
 *
 * Fallbacks reproduce the plugin's own defaults, so if tokens.css ever fails to
 * load the poll/profile still render exactly as the stock plugin would.
 */

/* ─── Poll: Bicanosaurus template (adopts the brand palette) ─────────────── */
.totalpoll-wrapper {
	--tp-accent:      var(--sa-violet,       #8b5cf6) !important;
	--tp-accent-2:    var(--sa-indigo,       #6366f1) !important;
	--tp-accent-soft: var(--sa-violet-light, #a78bfa) !important;
	--tp-gold:        var(--sa-gold,         #f59e0b) !important;
	--tp-gold-2:      var(--sa-gold-2,       #fbbf24) !important;
	--tp-vote:        var(--sa-vote,         #f43f5e) !important;
	--tp-vote-2:      var(--sa-vote-2,       #ec4899) !important;
	--tp-surface:     var(--sa-bg-2,         #17141f) !important;
	--tp-surface-2:   var(--sa-surface-2,    #221d38) !important;
	--tp-text:        var(--sa-text,         #f5f3ff) !important;
	--tp-text-dim:    var(--sa-text-muted,   #cbd5e1) !important;
	--tp-text-mute:   var(--sa-text-dim,     #94a3b8) !important;
	--tp-holo-1:      var(--sa-holo-1,       #7cf7d4) !important;
	--tp-holo-2:      var(--sa-holo-2,       #a78bfa) !important;
	--tp-holo-3:      var(--sa-holo-3,       #f472b6) !important;

	/* 2x-power "badge" palette — the plugin ships these amber (#fde68a/#f59e0b)
	   as the gold 2x chip. Re-point them to the brand's non-gold highlight accent
	   so the 2x indicator stops reading as a gold award. */
	--tp-badge-gold-1: var(--sa-gold-2, #67e8f9) !important;
	--tp-badge-gold-2: var(--sa-gold,   #22d3ee) !important;
	--tp-badge-gold-3: var(--sa-gold,   #22d3ee) !important;
	--tp-shadow-gold:  0 4px 12px color-mix(in srgb, var(--sa-gold, #22d3ee) 42%, transparent) !important;
}

/* Vote-button label tracks the brand's on-accent ink so it stays legible on the
   light-accent presets (Amber, Aurora) where the plugin's hardcoded white would
   wash out. Scoped away from the .has-power-boost variant, which is an
   outline/dark button carrying its own accent-coloured text. Colour only. */
.totalpoll-wrapper .totalpoll-choice-vote-button:not(.has-power-boost),
.totalpoll-wrapper .totalpoll-choice-vote-button:not(.has-power-boost):hover {
	color: var(--sa-on-accent, #fff) !important;
}

/* ─── Profile directory + leaderboard: flip the stock LIGHT design to dark ──
 * Scoped `:not(.tp-idol)` so the single idol page (already dark in the plugin)
 * is handled separately below. Fallbacks are the plugin's LIGHT values, so on a
 * non-Shining theme these degrade back to the original light "hall of fame". */
.tp-profile-page:not(.tp-idol) {
	--tp-accent:   var(--sa-violet-light, #6d28d9) !important;
	--tp-accent-2: var(--sa-magenta,      #db2777) !important;
	--tp-gold:     var(--sa-gold,         #b8860b) !important;
	--tp-ink:      var(--sa-text,         #14121a) !important;
	--tp-ink-2:    var(--sa-text-muted,   #3a3645) !important;
	--tp-muted:    var(--sa-text-dim,     #6b7280) !important;
	--tp-line:     var(--sa-border,       #e7e7ee) !important;
	--tp-card:     var(--sa-surface-1,    #ffffff) !important;
	--tp-bg-soft:  var(--sa-surface-2,    #f6f6fb) !important;
	--tp-shadow:   var(--sa-shadow-card,  0 1px 2px rgba(20, 18, 26, .06), 0 10px 30px rgba(20, 18, 26, .07)) !important;
}

/* ═══ De-gold the plugin's "2x power" UI (theme-side, no plugin edit) ═══════
 * The Bicanosaurus template hardcodes AMBER/GOLD across its 2x-power feature
 * (the "reserved: 2x power only" look): the always-on nominee frame, the welcome
 * "2× VOTE POWER" modal, the power indicator chip, and the boost vote button.
 * These are literal amber hexes/rgba (#fcd34d, #fde68a, rgba(251,191,36,…)),
 * NOT the plugin's colour tokens, so the --sa-*→--tp-* bridge above can't reach
 * them. We override the specific selectors here. Shining Awards is fan-choice,
 * NOT a gold gala — everything below is recoloured to the brand's non-gold
 * "power" highlight (--sa-gold, cyan/mint/pink per active style). `!important`
 * beats the plugin's (non-important) declarations regardless of specificity;
 * colour-mix keeps the alpha tints tracking the active style preset.
 *
 * Recolouring only — geometry/layout/markup untouched; the plugin stays pristine.
 */

/* Nominee card: kill the always-on amber frame + the amber hover/checked frame
   (the default frame is already brand-purple; only the gold states need fixing). */
.totalpoll-wrapper .totalpoll-question-choices-item-container {
	border-color: var(--sa-border-strong, rgba(139, 92, 246, .40)) !important;
}
.totalpoll-wrapper .totalpoll-question-choices-item-profile {
	--nominee-frame-border: var(--sa-border-strong, rgba(216, 196, 255, .55)) !important;
	--nominee-frame-glow:   color-mix(in srgb, var(--sa-violet, #7c3aed) 26%, transparent) !important;
	--nominee-frame-sheen:  rgba(255, 255, 255, .18) !important;
}

/* Welcome overlay — the "⚡ 2× VOTE POWER" intro modal. */
.totalpoll-wrapper .totalpoll-welcome-overlay {
	background:
		radial-gradient(circle at top center, color-mix(in srgb, var(--sa-gold, #22d3ee) 14%, transparent), transparent 34%),
		radial-gradient(circle at bottom left, color-mix(in srgb, var(--sa-violet, #7c3aed) 20%, transparent), transparent 38%),
		rgba(5, 7, 18, .92) !important;
}
.totalpoll-wrapper .totalpoll-welcome-card {
	border-color: color-mix(in srgb, var(--sa-gold, #22d3ee) 34%, transparent) !important;
	box-shadow: 0 18px 44px rgba(0, 0, 0, .45), var(--tp-shadow) !important;
}
.totalpoll-wrapper .totalpoll-welcome-hero-bolt { color: var(--sa-gold, #22d3ee) !important; }
.totalpoll-wrapper .totalpoll-welcome-hero-2x {
	background-image: linear-gradient(110deg,
		var(--sa-gold, #22d3ee) 0%,
		var(--sa-violet-light, #a78bfa) 38%,
		#ffffff 50%,
		var(--sa-violet-light, #a78bfa) 62%,
		var(--sa-gold, #22d3ee) 100%) !important;
}
.totalpoll-wrapper .totalpoll-welcome-hero-caption {
	color: var(--sa-gold, #22d3ee) !important;
	border-top-color: color-mix(in srgb, var(--sa-gold, #22d3ee) 34%, transparent) !important;
}
.totalpoll-wrapper .totalpoll-welcome-step-icon-boost {
	color: var(--sa-gold, #22d3ee) !important;
	background: color-mix(in srgb, var(--sa-gold, #22d3ee) 16%, transparent) !important;
	border-color: color-mix(in srgb, var(--sa-gold, #22d3ee) 50%, transparent) !important;
}
.totalpoll-wrapper .totalpoll-welcome-step-boost .totalpoll-welcome-step-label {
	color: var(--sa-gold, #22d3ee) !important;
}

/* Power indicator chip on vote buttons + the boost ("Obsidian Luxe") button. */
.totalpoll-wrapper .power-indicator {
	color: var(--sa-gold, #22d3ee) !important;
	text-shadow: 0 0 6px color-mix(in srgb, var(--sa-gold, #22d3ee) 50%, transparent) !important;
}
.totalpoll-wrapper .totalpoll-choice-vote-button.has-power-boost {
	color: var(--sa-gold, #22d3ee) !important;
	border-color: color-mix(in srgb, var(--sa-gold, #22d3ee) 55%, transparent) !important;
	text-shadow: 0 0 10px color-mix(in srgb, var(--sa-gold, #22d3ee) 45%, transparent) !important;
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--sa-gold, #22d3ee) 14%, transparent), 0 6px 16px rgba(0, 0, 0, .45) !important;
}
.totalpoll-wrapper .totalpoll-choice-vote-button.has-power-boost:hover {
	color: var(--sa-gold-2, #67e8f9) !important;
	border-color: color-mix(in srgb, var(--sa-gold, #22d3ee) 80%, transparent) !important;
	box-shadow: 0 0 0 1px color-mix(in srgb, var(--sa-gold, #22d3ee) 25%, transparent), 0 8px 22px color-mix(in srgb, var(--sa-gold, #22d3ee) 30%, transparent) !important;
}
.totalpoll-wrapper .totalpoll-choice-vote-button.has-power-boost .power-indicator {
	color: #04121a !important; /* dark ink reads on the cyan chip (bg via --tp-badge-gold-*) */
	box-shadow: 0 0 8px color-mix(in srgb, var(--sa-gold, #22d3ee) 50%, transparent) !important;
}

/* ─── Single idol profile page (already dark): retune to track --sa-* ──────
 * Fallbacks are the plugin's own DARK idol values, so it stays dark regardless. */
.tp-profile-page.tp-idol {
	--tp-ink:     var(--sa-text,         #f5f3ff) !important;
	--tp-ink-2:   var(--sa-text-muted,   #cbd5e1) !important;
	--tp-muted:   var(--sa-text-dim,     #94a3b8) !important;
	--tp-line:    var(--sa-border,       rgba(148, 163, 184, 0.16)) !important;
	--tp-card:    var(--sa-surface-1,    #1b1730) !important;
	--tp-bg-soft: var(--sa-surface-2,    #221d38) !important;
	--tp-accent:  var(--sa-violet-light, #a78bfa) !important;
	--tp-gold:    var(--sa-gold-2,       #fbbf24) !important;
}
