/**
 * plugins/themes/tifbr/styles/tifbr.css
 *
 * Visual layer for the TIFBR theme. Loaded after the parent (default) theme's
 * stylesheet, so it overrides rather than replaces it.
 */

:root {
	--tifbr-navy-deep: #0e1b32;
	--tifbr-navy: #16294d;
	--tifbr-navy-nav: #12223f;
	--tifbr-orange: #ED6A2C;
	--tifbr-orange-dark: #d4571b;
	--tifbr-orange-ink: #C24A12;
	--tifbr-orange-label: #A8410F;
	--tifbr-paper: #f4f2ee;
	--tifbr-ink: #16233d;
	--tifbr-line: #e2ddd3;
	--tifbr-line-soft: #eeeae2;
	--tifbr-muted: #6b7587;
	--tifbr-muted-warm: #6B6557;
	--tifbr-label: #5C6678;
	--tifbr-serif: "Source Serif 4", Georgia, serif;
	--tifbr-sans: "IBM Plex Sans", system-ui, sans-serif;
	--tifbr-mono: "IBM Plex Mono", ui-monospace, monospace;
	--tifbr-wrap: 1240px;
}

/*
 * The parent theme sets body to 14px/1.43. Left alone it collapses the 40px
 * hero heading into a 20px line box, so restore normal metrics for everything
 * this theme draws.
 */
body {
	background: var(--tifbr-paper);
	color: var(--tifbr-ink);
	font-family: var(--tifbr-sans);
	font-size: 16px;
	line-height: normal;
	-webkit-font-smoothing: antialiased;
}

.tifbr-wrap {
	max-width: var(--tifbr-wrap);
	margin: 0 auto;
	padding: 0 24px;
}

/* ---------------------------------------------------------------- top bar */

.tifbr-topbar {
	background: var(--tifbr-navy-deep);
	color: #b8c4d8;
	font-size: 12.5px;
}

.tifbr-topbar .tifbr-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	align-items: center;
	justify-content: space-between;
	min-height: 38px;
}

