/**
 * Leaderboard.
 *
 * Wide content scrolls inside its own container so the page body never
 * scrolls sideways on a phone. The Leaderboard screen's look arrives as
 * --plg-lb-* properties and data attributes from PLB_Board_Style; every
 * default below is the shipped design.
 */

.plg-lb {
	--plg-ink: #12181c;
	--plg-accent: #0b6b66;
	--plg-rule: var(--plg-lb-rule, rgba(18, 24, 28, 0.12));
	--plg-f-title: var(--plg-lb-title-size, 22px);
	--plg-f-head: var(--plg-lb-head-size, 11px);
	--plg-f-cell: var(--plg-lb-cell-size, 15px);
	box-sizing: border-box;
	width: 100%;
	max-width: var(--plg-lb-width, none);
	margin: 0 auto;
	padding: var(--plg-lb-pad-t, 0) var(--plg-lb-pad-r, 0) var(--plg-lb-pad-b, 0) var(--plg-lb-pad-l, 0);
	color: var(--plg-ink);
	background: var(--plg-lb-panel, transparent);
	border: 0 var(--plg-lb-border-style, solid) var(--plg-lb-border-color, transparent);
	border-width: var(--plg-lb-bw-t, 0) var(--plg-lb-bw-r, 0) var(--plg-lb-bw-b, 0) var(--plg-lb-bw-l, 0);
	border-radius: var(--plg-lb-r-tl, 0) var(--plg-lb-r-tr, 0) var(--plg-lb-r-br, 0) var(--plg-lb-r-bl, 0);
	overflow-x: auto;
}

@media (max-width: 1024px) {
	.plg-lb {
		--plg-f-title: var(--plg-lb-title-size-t, var(--plg-lb-title-size, 22px));
		--plg-f-head: var(--plg-lb-head-size-t, var(--plg-lb-head-size, 11px));
		--plg-f-cell: var(--plg-lb-cell-size-t, var(--plg-lb-cell-size, 15px));
	}
}

@media (max-width: 1024px) {
	.plg-lb[data-plg-set~="rank-size"] .plg-lb__table .plg-lb__place {
		font-size: var(--plg-lb-rank-size-t, var(--plg-lb-rank-size));
	}
}

@media (max-width: 600px) {
	.plg-lb {
		--plg-f-title: var(--plg-lb-title-size-m, var(--plg-lb-title-size-t, var(--plg-lb-title-size, 22px)));
		--plg-f-head: var(--plg-lb-head-size-m, var(--plg-lb-head-size-t, var(--plg-lb-head-size, 11px)));
		--plg-f-cell: var(--plg-lb-cell-size-m, var(--plg-lb-cell-size-t, var(--plg-lb-cell-size, 15px)));
	}
}

@media (max-width: 600px) {
	.plg-lb[data-plg-set~="rank-size"] .plg-lb__table .plg-lb__place {
		font-size: var(--plg-lb-rank-size-m, var(--plg-lb-rank-size-t, var(--plg-lb-rank-size)));
	}
}

.plg-lb[data-plg-shadow="soft"] {
	box-shadow: 0 12px 32px -14px rgba(15, 32, 62, 0.28);
}

.plg-lb[data-plg-shadow="strong"] {
	box-shadow: 0 22px 48px -16px rgba(15, 32, 62, 0.45);
}

.plg-lb__title {
	margin: 0 0 14px;
	font-size: var(--plg-f-title);
	line-height: 1.2;
	text-align: center;
}

.plg-lb__empty {
	margin: 0;
	padding: 20px;
	text-align: center;
	font-size: 15px;
	opacity: 0.75;
}

.plg-lb__table {
	width: 100%;
	min-width: 320px;
	border-collapse: collapse;
	font-size: var(--plg-f-cell);
}

.plg-lb__table th {
	--plg-head-line: var(--plg-lb-head-bs, solid) var(--plg-lb-head-bc, var(--plg-rule));
	padding: 8px 12px;
	font-size: var(--plg-f-head);
	font-weight: var(--plg-lb-head-weight, 700);
	letter-spacing: var(--plg-lb-head-ls, 0.07em);
	text-transform: var(--plg-lb-head-case, uppercase);
	text-align: left;
	opacity: 0.6;
	background: var(--plg-lb-head-bg, transparent);
	border-top: var(--plg-lb-head-bt, 0) var(--plg-head-line);
	border-bottom: var(--plg-lb-head-bb, 2px) var(--plg-head-line);
}

.plg-lb__table th:first-child {
	border-left: var(--plg-lb-head-bl, 0) var(--plg-head-line);
}

.plg-lb__table th + th {
	border-left: var(--plg-lb-head-between, 0) var(--plg-head-line);
}

.plg-lb__table th:last-child {
	border-right: var(--plg-lb-head-br, 0) var(--plg-head-line);
}

