/**
 * Price index (/reports/) — issue #471.
 *
 * Scoped to .cw-rd--pindex and loaded only on the two price-index routes, so
 * nothing here can reach another page. Everything else on these templates
 * (hero, cards, rail, breadcrumb) reuses the theme's existing cw- classes;
 * this file adds only what the theme has no equivalent for — the data tables,
 * the edition list, and print.
 *
 * Colours come from the theme's custom properties where they exist, with a
 * literal fallback, so a theme palette change carries through rather than
 * being silently overridden here.
 */

.cw-rd--pindex .cw-pindex-standfirst {
	font-size: 1.05rem;
	line-height: 1.6;
	margin: 0 0 2rem;
}

.cw-rd--pindex .cw-pindex-sec {
	margin: 0 0 2.75rem;
}

.cw-rd--pindex .cw-pindex-sec h2 {
	margin: 0 0 .35rem;
}

.cw-rd--pindex .cw-pindex-sec h3 {
	margin: 2rem 0 .5rem;
	font-size: 1.05rem;
}

.cw-rd--pindex .cw-pindex-note {
	margin: 0 0 1rem;
	font-size: .9rem;
	opacity: .75;
}

/* ── Tables ────────────────────────────────────────────────────────────────
   A wide table must scroll inside its own box rather than push the page
   sideways on a phone — these have four columns and long model names. */

.cw-rd--pindex .cw-tablewrap {
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	margin: 0 0 1rem;
}

.cw-rd--pindex .cw-pindex-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .94rem;
}

.cw-rd--pindex .cw-pindex-table th,
.cw-rd--pindex .cw-pindex-table td {
	padding: .55rem .7rem;
	text-align: left;
	border-bottom: 1px solid var(--cw-rule, rgba(0, 0, 0, .09));
	vertical-align: baseline;
}

.cw-rd--pindex .cw-pindex-table thead th {
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .02em;
	text-transform: uppercase;
	opacity: .7;
	white-space: nowrap;
	border-bottom-width: 2px;
}

.cw-rd--pindex .cw-pindex-table tbody th {
	font-weight: 600;
}