.tifbr-topbar__group {
	display: flex;
	gap: 14px;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tifbr-topbar__label {
	font-family: var(--tifbr-mono);
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #8c9dbb;
	font-size: 11px;
}

.tifbr-topbar a {
	color: #b8c4d8;
	text-decoration: none;
}

.tifbr-topbar a:hover,
.tifbr-topbar a:focus {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tifbr-topbar li.current > a,
.tifbr-topbar a.is-current {
	color: #fff;
	font-weight: 600;
	border-bottom: 2px solid var(--tifbr-orange);
	padding-bottom: 2px;
}

.tifbr-topbar__user {
	gap: 18px;
}

/* ----------------------------------------------------------------- header */

.tifbr-head {
	background: var(--tifbr-navy);
	color: #fff;
}

.tifbr-head__inner {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	align-items: center;
	justify-content: space-between;
	padding-top: 22px;
	padding-bottom: 22px;
}

.tifbr-brand {
	display: flex;
	gap: 18px;
	align-items: center;
	min-width: 0;
	text-decoration: none;
	color: inherit;
}

.tifbr-brand:hover,
.tifbr-brand:focus {
	text-decoration: none;
	color: inherit;
}

.tifbr-brand__mark {
	width: 74px;
	height: 74px;
	flex: none;
	background: var(--tifbr-orange);
	display: grid;
	place-items: center;
	font-family: var(--tifbr-serif);
	font-weight: 700;
	font-size: 20px;
	letter-spacing: .02em;
	color: #fff;
}

.tifbr-brand__logo {
	max-height: 74px;
	width: auto;
	flex: none;
}

.tifbr-brand__title {
	font-family: var(--tifbr-serif);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: -0.01em;
	margin: 0;
	color: #fff;
}

.tifbr-brand__meta {
	margin-top: 7px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	font-size: 12px;
	color: #9fb0cc;
	font-family: var(--tifbr-mono);
}

/* Search box in the header */

.tifbr-head .pkp_search {
	display: flex;
	align-items: center;
	background: rgba(255, 255, 255, .08);
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 2px;
	padding: 0 12px;
	height: 42px;
	min-width: 260px;
	position: static;
	float: none;
	margin: 0;
}

/* Drawn rather than typed: U+2315 is missing from IBM Plex Mono and falls back
   to a glyph that reads as a stray letter. */
.tifbr-head .pkp_search::before {
	content: "";
	flex: none;
	width: 15px;
	height: 15px;
	background: no-repeat center/15px 15px url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%238fa2c0' stroke-width='1.6'%3E%3Ccircle cx='6.8' cy='6.8' r='4.6'/%3E%3Cpath d='M10.4 10.4 L14 14' stroke-linecap='round'/%3E%3C/svg%3E");
}

.tifbr-head .pkp_search input[type="text"] {
	flex: 1;
	min-width: 0;
	border: 0;
	background: transparent;
	color: #fff;
	font-family: inherit;
	font-size: 13.5px;
	padding: 0 10px;
	outline: none;
	height: auto;
	box-shadow: none;
}

.tifbr-head .pkp_search input[type="text"]::placeholder {
	color: #8fa2c0;
}

/*
 * The submit button and search controls stay available to assistive tech but
 * are not drawn. The parent parks them at left:-9999px, which is invisible in
 * LTR but scrolls the page in RTL, so pin them in place instead.
 */
.tifbr-head .pkp_search button,
.tifbr-head .pkp_search .search_controls {
	position: absolute;
	left: auto !important;
	right: auto !important;
	inset-inline-start: 0 !important;
	top: 0;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	white-space: nowrap;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
}

/* -------------------------------------------------------------- main menu */

.tifbr-nav {
	border-top: 1px solid rgba(255, 255, 255, .12);
	background: var(--tifbr-navy-nav);
}

.tifbr-nav .tifbr-wrap {
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
}

.tifbr-nav ul {
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
	margin: 0;
	padding: 0;
	list-style: none;
	width: 100%;
}

.tifbr-nav li {
	position: relative;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tifbr-nav a {
	display: block;
	color: #c3cfe2;
	font-size: 13.5px;
	font-weight: 500;
	padding: 13px 16px;
	border-bottom: 3px solid transparent;
	text-decoration: none;
}

.tifbr-nav a:hover,
.tifbr-nav a:focus {
	color: #fff;
	border-bottom-color: rgba(237, 106, 44, .5);
	text-decoration: none;
}

.tifbr-nav li.current > a,
.tifbr-nav li.is-current > a {
	color: #fff;
	font-weight: 600;
	border-bottom-color: var(--tifbr-orange);
}

/* Dropdowns from the stock nav markup */
.tifbr-nav li ul {
	display: none;
	position: absolute;
	z-index: 40;
	top: 100%;
	inset-inline-start: 0;
	min-width: 220px;
	width: auto;
	flex-direction: column;
	background: var(--tifbr-navy-nav);
	border: 1px solid rgba(255, 255, 255, .14);
	padding: 4px 0;
}

.tifbr-nav li:hover > ul,
.tifbr-nav li:focus-within > ul {
	display: flex;
}

.tifbr-nav li ul a {
	padding: 9px 16px;
	border-bottom: 0;
	white-space: nowrap;
}

/* ------------------------------------------------------------------- hero */

.tifbr-hero {
	background: var(--tifbr-navy);
}

.tifbr-hero .tifbr-wrap {
	padding-top: 44px;
	padding-bottom: 48px;
}

.tifbr-hero__row {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	align-items: flex-start;
}

.tifbr-hero__main {
	flex: 1 1 430px;
	min-width: 0;
}

.tifbr-hero__eyebrow {
	font-family: var(--tifbr-mono);
	font-size: 11.5px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--tifbr-orange);
}

.tifbr-hero__title {
	font-family: var(--tifbr-serif);
	font-weight: 600;
	font-size: 40px;
	line-height: 1.15;
	letter-spacing: -0.015em;
	color: #fff;
	margin: 16px 0 0;
	text-wrap: pretty;
}

.tifbr-hero__lede {
	margin: 18px 0 0;
	max-width: 62ch;
	font-size: 15.5px;
	line-height: 1.65;
	color: #ccd6e6;
	text-wrap: pretty;
}

.tifbr-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 28px;
}

.tifbr-btn,
.tifbr-btn:visited {
	font-weight: 600;
	font-size: 14.5px;
	padding: 14px 22px;
	border-radius: 2px;
	text-decoration: none;
	display: inline-block;
}

.tifbr-btn--primary,
.tifbr-btn--primary:visited {
	background: var(--tifbr-orange);
	color: #fff;
}

.tifbr-btn--primary:hover,
.tifbr-btn--primary:focus {
	background: var(--tifbr-orange-dark);
	color: #fff;
	text-decoration: none;
}

.tifbr-btn--ghost,
.tifbr-btn--ghost:visited {
	border: 1px solid rgba(255, 255, 255, .35);
	color: #fff;
}

.tifbr-btn--ghost:hover,
.tifbr-btn--ghost:focus {
	background: rgba(255, 255, 255, .1);
	color: #fff;
	text-decoration: none;
}

.tifbr-btn--quiet,
.tifbr-btn--quiet:visited {
	color: #9fb0cc;
	font-weight: 500;
	padding: 14px 4px;
}

.tifbr-btn--quiet:hover,
.tifbr-btn--quiet:focus {
	color: #fff;
	text-decoration: none;
}

/* Stat card, overlapping the bottom edge of the hero */

.tifbr-glance {
	flex: 1 1 290px;
	min-width: 0;
	position: relative;
	z-index: 2;
	margin-bottom: -76px;
	background: #fff;
	border: 1px solid #ddd8ce;
	border-top: 4px solid var(--tifbr-orange);
	padding: 24px;
	box-shadow: 0 14px 34px rgba(14, 27, 50, .18);
}

.tifbr-eyebrow {
	font-family: var(--tifbr-mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--tifbr-label);
}

.tifbr-eyebrow--accent {
	color: var(--tifbr-orange-label);
}

.tifbr-glance__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: #e6e1d8;
	margin-top: 18px;
}

