/**
 * Research Publications.
 *
 * A reading list, not a card grid. There are 2 098 reports and what a visitor
 * needs is to scan titles quickly, so each row gives the title the most weight,
 * keeps the citable report number alongside it, and puts the two actions at the
 * end where they do not compete with the text.
 *
 * Scoped to the `wrc-research-publications` body class set in
 * inc/research-publications.php. Width and gutters come from wrc-container.css.
 */

.wrc-research-publications .wrc-rp {
	--rp-blue:     #094E9C;
	--rp-cyan:     #00AEEF;
	--rp-ink:      #16202C;
	--rp-ink-soft: #5A6673;
	--rp-line:     #E1E8EF;
	--rp-bg:       #F4F7FA;
	--rp-radius:   8px;

	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: var( --rp-ink );
}

/* -- search -------------------------------------------------------------- */

.wrc-research-publications .wrc-rp__search {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .6rem;
	margin: 0 0 .9rem;
}

.wrc-research-publications .wrc-rp__field {
	flex: 1 1 18rem;
	min-width: 0;
	margin: 0;
}

.wrc-research-publications .wrc-rp__field input {
	width: 100%;
	padding: .7rem .95rem;
	font: inherit;
	font-size: .95rem;
	color: var( --rp-ink );
	background: #fff;
	border: 1px solid var( --rp-line );
	border-radius: var( --rp-radius );
}

.wrc-research-publications .wrc-rp__field input:focus-visible,
.wrc-research-publications .wrc-rp__submit:focus-visible {
	outline: 2px solid var( --rp-cyan );
	outline-offset: 2px;
}

.wrc-research-publications .wrc-rp__submit {
	padding: .7rem 1.4rem;
	font: inherit;
	font-size: .9rem;
	font-weight: 600;
	color: #fff;
	background: var( --rp-blue );
	border: 1px solid var( --rp-blue );
	border-radius: var( --rp-radius );
	cursor: pointer;
}

.wrc-research-publications .wrc-rp__submit:hover { background: #0A3E7C; border-color: #0A3E7C; }

.wrc-research-publications .wrc-rp__clear {
	font-size: .86rem;
	color: var( --rp-ink-soft );
}

.wrc-research-publications .wrc-rp__count {
	margin: 0 0 1.1rem;
	padding-bottom: .9rem;
	font-size: .86rem;
	color: var( --rp-ink-soft );
	border-bottom: 1px solid var( --rp-line );
}

/* -- list ---------------------------------------------------------------- */

.wrc-research-publications .wrc-rp__list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var( --rp-line );
}

/*
 * Three columns on desktop: number, title, actions. The number column is fixed
 * so every title in the list starts on the same line and the column can be read
 * straight down.
 */
.wrc-research-publications .wrc-rp__item {
	display: grid;
	grid-template-columns: 8.5rem minmax( 0, 1fr ) auto;
	align-items: center;
	gap: .3rem 1.2rem;
	padding: .95rem .4rem;
	border-bottom: 1px solid var( --rp-line );
}

.wrc-research-publications .wrc-rp__item:hover { background: var( --rp-bg ); }

.wrc-research-publications .wrc-rp__num {
	font-size: .78rem;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
	letter-spacing: .02em;
	color: var( --rp-ink-soft );
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.wrc-research-publications .wrc-rp__body { min-width: 0; }

.wrc-research-publications .wrc-rp__title {
	font-size: .98rem;
	font-weight: 500;
	line-height: 1.4;
	color: var( --rp-blue );
	text-decoration: none;
}

.wrc-research-publications .wrc-rp__title:hover {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.wrc-research-publications .wrc-rp__title:focus-visible {
	outline: 2px solid var( --rp-cyan );
	outline-offset: 2px;
}

/* Falls back to the number, so it should not masquerade as a title. */
.wrc-research-publications .wrc-rp__title--untitled {
	font-weight: 400;
	font-style: italic;
	color: var( --rp-ink-soft );
}

/* -- actions ------------------------------------------------------------- */

.wrc-research-publications .wrc-rp__actions {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem .4rem;
	justify-content: flex-end;
}

.wrc-research-publications .wrc-rp__btn {
	display: inline-flex;
	align-items: baseline;
	gap: .4rem;
	padding: .4rem .85rem;
	font-size: .8rem;
	font-weight: 600;
	white-space: nowrap;
	text-decoration: none;
	border-radius: 999px;
	transition: background-color .16s ease, color .16s ease, border-color .16s ease;
}

.wrc-research-publications .wrc-rp__btn--view {
	color: #fff;
	background: var( --rp-blue );
	border: 1px solid var( --rp-blue );
}

.wrc-research-publications .wrc-rp__btn--view:hover { background: #0A3E7C; border-color: #0A3E7C; }

.wrc-research-publications .wrc-rp__btn--dl {
	color: var( --rp-blue );
	background: #fff;
	border: 1px solid #C3D3E6;
}

.wrc-research-publications .wrc-rp__btn--dl:hover {
	color: #fff;
	background: var( --rp-blue );
	border-color: var( --rp-blue );
}

.wrc-research-publications .wrc-rp__btn:focus-visible {
	outline: 2px solid var( --rp-cyan );
	outline-offset: 2px;
}

.wrc-research-publications .wrc-rp__size { font-size: .72rem; font-weight: 500; opacity: .72; }

/* -- narrow screens ------------------------------------------------------
 *
 * The three columns collapse to a stack: number above, then title, then the
 * actions on their own line. A fixed number column would squeeze the title to
 * a few words a line on a phone.
 * ---------------------------------------------------------------------- */

@media ( max-width: 780px ) {

	.wrc-research-publications .wrc-rp__item {
		grid-template-columns: minmax( 0, 1fr );
		gap: .45rem;
		padding: 1rem .2rem;
	}

	.wrc-research-publications .wrc-rp__actions { justify-content: flex-start; }
}

/* -- pagination ---------------------------------------------------------- */

.wrc-research-publications .wrc-rp__pager {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin-top: 1.6rem;
	text-align: center;
}

/* The theme options CSS gives .page-numbers width: 1180px !important and
   border-color: #fff !important. Both are answered here with a heavier
   selector; without this the pager renders one item per line with no
   visible borders. */
.wrc-research-publications .wrc-rp__pager .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: auto !important;
	max-width: none !important;
	min-width: 2.3rem;
	margin: 0;
	padding: .45rem .7rem !important;
	font-size: .86rem;
	line-height: 1.2;
	white-space: nowrap;
	text-align: center;
	text-decoration: none;
	color: var( --rp-blue );
	background: #fff;
	border: 1px solid var( --rp-line ) !important;
	border-radius: 6px;
	float: none;
}

.wrc-research-publications .wrc-rp__pager .page-numbers:hover {
	background: var( --rp-bg );
	border-color: var( --rp-line ) !important;
}

.wrc-research-publications .wrc-rp__pager .page-numbers.current {
	color: #fff;
	background: var( --rp-blue );
	border-color: var( --rp-blue ) !important;
}

.wrc-research-publications .wrc-rp__pager .page-numbers.dots {
	background: transparent;
	border-color: transparent !important;
	color: var( --rp-ink-soft );
}

.wrc-research-publications .wrc-rp__empty {
	margin: 1.6rem 0 0;
	padding: 1.4rem;
	text-align: center;
	color: var( --rp-ink-soft );
	background: var( --rp-bg );
	border-radius: var( --rp-radius );
}

.wrc-research-publications .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect( 0 0 0 0 );
	white-space: nowrap;
	border: 0;
}