.plg-lb__table td {
	padding: var(--plg-lb-row-pad-t, 11px) var(--plg-lb-row-pad-r, 12px) var(--plg-lb-row-pad-b, 11px) var(--plg-lb-row-pad-l, 12px);
	border-bottom: 1px solid var(--plg-rule);
}

.plg-lb__table tr:last-child td {
	border-bottom: 0;
}

.plg-lb[data-plg-dividers="none"] .plg-lb__table td {
	border-bottom: 0;
}

.plg-lb[data-plg-stripes="1"] .plg-lb__table tbody tr:nth-child(even) td {
	background: var(--plg-lb-stripe, rgba(18, 24, 28, 0.04));
}

.plg-lb__rank {
	width: 3.5em;
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.plg-lb__num {
	text-align: right;
	font-variant-numeric: tabular-nums;
}

.plg-lb[data-plg-num-align="center"] .plg-lb__num {
	text-align: center;
}

.plg-lb[data-plg-num-align="left"] .plg-lb__num {
	text-align: left;
}

.plg-lb:not([data-plg-leader="plain"]) .plg-lb__leader td {
	font-weight: 700;
	color: var(--plg-lb-leader-ink, var(--plg-accent));
	background: var(--plg-lb-leader-bg, rgba(11, 107, 102, 0.06));
}

/* Medals for the top three, drawn on the rank number. */
.plg-lb[data-plg-rank="medals"] tr[data-plg-place] .plg-lb__place {
	display: inline-grid;
	place-items: center;
	min-width: 1.9em;
	height: 1.9em;
	padding: 0 0.3em;
	font-weight: 800;
	line-height: 1;
	color: #3d2c00;
	background: linear-gradient(145deg, #ffe58a, #f4b400);
	border-radius: 999px;
}

.plg-lb[data-plg-rank="medals"] tr[data-plg-place="2"] .plg-lb__place {
	color: #2b3138;
	background: linear-gradient(145deg, #f1f3f5, #b9c1c9);
}

.plg-lb[data-plg-rank="medals"] tr[data-plg-place="3"] .plg-lb__place {
	color: #3a1f0b;
	background: linear-gradient(145deg, #f3c39a, #c9814a);
}

/* What the theme decides until the Leaderboard screen sets it: each rule
   applies only while data-plg-set names that text property. */
.plg-lb[data-plg-set~="title-font"] .plg-lb__title { font-family: var(--plg-lb-title-font); }
.plg-lb[data-plg-set~="title-weight"] .plg-lb__title { font-weight: var(--plg-lb-title-weight); }
.plg-lb[data-plg-set~="title-color"] .plg-lb__title { color: var(--plg-lb-title-color); }
.plg-lb[data-plg-set~="title-case"] .plg-lb__title { text-transform: var(--plg-lb-title-case); }
.plg-lb[data-plg-set~="title-ls"] .plg-lb__title { letter-spacing: var(--plg-lb-title-ls); }
.plg-lb[data-plg-set~="head-font"] .plg-lb__table th { font-family: var(--plg-lb-head-font); }
.plg-lb[data-plg-set~="head-color"] .plg-lb__table th { color: var(--plg-lb-head-color); opacity: 1; }
.plg-lb[data-plg-set~="cell-font"] .plg-lb__table td { font-family: var(--plg-lb-cell-font); }
.plg-lb[data-plg-set~="cell-weight"] .plg-lb__table td { font-weight: var(--plg-lb-cell-weight); }
.plg-lb[data-plg-set~="cell-color"] .plg-lb__table td { color: var(--plg-lb-cell-color); }
.plg-lb[data-plg-set~="cell-case"] .plg-lb__table td { text-transform: var(--plg-lb-cell-case); }
.plg-lb[data-plg-set~="cell-ls"] .plg-lb__table td { letter-spacing: var(--plg-lb-cell-ls); }
.plg-lb[data-plg-set~="rank-font"] .plg-lb__table .plg-lb__place { font-family: var(--plg-lb-rank-font); }
.plg-lb[data-plg-set~="rank-weight"] .plg-lb__table .plg-lb__place { font-weight: var(--plg-lb-rank-weight); }
.plg-lb[data-plg-set~="rank-color"] .plg-lb__table .plg-lb__place { color: var(--plg-lb-rank-color); }
.plg-lb[data-plg-set~="rank-size"] .plg-lb__table .plg-lb__place { font-size: var(--plg-lb-rank-size); }
.plg-lb[data-plg-set~="rank-case"] .plg-lb__table .plg-lb__place { text-transform: var(--plg-lb-rank-case); }
.plg-lb[data-plg-set~="rank-ls"] .plg-lb__table .plg-lb__place { letter-spacing: var(--plg-lb-rank-ls); }