.tifbr-glance__cell {
	background: #fff;
	padding-block: 14px;
	padding-inline: 0 4px;
}

.tifbr-glance__cell:nth-child(even) {
	padding-block: 14px;
	padding-inline: 16px 0;
}

.tifbr-glance__cell:nth-child(3) {
	padding-block: 14px 0;
	padding-inline: 0 4px;
}

.tifbr-glance__cell:nth-child(4) {
	padding-block: 14px 0;
	padding-inline: 16px 0;
}

.tifbr-glance__value {
	font-family: var(--tifbr-serif);
	font-size: 27px;
	font-weight: 600;
	color: var(--tifbr-navy);
}

.tifbr-glance__label {
	font-size: 12px;
	color: var(--tifbr-muted);
	margin-top: 3px;
}

.tifbr-glance__note {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid #e6e1d8;
	font-size: 13px;
	line-height: 1.6;
	color: #45506a;
}

.tifbr-glance__note strong {
	color: var(--tifbr-navy);
}

/* ------------------------------------------------- page body / two columns */

.pkp_structure_page {
	background: var(--tifbr-paper);
	max-width: none;
	margin: 0;
	padding: 0;
	border: 0;
	box-shadow: none;
}

.pkp_structure_content {
	max-width: var(--tifbr-wrap);
	margin: 0 auto;
	padding: 48px 24px 64px;
	display: grid;
	grid-template-columns: minmax(0, 1fr) 320px;
	gap: 40px;
	align-items: start;
	float: none;
	width: auto;
}

/* The stat card hangs 76px into this area on the homepage. */
body.pkp_page_index .pkp_structure_content {
	padding-top: 100px;
}

.pkp_structure_main {
	grid-column: 1;
	min-width: 0;
	width: auto;
	float: none;
	padding: 0;
	margin: 0;
	border: 0;
}