.cw-rd--pindex .cw-pindex-table .num {
	text-align: right;
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

/* The sample size rides under its own figure: it belongs to that number, and
   a reader deciding whether to believe a row should not have to hunt for it. */
.cw-rd--pindex .cw-pindex-table .n {
	display: block;
	font-size: .72rem;
	font-weight: 400;
	opacity: .6;
	margin-top: .1rem;
}

.cw-rd--pindex .cw-pindex-table .chg {
	font-weight: 700;
}

/* Direction is carried by the sign glyph as well as the colour — colour alone
   would fail anyone who cannot distinguish these two hues. */
.cw-rd--pindex .cw-pindex-table .chg.up {
	color: var(--cw-pos, #1a7f45);
}

.cw-rd--pindex .cw-pindex-table .chg.down {
	color: var(--cw-neg, #b3261e);
}

.cw-rd--pindex .cw-pindex-table tbody tr:hover {
	background: var(--cw-hover, rgba(0, 0, 0, .025));
}

.cw-rd--pindex .cw-pindex-table--mix {
	max-width: 32rem;
}

/* ── Limits list ──────────────────────────────────────────────────────────── */

.cw-rd--pindex .cw-pindex-limits {
	margin: 0 0 1.5rem;
	padding-left: 1.1rem;
}

.cw-rd--pindex .cw-pindex-limits li {
	margin-bottom: .7rem;
	line-height: 1.55;
}

/* ── Edition list (/reports/) ─────────────────────────────────────────────── */

.cw-rd--pindex .cw-pindex-editions {
	list-style: none;
	margin: 0 0 2.5rem;
	padding: 0;
}

.cw-rd--pindex .cw-pindex-editions li {
	margin: 0 0 .6rem;
}

.cw-rd--pindex .cw-pindex-ed {
	display: grid;
	grid-template-columns: 1fr auto;
	gap: .15rem 1rem;
	padding: .9rem 1.1rem;
	border: 1px solid var(--cw-rule, rgba(0, 0, 0, .12));
	border-radius: 8px;
	text-decoration: none;
	color: inherit;
}

.cw-rd--pindex .cw-pindex-ed:hover {
	border-color: var(--cw-accent, #b3261e);
}

.cw-rd--pindex .cw-pindex-ed .ed-label {
	font-weight: 700;
	font-size: 1.05rem;
}

.cw-rd--pindex .cw-pindex-ed .ed-chg {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: center;
	font-size: 1.35rem;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.cw-rd--pindex .cw-pindex-ed .ed-chg.up {
	color: var(--cw-pos, #1a7f45);
}

.cw-rd--pindex .cw-pindex-ed .ed-chg.down {
	color: var(--cw-neg, #b3261e);
}

.cw-rd--pindex .cw-pindex-ed .ed-meta {
	font-size: .85rem;
	opacity: .7;
}

/* ── Print ────────────────────────────────────────────────────────────────
   Decision #2 was HTML plus print styling rather than a generated PDF, so
   this is the deliverable for anyone who wants the edition on paper. Tables
   must not clip: the scroll box has to become a plain block, and rows must
   not break across pages. */

@media print {

	.cw-rd--pindex .cw-rail,
	.cw-rd--pindex .cw-comm-crumb {
		display: none;
	}

	.cw-rd--pindex .cw-layout {
		display: block;
	}

	.cw-rd--pindex .cw-tablewrap {
		overflow: visible;
	}

	.cw-rd--pindex .cw-pindex-table {
		font-size: 9pt;
		page-break-inside: auto;
	}

	.cw-rd--pindex .cw-pindex-table tr {
		page-break-inside: avoid;
	}

	.cw-rd--pindex .cw-pindex-table thead {
		display: table-header-group;
	}

	.cw-rd--pindex .cw-pindex-sec {
		page-break-inside: avoid;
	}

	/* A printed page loses every href, and this one is meant to be checkable —
	   so the model links print their destination. */
	.cw-rd--pindex .cw-pindex-table a::after {
		content: " (" attr(href) ")";
		font-size: 7pt;
		opacity: .6;
	}
}

/* ── Series bars ──────────────────────────────────────────────────────────
   A cheap horizontal bar rather than a chart library: it prints, it needs no
   JS, and it degrades to a plain table when CSS is unavailable. The number is
   always present in its own cell, so the bar is decoration and is marked
   role="presentation" accordingly. */

.cw-rd--pindex .cw-pindex-table--series .bar-col {
	width: 40%;
	min-width: 7rem;
}

.cw-rd--pindex .cw-bar {
	display: flex;
	justify-content: center;
	width: 100%;
	height: .55rem;
	background: var(--cw-hover, rgba(0, 0, 0, .05));
	border-radius: 2px;
	position: relative;
}

/* Centre line: bars grow left for a fall, right for a rise. */
.cw-rd--pindex .cw-bar::before {
	content: "";
	position: absolute;
	left: 50%;
	top: -2px;
	bottom: -2px;
	width: 1px;
	background: var(--cw-rule, rgba(0, 0, 0, .25));
}

.cw-rd--pindex .cw-bar-fill {
	position: absolute;
	top: 0;
	bottom: 0;
	border-radius: 2px;
}

.cw-rd--pindex .cw-bar-fill.up {
	left: 50%;
	background: var(--cw-pos, #1a7f45);
}

.cw-rd--pindex .cw-bar-fill.down {
	right: 50%;
	background: var(--cw-neg, #b3261e);
}

.cw-rd--pindex .cw-pindex-table--series .is-current {
	background: var(--cw-hover, rgba(0, 0, 0, .04));
}

.cw-rd--pindex .cw-pindex-table--series .is-current th[scope="row"] {
	font-weight: 700;
}

@media print {
	.cw-rd--pindex .cw-bar-fill.up,
	.cw-rd--pindex .cw-bar-fill.down {
		/* Background colours are commonly dropped when printing; a border
		   survives, so the bar still reads on paper. */
		border: 1px solid #000;
		background: #000;
	}
}

/* ── Draft state ──────────────────────────────────────────────────────────
   Only an administrator can reach a draft edition, so this is reviewer
   furniture rather than public UI. It is deliberately loud: the one mistake
   worth designing against is a reviewer believing a draft is live, or the
   reverse. */

.cw-rd--pindex .cw-pindex-draft {
	margin: 0 0 1.25rem;
	padding: .85rem 1.1rem;
	border: 1px solid var(--cw-neg, #b3261e);
	border-left-width: 4px;
	border-radius: 6px;
	background: rgba(179, 38, 30, .06);
	font-size: .92rem;
	line-height: 1.5;
}

.cw-rd--pindex .cw-pindex-draft code {
	font-size: .88em;
	word-break: break-word;
}

.cw-rd--pindex .cw-pindex-ed.is-draft {
	border-style: dashed;
}

.cw-rd--pindex .ed-badge {
	display: inline-block;
	margin-left: .4rem;
	padding: .05rem .4rem;
	border-radius: 3px;
	background: var(--cw-neg, #b3261e);
	color: #fff;
	font-size: .7rem;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
	vertical-align: .1em;
}

@media print {
	/* A printed draft that does not say so is the worst artefact this page
	   could produce. */
	.cw-rd--pindex .cw-pindex-draft {
		border: 2px solid #000;
	}
}


/* Latest editorial report callout on /reports/ (interim, camleypedia#495). */
.cw-pindex-latest {
	display: block;
	margin: 0 0 1.75rem;
	padding: 1.15rem 1.35rem;
	border: 1px solid var(--cw-line, #dcd7cd);
	border-left: 3px solid var(--cw-claret, #b3261e);
	border-radius: 3px;
	background: var(--cw-surface, #faf8f4);
	text-decoration: none;
	color: inherit;
	transition: background .15s ease, border-color .15s ease;
}

.cw-pindex-latest:hover,
.cw-pindex-latest:focus-visible {
	background: var(--cw-surface-2, #f4f0e8);
	border-left-color: var(--cw-claret-2, #8e1e18);
}

.cw-pindex-latest .cw-eyebrow {
	display: block;
	margin-bottom: .3rem;
}

.cw-pindex-latest .lr-title {
	display: block;
	font-size: 1.15rem;
	line-height: 1.3;
	font-weight: 600;
}

.cw-pindex-latest .lr-go {
	display: block;
	margin-top: .45rem;
	font-size: .9rem;
	opacity: .75;
}