/*
 * WP Rankings v2 — /statistics/ page restyle.
 * Enqueued ONLY on the statistics page (is_page 'statistics'), so the generic
 * Bootstrap .table / .table-responsive selectors below are safe here and never
 * reach the ranking tables on other pages. Re-skins the V1 [wpr_install_counts]
 * buckets table to the V2 card aesthetic (same container, typography, spacing,
 * hover as the trending / single-page cards). Markup + the working
 * /trending/?active_installs_filter=N links are untouched — CSS only.
 *
 * The only .table on this page is the buckets table, so unprefixed selectors are
 * intentional (the stylesheet itself is page-scoped via the enqueue condition).
 */

:root {
	--wpr-home-ink: #101828;
	--wpr-home-muted: #667085;
	--wpr-home-line: #e9ebf0;
	--wpr-home-primary: #5b39f2;
}

/* The buckets table becomes a single white V2 card. */
.table-responsive {
	max-width: 620px;
	margin: 0 auto 2rem;
	border: 1px solid rgba(16, 24, 40, 0.08);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 18px 48px rgba(16, 24, 40, 0.07);
	overflow: hidden;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "segoe ui", Roboto, Helvetica, Arial, sans-serif;
}

.table-responsive > table.table {
	margin: 0;
	color: var(--wpr-home-ink);
	font-size: 0.92rem;
	vertical-align: middle;
}

/* Header row. */
table.table > thead > tr > th {
	padding: 0.85rem 1.1rem;
	border: 0;
	border-bottom: 1px solid var(--wpr-home-line);
	background: #fbfbfe;
	color: var(--wpr-home-muted);
	font-size: 0.74rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

/* Body rows. */
table.table > tbody > tr > th,
table.table > tbody > tr > td {
	padding: 0.65rem 1.1rem;
	border-top: 1px solid var(--wpr-home-line);
	vertical-align: middle;
	font-weight: 500;
}

table.table > tbody > tr:first-child > th,
table.table > tbody > tr:first-child > td {
	border-top: 0;
}

/* Kill Bootstrap striping; use a clean hover instead (matches V2 rank rows). */
table.table-striped > tbody > tr > *,
table.table-striped > tbody > tr:nth-of-type(odd) > * {
	--bs-table-accent-bg: transparent;
	--bs-table-bg-type: initial;
	background-color: transparent;
}

table.table > tbody > tr:hover {
	background-color: rgba(91, 57, 242, 0.04);
}

/* The count column reads as the emphasised value. */
table.table > tbody > tr > td {
	text-align: right;
	font-variant-numeric: tabular-nums;
	font-weight: 700;
}

/* Links inside the table: V2 ink, primary on hover. */
table.table a {
	color: var(--wpr-home-ink);
	text-decoration: none;
	font-weight: inherit;
}

table.table > tbody > tr:hover a {
	color: var(--wpr-home-primary);
}

table.table a:hover {
	color: var(--wpr-home-primary);
	text-decoration: underline;
}