.pkp_structure_sidebar {
	grid-column: 2;
	min-width: 0;
	width: auto;
	float: none;
	padding: 0;
	margin: 0;
	border: 0;
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.pkp_structure_content:not(.has_sidebar) {
	grid-template-columns: minmax(0, 1fr);
}

.pkp_structure_content:not(.has_sidebar) .pkp_structure_main {
	grid-column: 1 / -1;
}

body.pkp_page_index .pkp_structure_main {
	display: flex;
	flex-direction: column;
	gap: 44px;
}

/* ---------------------------------------------------------- sidebar blocks */

.pkp_structure_sidebar .pkp_block {
	background: #fff;
	border: 1px solid var(--tifbr-line);
	padding: 18px;
	margin: 0;
	width: auto;
	float: none;
}

.pkp_structure_sidebar .pkp_block > .title,
.pkp_structure_sidebar .pkp_block > h2.title {
	font-family: var(--tifbr-mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--tifbr-label);
	font-weight: 400;
	margin: 0 0 14px;
	padding: 0;
	border: 0;
	background: none;
}

.pkp_structure_sidebar .pkp_block .content {
	font-size: 14px;
	line-height: 1.6;
	color: var(--tifbr-ink);
}

.pkp_structure_sidebar .pkp_block ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.pkp_structure_sidebar .pkp_block li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pkp_structure_sidebar .pkp_block a {
	color: var(--tifbr-navy);
	font-weight: 500;
	text-decoration: none;
}

.pkp_structure_sidebar .pkp_block a:hover,
.pkp_structure_sidebar .pkp_block a:focus {
	color: var(--tifbr-orange-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pkp_structure_sidebar .pkp_block img {
	max-width: 100%;
	height: auto;
}

/* --------------------------------------------------------- panel / section */

.tifbr-panel {
	background: #fff;
	border: 1px solid var(--tifbr-line);
}

.tifbr-panel__head {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: baseline;
	justify-content: space-between;
	padding: 22px 26px;
	border-bottom: 1px solid var(--tifbr-line);
}

.tifbr-h2 {
	font-family: var(--tifbr-serif);
	font-size: 25px;
	font-weight: 600;
	margin: 8px 0 0;
	color: var(--tifbr-navy);
	line-height: 1.2;
}

.tifbr-panel__meta {
	font-size: 13px;
	color: var(--tifbr-muted);
}

.tifbr-panel__meta strong {
	color: var(--tifbr-navy);
}

.tifbr-issue {
	display: flex;
	flex-wrap: wrap;
	gap: 26px;
	padding: 26px;
}

.tifbr-issue__cover {
	flex: 0 1 190px;
	min-width: 150px;
}

.tifbr-issue__cover img {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid #d8d2c7;
}

.tifbr-issue__cover--empty {
	aspect-ratio: 3 / 4;
	border: 1px solid #d8d2c7;
	background-color: #f0ede7;
	background-image: repeating-linear-gradient(135deg, #e6e1d8 0 6px, #f0ede7 6px 12px);
	display: grid;
	place-items: center;
	text-align: center;
	padding: 12px;
	font-family: var(--tifbr-mono);
	font-size: 10.5px;
	line-height: 1.5;
	color: #8a8375;
}

.tifbr-issue__actions {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin-top: 14px;
}

.tifbr-issue__actions a,
.tifbr-issue__actions .obj_galley_link {
	display: block;
	text-align: center;
	font-size: 13px;
	font-weight: 600;
	padding: 10px;
	text-decoration: none;
	background: var(--tifbr-navy);
	color: #fff;
	border: 0;
}

.tifbr-issue__actions a:hover,
.tifbr-issue__actions .obj_galley_link:hover,
.tifbr-issue__actions a:focus,
.tifbr-issue__actions .obj_galley_link:focus {
	background: var(--tifbr-navy-deep);
	color: #fff;
	text-decoration: none;
}

.tifbr-issue__actions .tifbr-issue__all,
.tifbr-issue__actions .tifbr-issue__all:visited {
	background: transparent;
	border: 1px solid #ccc5b8;
	color: var(--tifbr-navy);
}

.tifbr-issue__actions .tifbr-issue__all:hover,
.tifbr-issue__actions .tifbr-issue__all:focus {
	background: var(--tifbr-paper);
	color: var(--tifbr-navy);
	text-decoration: none;
}

.tifbr-issue__list {
	flex: 1 1 340px;
	min-width: 0;
}

.tifbr-issue__listhead {
	font-family: var(--tifbr-mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--tifbr-label);
	padding-bottom: 12px;
	border-bottom: 1px solid var(--tifbr-line);
}

.tifbr-section-title {
	font-family: var(--tifbr-serif);
	font-size: 17px;
	font-weight: 600;
	color: var(--tifbr-navy);
	margin: 22px 0 0;
}

/* ---------------------------------------------------------- article rows */

.tifbr-issue__list .cmp_article_list,
.tifbr-issue__list .articles {
	list-style: none;
	margin: 0;
	padding: 0;
}

.tifbr-issue__list .cmp_article_list > li {
	margin: 0;
	padding: 0;
	list-style: none;
	border-bottom: 1px solid var(--tifbr-line-soft);
}

.tifbr-issue__list .cmp_article_list > li:last-child {
	border-bottom: 0;
}

.tifbr-issue__list .obj_article_summary {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 8px 20px;
	padding: 16px 0;
	margin: 0;
	border: 0;
}

.tifbr-issue__list .obj_article_summary > .cover {
	display: none;
}

.tifbr-issue__list .obj_article_summary .title {
	grid-column: 1;
	margin: 0;
	padding: 0;
	font-family: var(--tifbr-sans);
	font-weight: 600;
	font-size: 15.5px;
	line-height: 1.45;
	text-wrap: pretty;
}

.tifbr-issue__list .obj_article_summary .title a {
	color: #14345f;
	text-decoration: none;
}

.tifbr-issue__list .obj_article_summary .title a:hover,
.tifbr-issue__list .obj_article_summary .title a:focus {
	color: var(--tifbr-orange-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tifbr-issue__list .obj_article_summary .subtitle {
	display: block;
	font-weight: 400;
	font-size: 14.5px;
	color: var(--tifbr-muted);
	margin-top: 3px;
}

.tifbr-issue__list .obj_article_summary .meta {
	grid-column: 1 / -1;
	grid-row: 2;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	align-items: center;
	margin: 0;
	padding: 0;
	border: 0;
}

.tifbr-issue__list .obj_article_summary .authors {
	font-size: 13px;
	color: var(--tifbr-muted);
	margin: 0;
	padding: 0;
}

/* Page range sits in the right-hand column of the first row. */
.tifbr-issue__list .obj_article_summary .pages {
	grid-column: 2;
	grid-row: 1;
	font-family: var(--tifbr-mono);
	font-size: 12px;
	color: var(--tifbr-muted-warm);
	white-space: nowrap;
	margin: 0;
	padding: 0;
	text-align: right;
}

.tifbr-issue__list .obj_article_summary .published {
	font-size: 13px;
	color: var(--tifbr-muted);
}

.tifbr-issue__list .obj_article_summary .galleys_links {
	grid-column: 1 / -1;
	grid-row: 3;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
}

.tifbr-issue__list .obj_article_summary .galleys_links > li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tifbr-issue__list .obj_galley_link,
.tifbr-issue__list .obj_galley_link:visited {
	display: inline-block;
	font-family: var(--tifbr-mono);
	font-size: 11px;
	letter-spacing: .06em;
	color: var(--tifbr-orange-ink);
	border: 1px solid #f0d3c1;
	padding: 4px 9px;
	background: transparent;
	text-decoration: none;
	border-radius: 0;
}

.tifbr-issue__list .obj_galley_link:hover,
.tifbr-issue__list .obj_galley_link:focus {
	background: #fdf3ed;
	color: var(--tifbr-orange-ink);
	text-decoration: none;
}

/* ------------------------------------------------------------ about block */

.tifbr-about__row {
	display: flex;
	flex-wrap: wrap;
	gap: 32px;
	margin-top: 20px;
	align-items: flex-start;
}

.tifbr-about__body {
	flex: 1 1 400px;
	min-width: 0;
	font-size: 15px;
	line-height: 1.72;
	color: #3d465c;
}

.tifbr-about__body p {
	margin: 0 0 14px;
}

.tifbr-about__body p:last-child {
	margin-bottom: 0;
}

.tifbr-about__body strong {
	color: var(--tifbr-navy);
}

.tifbr-card {
	flex: 1 1 280px;
	min-width: 0;
	background: #fff;
	border: 1px solid var(--tifbr-line);
	padding: 22px;
}

.tifbr-card__list {
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin: 16px 0 0;
	padding: 0;
}

.tifbr-card__list li {
	display: flex;
	gap: 10px;
	font-size: 14.5px;
	color: var(--tifbr-navy);
	line-height: 1.5;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tifbr-card__list li::before {
	content: "\2014";
	color: var(--tifbr-orange);
	flex: none;
}

.tifbr-card__foot {
	margin-top: 20px;
	padding-top: 16px;
	border-top: 1px solid var(--tifbr-line);
	font-size: 13.5px;
	line-height: 1.6;
	color: #45506a;
}

/* --------------------------------------------------------- announcements */

.tifbr-news__head {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	align-items: baseline;
	justify-content: space-between;
}

.tifbr-news__all {
	font-size: 13.5px;
	font-weight: 600;
	color: #14345f;
	text-decoration: none;
}

.tifbr-news__all:hover,
.tifbr-news__all:focus {
	color: var(--tifbr-orange-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.tifbr-news__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
	gap: 16px;
	margin-top: 20px;
	list-style: none;
	padding: 0;
}

.tifbr-news__card,
.tifbr-news__card:visited {
	display: block;
	background: #fff;
	border: 1px solid var(--tifbr-line);
	padding: 22px;
	text-decoration: none;
	color: inherit;
}

.tifbr-news__card:hover,
.tifbr-news__card:focus {
	border-color: var(--tifbr-orange);
	text-decoration: none;
	color: inherit;
}

.tifbr-news__card--lead,
.tifbr-news__card--lead:visited {
	background: var(--tifbr-navy);
	border-color: var(--tifbr-navy);
	color: #fff;
}

.tifbr-news__card--lead:hover,
.tifbr-news__card--lead:focus {
	background: var(--tifbr-navy-deep);
	border-color: var(--tifbr-navy-deep);
	color: #fff;
}

.tifbr-news__date {
	font-family: var(--tifbr-mono);
	font-size: 11px;
	color: var(--tifbr-muted-warm);
}

.tifbr-news__card--lead .tifbr-news__date {
	color: var(--tifbr-orange);
}

.tifbr-news__title {
	font-family: var(--tifbr-serif);
	font-size: 19px;
	font-weight: 600;
	line-height: 1.3;
	margin-top: 12px;
	color: var(--tifbr-navy);
	text-wrap: pretty;
}

.tifbr-news__card--lead .tifbr-news__title {
	color: #fff;
}

.tifbr-news__excerpt {
	font-size: 13.5px;
	line-height: 1.6;
	color: var(--tifbr-muted);
	margin-top: 10px;
}

.tifbr-news__card--lead .tifbr-news__excerpt {
	color: #ccd6e6;
}

/* ----------------------------------------------------------------- footer */

.pkp_structure_footer_wrapper {
	background: var(--tifbr-navy-deep);
	color: #9fb0cc;
	border: 0;
	margin: 0;
	padding: 0;
}

.pkp_structure_footer {
	max-width: var(--tifbr-wrap);
	margin: 0 auto;
	padding: 44px 24px;
	display: block;
	width: auto;
}

.pkp_footer_content {
	font-size: 13px;
	line-height: 1.65;
	color: #9fb0cc;
	width: auto;
	float: none;
	padding: 0;
	margin: 0;
}

.pkp_footer_content a {
	color: #b8c4d8;
	text-decoration: none;
}

.pkp_footer_content a:hover,
.pkp_footer_content a:focus {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pkp_footer_content img {
	max-width: 100%;
	height: auto;
}

.pkp_brand_footer {
	margin-top: 28px;
	padding-top: 18px;
	border-top: 1px solid rgba(255, 255, 255, .14);
	font-size: 12px;
	color: #6f80a0;
	width: auto;
	float: none;
	text-align: start;
}

.pkp_brand_footer img {
	max-height: 34px;
	width: auto;
	opacity: .75;
}

.tifbr-foot__contact {
	margin-top: 28px;
	padding-top: 28px;
	border-top: 1px solid rgba(255, 255, 255, .14);
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 28px;
}

.tifbr-foot__name {
	color: #fff;
	font-family: var(--tifbr-serif);
	font-size: 18px;
	font-weight: 600;
}

.tifbr-foot__addr {
	font-size: 13px;
	line-height: 1.65;
	margin-top: 10px;
}

.tifbr-foot__links {
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: 13.5px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.tifbr-foot__links li {
	margin: 0;
	padding: 0;
	list-style: none;
}

.tifbr-foot__links a {
	color: #b8c4d8;
	text-decoration: none;
}

.tifbr-foot__links a:hover,
.tifbr-foot__links a:focus {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* --------------------------------------------------------------- general */

a {
	color: #14345f;
}

a:hover,
a:focus {
	color: var(--tifbr-orange-dark);
	text-underline-offset: 3px;
}

/*
 * Wrapped in :where() so it carries zero specificity and never beats the
 * single-class button rules above it.
 */
:where(.tifbr-btn, .tifbr-news__card, .tifbr-issue__actions a) {
	font: inherit;
}

/* --------------------------------------------------------------- responsive */

@media (max-width: 1023px) {
	.pkp_structure_content {
		grid-template-columns: minmax(0, 1fr);
		gap: 32px;
	}

	.pkp_structure_sidebar {
		grid-column: 1;
	}

	.tifbr-glance {
		margin-bottom: 0;
	}

	body.pkp_page_index .pkp_structure_content {
		padding-top: 48px;
	}
}

@media (max-width: 767px) {
	.tifbr-hero__title {
		font-size: 30px;
	}

	.tifbr-brand__title {
		font-size: 20px;
	}

	.tifbr-brand__mark {
		width: 56px;
		height: 56px;
		font-size: 15px;
	}

	.tifbr-head .pkp_search {
		min-width: 0;
		width: 100%;
	}

	.tifbr-issue,
	.tifbr-panel__head {
		padding: 20px 16px;
	}

	.tifbr-wrap,
	.pkp_structure_content,
	.pkp_structure_footer {
		padding-left: 16px;
		padding-right: 16px;
	}
}

/* Indexing logos come from the journal's own footer HTML, which is a table of
   images made for a light background. Give them a plate so they stay legible. */
.pkp_footer_content table {
	width: 100%;
	border-collapse: separate;
	border-spacing: 12px;
	table-layout: fixed;
}

.pkp_footer_content td {
	background: rgba(255, 255, 255, .92);
	border-radius: 2px;
	padding: 10px;
	vertical-align: middle;
	text-align: center;
}

.pkp_footer_content .blockTitle {
	font-family: var(--tifbr-mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #6f80a0;
}

/* ===========================================================================
   Corrections against the parent theme, measured on the rendered page.
   ======================================================================== */

/* The parent paints the content wrapper white; the design puts every panel on
   the paper background instead. */
.pkp_structure_content {
	background: transparent;
}

/*
 * The parent theme collapses the header search into a 20px stub that its own
 * JS expands on click. This theme shows the field open, so give it real width
 * and stop the wrapper clipping it.
 */
.tifbr-head form.pkp_search {
	overflow: visible;
}

.tifbr-head form.pkp_search input[type="text"] {
	position: static;
	width: auto;
	flex: 1 1 auto;
	min-width: 0;
	height: 26px;
	margin: 0;
	clip: auto;
}

/* Parent sets a negative top margin on section headings, which pulls the h2
   up over its eyebrow. Element+class beats it. */
h2.tifbr-h2 {
	margin: 8px 0 0;
}

/*
 * Article rows.
 *
 * article_summary.tpl nests .pages inside .meta, so it cannot be placed by the
 * outer grid. Lay the row out with flex instead and pin the page range to the
 * top right, which puts title / page range / authors + galley chips exactly
 * where the design has them.
 */
.tifbr-issue__list .obj_article_summary {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 8px 16px;
	position: relative;
	padding: 16px 0;
	padding-inline-end: 76px;
}

.tifbr-issue__list .obj_article_summary .title {
	flex: 1 1 100%;
	margin: 0 0 4px;
}

.tifbr-issue__list .obj_article_summary .meta {
	flex: 0 1 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 8px 16px;
	align-items: baseline;
	grid-column: auto;
	grid-row: auto;
}

.tifbr-issue__list .obj_article_summary .galleys_links {
	flex: 0 1 auto;
	grid-column: auto;
	grid-row: auto;
}

.tifbr-issue__list .obj_article_summary .pages {
	position: absolute;
	top: 16px;
	inset-inline-end: 0;
	text-align: end;
}

@media (max-width: 599px) {
	.tifbr-issue__list .obj_article_summary {
		padding-inline-end: 0;
	}

	.tifbr-issue__list .obj_article_summary .pages {
		position: static;
		text-align: start;
	}
}

/* ===========================================================================
   Neutralising the journal's uploaded stylesheet
   (public/journals/1/styleSheet.css, set in Settings > Website > Appearance).
   It was written for the previous look and loads AFTER this file, so these
   overrides win on specificity rather than order. The uploaded file itself is
   left untouched, so removing it in the admin UI is all that is needed to
   retire these rules.
   ======================================================================== */

/* It pulls a tiled wallpaper from an unrelated third-party domain. */
html body {
	background-image: none;
	background-color: var(--tifbr-paper);
}

/* White plate and drop shadows around the content column. */
body .pkp_structure_content {
	background: transparent;
	box-shadow: none;
}

body .pkp_structure_head {
	box-shadow: none;
	margin-top: 0;
}

body .pkp_footer_content {
	background: transparent;
	box-shadow: none;
	padding-top: 0;
}

body .pkp_structure_footer_wrapper {
	background: var(--tifbr-navy-deep);
	border-bottom: 0;
}

/* The design ends on the OJS credit line, so bring it back. */
body .pkp_brand_footer {
	display: block;
	background: transparent;
	box-shadow: none;
}

/* Parent theme pulls the homepage's About heading up over its eyebrow. */
.pkp_page_index .homepage_about h2.tifbr-h2 {
	margin-top: 8px;
}

/*
 * The journal description is authored inside a legacy layout table carrying
 * width="688" and an inline height:950px. Left alone it overflows under the
 * scope card and reserves ~600px of empty space below the text. The inline
 * height can only be beaten by !important; the width attribute cannot.
 */
.tifbr-about__body table {
	width: 100%;
	max-width: 100%;
	height: auto !important;
	table-layout: fixed;
	border-collapse: collapse;
}

.tifbr-about__body table td,
.tifbr-about__body table th,
.tifbr-about__body table tr {
	height: auto !important;
	width: auto;
	padding: 0;
	vertical-align: top;
}

.tifbr-about__body ul {
	list-style: disc;
	margin: 0 0 14px;
	padding-inline-start: 20px;
}

.tifbr-about__body li {
	margin: 0 0 4px;
	list-style: disc;
}

.tifbr-about__body img {
	max-width: 100%;
	height: auto;
}

/* Footer credit line, matching the design's closing rule. */
.pkp_brand_footer {
	font-family: var(--tifbr-sans);
}

.pkp_brand_footer a {
	color: #6f80a0;
	text-decoration: none;
}

.pkp_brand_footer a:hover,
.pkp_brand_footer a:focus {
	color: #b8c4d8;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Parent adds a rule above the announcements and padding around the about
   block; the design spaces these with the column gap alone. */
.pkp_page_index .cmp_announcements {
	border-top: 0;
	padding-top: 0;
}

.pkp_page_index .homepage_about {
	padding: 0;
}

/*
 * Masthead with the journal's own uploaded logo. The wordmark is white with a
 * thin dark outline and everything around it is transparent, so it is designed
 * to sit straight on a dark ground -- no plate, no padding.
 */
.tifbr-brand--logo {
	flex-direction: column;
	align-items: flex-start;
	gap: 10px;
}

.tifbr-brand__logo {
	display: block;
	max-height: 74px;
	max-width: 100%;
	width: auto;
	height: auto;
	flex: none;
	background: transparent;
	padding: 0;
}

.tifbr-brand--logo .tifbr-brand__meta {
	margin-top: 0;
}

@media (max-width: 767px) {
	.tifbr-brand__logo {
		max-height: 52px;
	}
}

/*
 * Parent sets `.pkp_structure_main h2 { font-family: Lato; font-size: 18px;
 * line-height: 30px; font-weight: 700 }` at specificity (0,1,1), which beats a
 * bare .tifbr-h2. Match it on the element as well to take the section headings
 * back to the design's serif.
 */
.pkp_structure_main h2.tifbr-h2,
.pkp_structure_content h2.tifbr-h2 {
	font-family: var(--tifbr-serif);
	font-size: 25px;
	font-weight: 600;
	line-height: 1.2;
	color: var(--tifbr-navy);
	margin: 8px 0 0;
}

/* ===========================================================================
   Four defects found by measuring the rendered page against the design.
   ======================================================================== */

/*
 * 1. The parent theme clears floats with ::before/::after on the content and
 *    main wrappers. Those were harmless while these were block/float layouts,
 *    but this theme makes them grid and flex containers -- where pseudo
 *    elements become real items. They added an empty row plus a full 40px grid
 *    gap above the content, and another 44px flex gap above the page body,
 *    pushing the current-issue panel and the sidebar 84px too far down.
 */
.pkp_structure_content::before,
.pkp_structure_content::after,
.pkp_structure_main::before,
.pkp_structure_main::after,
.pkp_structure_sidebar::before,
.pkp_structure_sidebar::after {
	content: none;
	display: none;
}

/*
 * 2. #siteNav is an empty skip-link target that sits inside the nav. It was
 *    picking up the menu link padding and adding ~30px to the bar, making it
 *    taller than the design's 48px.
 */
.tifbr-nav #siteNav {
	display: block;
	width: 0;
	height: 0;
	padding: 0;
	margin: 0;
	border: 0;
	overflow: hidden;
}

/*
 * 3. Custom sidebar blocks are authored as <table class="hover">, whose own
 *    stylesheet paints navy rows with white text. This theme's sidebar link
 *    colour is more specific and was turning that text navy-on-navy, making
 *    the Additional Menu block unreadable. Hand those tables back.
 */
.pkp_structure_sidebar .pkp_block table.hover a,
.pkp_structure_sidebar .pkp_block table.hover tr a {
	color: #fff;
	font-weight: 500;
}

.pkp_structure_sidebar .pkp_block table.hover a:hover,
.pkp_structure_sidebar .pkp_block table.hover a:focus {
	color: #fff;
	text-decoration: underline;
	text-underline-offset: 3px;
}

.pkp_structure_sidebar .pkp_block table.hover th {
	font-family: var(--tifbr-mono);
	font-size: 11px;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-weight: 400;
}

/* 4. Parent leaves a stray rule under the announcements block. */
.pkp_page_index .cmp_announcements {
	border: 0;
}

/* Leftover rule under the masthead; the design separates the bar with the
   nav's own top border instead. */
.pkp_structure_head {
	border-bottom: 0;
}

/*
 * 5. Two more skip-link anchors behaving as layout items.
 *
 *    `<a id="pkp_content_main">` is the first child of .pkp_structure_main.
 *    Once that wrapper became a flex column it counted as a flex item, so the
 *    44px gap landed between the anchor and the page body -- pushing the
 *    current-issue panel 44px below the sidebar's first block. Absolutely
 *    positioned children are not flex items, which removes it from the gap
 *    without destroying the anchor the skip links jump to.
 */
.pkp_structure_main {
	position: relative;
}

.pkp_structure_main > #pkp_content_main {
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	height: 0;
	overflow: hidden;
}

/*
 * 6. The homepage sections all live inside .page_index_journal, so the 44px
 *    column gap set on .pkp_structure_main never applied between them -- it
 *    only ever saw one child. The sections were touching edge to edge, which
 *    is why About sat flush against the current-issue panel. Put the rhythm on
 *    the wrapper that actually holds them.
 */
.page_index_journal {
	display: flex;
	flex-direction: column;
	gap: 44px;
}


/* ===========================================================================
   Right-to-left (ar_IQ). Everything above uses logical properties so it mirrors
   on its own; these are the pieces that cannot.
   ======================================================================== */

/* Arrow glyphs are literal characters, so they do not mirror with direction. */
.tifbr-arrow {
	display: inline-block;
}

[dir="rtl"] .tifbr-arrow {
	transform: scaleX(-1);
}

/* The masthead meta and the mono labels read left-to-right even in Arabic
   (ISSNs and the accreditation name are Latin), so keep their run direction
   while letting the block itself sit on the correct side. */
[dir="rtl"] .tifbr-brand__meta {
	direction: ltr;
	justify-content: flex-end;
}

/* Page ranges are Latin numerals with an en dash. */
[dir="rtl"] .tifbr-issue__list .obj_article_summary .pages {
	direction: ltr;
}

/*
 * RTL: the parent hides screen-reader-only text by pushing it to left:-2000px,
 * and its right-to-left build flips that to right:-2000px. Off to the left is
 * harmless; off to the right overflows the page and gave Arabic an 11,000px
 * horizontal scrollbar. Swap in the visually-hidden pattern that occupies no
 * space at all, keeping the parent's focus behaviour for the skip links.
 */
[dir="rtl"] .pkp_screen_reader,
[dir="rtl"] .cmp_skip_to_content a,
[dir="rtl"] .pkp_page_index .cmp_announcements h2,
[dir="rtl"] .pkp_page_index .journals h2 {
	/* The measured winner is `right: -2000px`, and the parent marks this rule's
	   `position` !important, so plain declarations lose. Physical first, then
	   the logical property last so it is the one that lands on `right`. */
	left: auto !important;
	right: auto !important;
	inset-inline-start: 0 !important;
	inset-inline-end: auto !important;
	top: 0;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	border: 0;
	overflow: hidden;
	white-space: nowrap;
	clip-path: inset(50%);
}

[dir="rtl"] .pkp_screen_reader:focus,
[dir="rtl"] .cmp_skip_to_content a:focus,
[dir="rtl"] .pkp_page_index .cmp_announcements h2:focus {
	width: auto;
	height: auto;
	margin: 0;
	padding: 10px;
	clip-path: none;
	left: auto !important;
	right: auto !important;
	inset-inline-start: 5px !important;
	top: 5px;
}

/* Same trick, same direction problem, on the parent's dropdown and toggle. */
[dir="rtl"] .pkp_nav_list ul {
	left: auto;
	right: auto;
	inset-inline-start: -9999px;
}

[dir="rtl"] .pkp_search_desktop input[type="text"] {
	left: auto;
	right: auto;
}

/*
 * In stock OJS the announcements <h2> is only a skip-link target, so the parent
 * hides it with `position: absolute !important; left: -2000px; clip: …`. This
 * design uses it as a visible section title ("News and calls"), so put it back
 * into the flow. Needs !important to beat the parent's own !important.
 */
.pkp_page_index .cmp_announcements h2.tifbr-h2,
.pkp_page_index .journals h2.tifbr-h2 {
	position: static !important;
	clip: auto !important;
	clip-path: none;
	left: auto;
	right: auto;
	top: auto;
	width: auto;
	height: auto;
	margin: 8px 0 0;
	padding: 0;
	overflow: visible;
	background: none;
	box-shadow: none;
}